:root {
    /* Override Bootstrap's default color variables */
    --bs-blue: #102338 !important;
    --bs-primary: #102338 !important;
    --bs-primary-rgb: 16, 35, 56 !important;
    --bs-secondary: #9FA6B2 !important;
    --bs-secondary-rgb: 159, 166, 178 !important;
    /* Custom accent colors */
    --bs-accent-lime: #CCFF00 !important;
    --bs-teal: #17C3B2 !important;
}

/* Force these overrides for all Bootstrap components */
.btn-primary {
    --bs-btn-bg: var(--bs-primary) !important;
    --bs-btn-border-color: var(--bs-primary) !important;
    --bs-btn-hover-bg: #0a1c2c !important;
    --bs-btn-hover-border-color: #081824 !important;
    --bs-btn-active-bg: #081824 !important;
    --bs-btn-active-border-color: #06141e !important;
}

.btn-secondary {
    --bs-btn-bg: var(--bs-secondary) !important;
    --bs-btn-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-bg: #8c939e !important;
    --bs-btn-hover-border-color: #838a96 !important;
    --bs-btn-active-bg: #838a96 !important;
    --bs-btn-active-border-color: #7a818d !important;
}

/* Custom button styles */
.btn-accent-lime {
    --bs-btn-color: #000 !important;
    --bs-btn-bg: var(--bs-accent-lime) !important;
    --bs-btn-border-color: var(--bs-accent-lime) !important;
    --bs-btn-hover-color: #000 !important;
    --bs-btn-hover-bg: #b3e600 !important;
    --bs-btn-hover-border-color: #a6d900 !important;
    --bs-btn-active-bg: #a6d900 !important;
    --bs-btn-active-border-color: #99cc00 !important;
}

.btn-teal {
    --bs-btn-color: #fff !important;
    --bs-btn-bg: var(--bs-teal) !important;
    --bs-btn-border-color: var(--bs-teal) !important;
    --bs-btn-hover-color: #fff !important;
    --bs-btn-hover-bg: #14a99c !important;
    --bs-btn-hover-border-color: #139e92 !important;
    --bs-btn-active-bg: #139e92 !important;
    --bs-btn-active-border-color: #129387 !important;
}

/* Utility classes */
.bg-accent-lime {
    background-color: var(--bs-accent-lime) !important !important;
    color: #000 !important !important;
}

.text-accent-lime {
    color: var(--bs-accent-lime) !important !important;
}

.bg-teal {
    background-color: var(--bs-teal) !important !important;
    color: #fff !important !important;
}

.text-teal {
    color: var(--bs-teal) !important !important;
}

/* Override other Bootstrap components */
.alert-primary {
    --bs-alert-color: var(--bs-primary) !important;
    --bs-alert-bg: #d0d6de !important;
    --bs-alert-border-color: #8191a4 !important;
}

.badge.bg-primary {
    background-color: var(--bs-primary) !important !important;
}

--bs-border-color: #9FA6B2 !important; /* Cool Gray for default border */
--bs-focus-border-color: #102338 !important; /* Navy Blue on focus */
--bs-focus-box-shadow: 0 0 0 0.25rem rgba(16, 35, 56, 0.25) !important;


.form-control,
.form-select {
    --bs-border-color: #9FA6B2 !important;
    --bs-focus-border-color: #102338 !important;
    --bs-focus-box-shadow: 0 0 0 0.25rem rgba(16, 35, 56, 0.25) !important;
}

    /* Override focus styles for ALL interactive elements */
    .btn:focus,
    .btn:active:focus,
    .btn-link.nav-link:focus,
    .form-control:focus,
    .form-check-input:focus,
    .form-select:focus,
    .page-link:focus,
    .accordion-button:focus,
    .dropdown-toggle:focus {
        outline: 0 !important;
        border-color: #102338 !important; /* Navy Blue border */
        box-shadow: 0 0 0 0.25rem rgba(16, 35, 56, 0.25) !important; /* Navy Blue shadow */
    }

/* Specific focus styles for primary buttons */
.btn-primary:focus,
.btn-primary:active:focus {
    border-color: #081824 !important; /* Darker Navy Blue */
    box-shadow: 0 0 0 0.25rem rgba(16, 35, 56, 0.5) !important; /* Stronger Navy Blue shadow */
}

/* Specific focus styles for secondary buttons */
.btn-secondary:focus,
.btn-secondary:active:focus {
    border-color: #7a818d !important; /* Darker Cool Gray */
    box-shadow: 0 0 0 0.25rem rgba(159, 166, 178, 0.5) !important; /* Cool Gray shadow */
}

/* Specific focus styles for accent buttons */
.btn-accent-lime:focus,
.btn-accent-lime:active:focus {
    border-color: #a6d900 !important; /* Darker Neon Lime */
    box-shadow: 0 0 0 0.25rem rgba(204, 255, 0, 0.5) !important; /* Neon Lime shadow */
}

.btn-teal:focus,
.btn-teal:active:focus {
    border-color: #139e92 !important; /* Darker Teal */
    box-shadow: 0 0 0 0.25rem rgba(23, 195, 178, 0.5) !important; /* Teal shadow */
}

/* Focus styles for navigation links */
.nav-link:focus {
    color: #102338 !important; /* Navy Blue text on focus */
    background-color: rgba(16, 35, 56, 0.1) !important; /* Light Navy Blue background */
}

/* Focus styles for dropdowns */
.dropdown-item:focus {
    background-color: #102338 !important; /* Navy Blue background */
    color: white !important;
}

/* Focus styles for pagination */
.page-link:focus {
    background-color: #102338 !important;
    color: white !important;
    border-color: #102338 !important;
}