/* ================================================================
   OLsA Admin Theme — matches the public landing page colour scheme
   Navy: #1a3a6c  |  Gold: #c8a951  |  Dark: #0e2144  |  Light: #f4f6fb
   ================================================================ */

@import url('https://fonts.bunny.net/css?family=nunito:400,600,700|lato:400,700');

:root {
    --olsa-navy:  #1a3a6c;
    --olsa-gold:  #c8a951;
    --olsa-light: #f4f6fb;
    --olsa-dark:  #0e2144;
}

/* ── Global ── */
body,
.content-wrapper,
.main-footer {
    font-family: 'Lato', sans-serif;
}

/* ── Content Background ── */
.content-wrapper {
    background-color: var(--olsa-light) !important;
}
.main-footer {
    background-color: #fff;
    border-top: 1px solid #dee2e6;
    color: #6c757d;
}

/* ── Sidebar ── */
.main-sidebar {
    background-color: var(--olsa-dark) !important;
}
.main-sidebar .brand-link {
    background-color: var(--olsa-navy) !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.25) !important;
}
.main-sidebar .brand-text {
    font-family: 'Nunito', sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    color: #fff !important;
    letter-spacing: .4px;
}
/* Gold accent on active nav item */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link {
    background-color: var(--olsa-gold) !important;
    color: var(--olsa-dark) !important;
    font-weight: 700;
}
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active .nav-icon,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link .nav-icon {
    color: var(--olsa-dark) !important;
}
/* Hover state */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:not(.active):hover {
    background: rgba(200, 169, 81, .12) !important;
    color: var(--olsa-gold) !important;
}
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:not(.active):hover .nav-icon {
    color: var(--olsa-gold) !important;
}
/* Nav icon default */
.sidebar-dark-primary .nav-link .nav-icon {
    color: rgba(255, 255, 255, .65);
}
/* Section headers */
.nav-header {
    color: var(--olsa-gold) !important;
    font-size: .7rem;
    letter-spacing: 1.2px;
    font-weight: 700;
    opacity: .9;
}
/* Submenu */
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link:hover {
    background: rgba(200, 169, 81, .08) !important;
    color: var(--olsa-gold) !important;
}
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active {
    background: rgba(200, 169, 81, .18) !important;
    color: var(--olsa-gold) !important;
}
/* Sidebar scrollbar */
.main-sidebar .sidebar {
    scrollbar-color: rgba(200,169,81,.4) transparent;
}

/* ── Top Navbar ── */
.main-header.navbar {
    background-color: var(--olsa-navy) !important;
    border-bottom: 2px solid var(--olsa-gold) !important;
}
.main-header .navbar-nav .nav-link,
.main-header .navbar-toggler {
    color: rgba(255, 255, 255, .85) !important;
}
.main-header .navbar-nav .nav-link:hover {
    color: var(--olsa-gold) !important;
}
/* Breadcrumb text in top nav header */
.content-header h1 {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
    color: var(--olsa-navy);
}
.breadcrumb-item,
.breadcrumb-item a,
.breadcrumb-item.active {
    color: var(--olsa-navy) !important;
}
.breadcrumb-item + .breadcrumb-item::before {
    color: var(--olsa-gold);
}

/* ── Buttons — primary ── */
.btn-primary {
    background-color: var(--olsa-navy) !important;
    border-color: var(--olsa-navy) !important;
    color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--olsa-dark) !important;
    border-color: var(--olsa-dark) !important;
}
.btn-outline-primary {
    color: var(--olsa-navy) !important;
    border-color: var(--olsa-navy) !important;
}
.btn-outline-primary:hover {
    background-color: var(--olsa-navy) !important;
    color: #fff !important;
}
/* Gold accent button */
.btn-warning {
    background-color: var(--olsa-gold) !important;
    border-color: var(--olsa-gold) !important;
    color: var(--olsa-dark) !important;
    font-weight: 700;
}
.btn-warning:hover {
    background-color: #e0bc5f !important;
    border-color: #e0bc5f !important;
}

/* ── Cards ── */
.card-primary.card-outline {
    border-top: 3px solid var(--olsa-navy) !important;
}
.card-primary > .card-header {
    background-color: var(--olsa-navy) !important;
    color: #fff;
}
.card-info.card-outline {
    border-top: 3px solid var(--olsa-gold) !important;
}
.card {
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(26,58,108,.07);
}

/* ── Info Boxes ── */
.info-box.bg-primary {
    background-color: var(--olsa-navy) !important;
}

/* ── Nav Tabs (in payment gateway page etc.) ── */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: var(--olsa-navy) !important;
    border-bottom-color: var(--olsa-gold);
    border-bottom-width: 3px;
    font-weight: 700;
}
.nav-tabs .nav-link:hover {
    color: var(--olsa-navy);
}

/* ── Badges / Labels ── */
.badge-primary {
    background-color: var(--olsa-navy) !important;
}

/* ── Links ── */
a:not(.btn):not(.nav-link):not(.brand-link) {
    color: var(--olsa-navy);
}
a:not(.btn):not(.nav-link):not(.brand-link):hover {
    color: var(--olsa-gold);
}

/* ── Sidebar mini icon (collapsed) ── */
.sidebar-mini-icon {
    color: var(--olsa-gold) !important;
}

/* ── Auth Pages (login/register) ── */
.login-page,
.register-page {
    background: linear-gradient(135deg, var(--olsa-dark) 0%, var(--olsa-navy) 100%);
}
.login-page .login-logo a,
.register-page .register-logo a {
    color: #fff !important;
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
}
.login-page .login-logo a span,
.register-page .register-logo a span {
    color: var(--olsa-gold) !important;
}
.login-box .card-outline.card-primary {
    border-top: 4px solid var(--olsa-gold) !important;
}
