/*!
 * INIZ Lagom2 theme-custom.css
 * Overrides only — values identical to default.css are omitted.
 * Primary gradient matches FAQ bg-secondary-hero-gradient.
 */

:root {
    /* Gray mid-stop nudged toward FAQ hero */
    --gray-gradient-end:                            #F2F5F9;

    /* FAQ secondary-hero: #E9F1FF → #FFFFFF */
    --brand-primary-gradient-start:                 #E9F1FF;
    --brand-primary-gradient-end:                   #FFFFFF;
    --brand-primary-gradient-h:                     linear-gradient( 118deg, var(--brand-primary-gradient-start) 0%, var(--brand-primary-gradient-end) 100%);
    --brand-primary-gradient-v:                     linear-gradient( 180deg, var(--brand-primary-gradient-start) 0%, var(--brand-primary-gradient-end) 100%);
}

.lagom-dark-mode {
    --dark-mode-gray-gradient-start:                            #2E2E2E;
    --dark-mode-gray-gradient-end:                              #404040;

    /* FAQ dark --hero-secondary mix equivalents */
    --dark-mode-brand-primary-gradient-start:                   #222D46;
    --dark-mode-brand-primary-gradient-end:                     #2E2E2E;
    --dark-mode-brand-primary-gradient-h:                       linear-gradient( 118deg, var(--dark-mode-brand-primary-gradient-start) 0%, var(--dark-mode-brand-primary-gradient-end) 100%);
    --dark-mode-brand-primary-gradient-v:                       linear-gradient( 180deg, var(--dark-mode-brand-primary-gradient-start) 0%, var(--dark-mode-brand-primary-gradient-end) 100%);

    --brand-primary-gradient-h:                                 linear-gradient( 118deg, var(--dark-mode-brand-primary-gradient-start) 0%, var(--dark-mode-brand-primary-gradient-end) 100%);
    --brand-primary-gradient-v:                                 linear-gradient( 180deg, var(--dark-mode-brand-primary-gradient-start) 0%, var(--dark-mode-brand-primary-gradient-end) 100%);

    --dark-mode-body-bg:                                        #2E2E2E;
    --body-bg:                                                  var(--dark-mode-body-bg);
}

/*
 * Top bar only (.app-nav-header) — matches marketing .site-top-navbar
 * (bg-navy + greyish text-white/80). Main menu styled separately below.
 * Account / notification dropdowns keep solid panel + grey text, blue on hover.
 */
.app-nav-header,
.app-nav-header.menu-hover-option {
    --iniz-topbar-bg: #17191C;
    --iniz-topbar-text: #D1D1D2; /* white/80 over navy */
    --iniz-topbar-text-muted: #A2A3A4; /* white/60 over navy */
    --iniz-topbar-text-hover: #ffffff;
    --top-nav-link-active-color: #ffffff;

    background: var(--iniz-topbar-bg) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Top-level header triggers only — exclude anything inside .dropdown-menu */
.app-nav-header .top-nav > li > a,
.app-nav-header .menu > li > a,
.app-nav-header .top-nav > li > a > .item-text,
.app-nav-header .menu > li > a > .item-text,
.app-nav-header .top-nav > li > a > i,
.app-nav-header .menu > li > a > i,
.app-nav-header .top-nav > li > a > .ls-caret,
.app-nav-header .menu > li > a > .ls-caret {
    color: var(--iniz-topbar-text) !important;
    opacity: 1 !important;
}

.app-nav-header .top-nav > li > a:hover,
.app-nav-header .top-nav > li > a:focus,
.app-nav-header .menu > li > a:hover,
.app-nav-header .menu > li > a:focus {
    color: var(--iniz-topbar-text-hover) !important;
}

/* Open / active / show trigger — white, not --top-nav-link-active-color blue */
.app-nav-header ul.top-nav > li.active > a:not(.btn),
.app-nav-header ul.top-nav > li.active > a:not(.btn) .item-text,
.app-nav-header ul.top-nav > li.active > a:not(.btn):active,
.app-nav-header ul.top-nav > li.active > a:not(.btn):focus,
.app-nav-header ul.top-nav > li.active > a:not(.btn):hover,
.app-nav-header ul.top-nav > li.open > a:not(.btn),
.app-nav-header ul.top-nav > li.open > a:not(.btn) .item-text,
.app-nav-header ul.top-nav > li.open > a:not(.btn):active,
.app-nav-header ul.top-nav > li.open > a:not(.btn):focus,
.app-nav-header ul.top-nav > li.open > a:not(.btn):hover,
.app-nav-header ul.top-nav > li.show > a:not(.btn),
.app-nav-header ul.top-nav > li.show > a:not(.btn) .item-text,
.app-nav-header ul.top-nav > li.show > a:not(.btn):active,
.app-nav-header ul.top-nav > li.show > a:not(.btn):focus,
.app-nav-header ul.top-nav > li.show > a:not(.btn):hover,
.app-nav-header ul.top-nav > li.active > a:not(.btn) > i,
.app-nav-header ul.top-nav > li.open > a:not(.btn) > i,
.app-nav-header ul.top-nav > li.show > a:not(.btn) > i,
.app-nav-header ul.top-nav > li.active > a:not(.btn) > .ls-caret,
.app-nav-header ul.top-nav > li.open > a:not(.btn) > .ls-caret,
.app-nav-header ul.top-nav > li.show > a:not(.btn) > .ls-caret,
.app-nav-header .menu > li.active > a:not(.btn),
.app-nav-header .menu > li.active > a:not(.btn) .item-text,
.app-nav-header .menu > li.open > a:not(.btn),
.app-nav-header .menu > li.open > a:not(.btn) .item-text,
.app-nav-header .menu > li.show > a:not(.btn),
.app-nav-header .menu > li.show > a:not(.btn) .item-text,
.app-nav-header .menu > li.active > a:not(.btn) > i,
.app-nav-header .menu > li.open > a:not(.btn) > i,
.app-nav-header .menu > li.show > a:not(.btn) > i,
.app-nav-header .menu > li.active > a:not(.btn) > .ls-caret,
.app-nav-header .menu > li.open > a:not(.btn) > .ls-caret,
.app-nav-header .menu > li.show > a:not(.btn) > .ls-caret {
    color: var(--iniz-topbar-text-hover) !important;
}

/* When a dropdown is open, keep the trigger light — but not nested links */
.app-nav-header .top-nav > li:hover > a,
.app-nav-header .menu > li:hover > a,
.app-nav-header .top-nav > li.open > a,
.app-nav-header .menu > li.open > a,
.app-nav-header .top-nav > li.show > a,
.app-nav-header .menu > li.show > a,
.app-nav-header .top-nav > li.active > a,
.app-nav-header .menu > li.active > a {
    color: var(--iniz-topbar-text-hover) !important;
}

.app-nav-header .app-nav-toggle .icon-bar {
    background-color: var(--iniz-topbar-text) !important;
}

/* Notification bell — match topbar text; white on hover (not blue) */
.app-nav-header .notification-icon-container,
.app-nav-header .notification-icon-container i,
.app-nav-header .notification-icon-container .lm-bell,
.app-nav-header .nav-item-icon-only > a .notification-icon-container,
.app-nav-header .nav-item-icon-only > a .notification-icon-container i {
    color: var(--iniz-topbar-text) !important;
    opacity: 1 !important;
}

.app-nav-header .nav-item-icon-only > a:hover .notification-icon-container,
.app-nav-header .nav-item-icon-only > a:hover .notification-icon-container i,
.app-nav-header .nav-item-icon-only > a:focus .notification-icon-container,
.app-nav-header .nav-item-icon-only > a:focus .notification-icon-container i,
.app-nav-header .nav-item-icon-only:hover > a .notification-icon-container,
.app-nav-header .nav-item-icon-only:hover > a .notification-icon-container i,
.app-nav-header .nav-item-icon-only.open > a .notification-icon-container,
.app-nav-header .nav-item-icon-only.open > a .notification-icon-container i,
.app-nav-header .nav-item-icon-only.show > a .notification-icon-container,
.app-nav-header .nav-item-icon-only.show > a .notification-icon-container i {
    color: var(--iniz-topbar-text-hover) !important;
}

/* Account / alerts dropdowns: opaque panel, grey text, blue only on hover */
.app-nav-header .dropdown-menu,
.app-nav-header .dropdown-menu.dropdown-lazy,
.app-nav-header .dropdown-menu.dropdown-menu-right,
.app-nav-header .dropdown-menu.client-alerts,
.app-nav-header .nav-item-icon-only .dropdown-menu,
.app-nav-header .dropdown.secondary .dropdown-menu {
    --top-nav-link-color: var(--gray-base);
    --top-nav-link-active-color: var(--brand-primary);
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: var(--gray-base) !important;
    border: 1px solid var(--gray-lighter-3, #DEE0E3) !important;
    box-shadow: 0 8px 24px rgba(23, 25, 28, 0.12) !important;
}

.app-nav-header .dropdown-menu > li > a,
.app-nav-header .dropdown-menu > li > a .item-text,
.app-nav-header .dropdown-menu > li > a .menu-item-content,
.app-nav-header .dropdown-menu > li > a > i,
.app-nav-header .dropdown-menu > li > a .ls-caret,
.app-nav-header .dropdown-menu.client-alerts > li > a,
.app-nav-header .dropdown-menu.client-alerts > li > a .item-text,
.app-nav-header .dropdown-menu.client-alerts > li > a > i {
    color: var(--gray-base) !important;
    opacity: 1 !important;
}

.app-nav-header .dropdown-menu > li > a:hover,
.app-nav-header .dropdown-menu > li > a:focus,
.app-nav-header .dropdown-menu > li.active > a,
.app-nav-header .dropdown-menu > li:hover > a,
.app-nav-header .dropdown-menu.client-alerts > li > a:hover,
.app-nav-header .dropdown-menu.client-alerts > li > a:focus {
    color: var(--brand-primary) !important;
}

.app-nav-header .dropdown-menu > li > a:hover .item-text,
.app-nav-header .dropdown-menu > li > a:hover .menu-item-content,
.app-nav-header .dropdown-menu > li > a:hover > i,
.app-nav-header .dropdown-menu > li > a:focus .item-text,
.app-nav-header .dropdown-menu > li > a:focus .menu-item-content,
.app-nav-header .dropdown-menu > li > a:focus > i,
.app-nav-header .dropdown-menu > li:hover > a .item-text,
.app-nav-header .dropdown-menu > li:hover > a .menu-item-content,
.app-nav-header .dropdown-menu > li:hover > a > i {
    color: var(--brand-primary) !important;
}

/*
 * Main menu (.app-nav-menu) — matches marketing site-main-navbar links
 * Default: --nav-link / --gray-lighter (#595E69)
 * Hover / open / active: foreground/75 + bold on active
 * Background: primary gradient vertical start (#E9F1FF)
 */
.app-nav-menu,
.app-nav-menu.app-nav-menu-default,
.app-nav-menu.menu-hover-option {
    --iniz-main-nav-link: var(--gray-lighter, #595E69);
    --iniz-main-nav-link-hover: rgba(23, 25, 28, 0.75); /* foreground/75 */
    --iniz-main-nav-link-active: rgba(23, 25, 28, 0.75);
    --top-nav-link-color: var(--iniz-main-nav-link);
    --top-nav-link-active-color: var(--iniz-main-nav-link-active);

    background-color: var(--brand-primary-gradient-start, #E9F1FF) !important;
    background: var(--brand-primary-gradient-start, #E9F1FF) !important;
}

/* Top-level main-nav links only (not dropdown items) */
.app-nav-menu .menu > li > a:not(.btn),
.app-nav-menu .menu > li > a:not(.btn) .item-text,
.app-nav-menu .menu > li > a:not(.btn) > i,
.app-nav-menu .menu > li > a:not(.btn) > .ls-caret,
.app-nav-menu .top-nav > li > a:not(.btn),
.app-nav-menu .top-nav > li > a:not(.btn) .item-text,
.app-nav-menu .top-nav > li > a:not(.btn) > i,
.app-nav-menu .top-nav > li > a:not(.btn) > .ls-caret {
    color: var(--iniz-main-nav-link) !important;
    font-weight: 500 !important;
    opacity: 1 !important;
}

.app-nav-menu .menu > li > a:not(.btn):hover,
.app-nav-menu .menu > li > a:not(.btn):hover .item-text,
.app-nav-menu .menu > li > a:not(.btn):hover > i,
.app-nav-menu .menu > li > a:not(.btn):hover > .ls-caret,
.app-nav-menu .menu > li > a:not(.btn):focus,
.app-nav-menu .menu > li > a:not(.btn):focus .item-text,
.app-nav-menu .menu > li:hover > a:not(.btn),
.app-nav-menu .menu > li:hover > a:not(.btn) .item-text,
.app-nav-menu .top-nav > li > a:not(.btn):hover,
.app-nav-menu .top-nav > li > a:not(.btn):hover .item-text,
.app-nav-menu .top-nav > li:hover > a:not(.btn),
.app-nav-menu .top-nav > li:hover > a:not(.btn) .item-text {
    color: var(--iniz-main-nav-link-hover) !important;
}

/* Active / open / show — bold like app activeNavLinkClass */
.app-nav-menu .menu > li.active > a:not(.btn),
.app-nav-menu .menu > li.active > a:not(.btn) .item-text,
.app-nav-menu .menu > li.active > a:not(.btn):hover,
.app-nav-menu .menu > li.active > a:not(.btn):focus,
.app-nav-menu .menu > li.open > a:not(.btn),
.app-nav-menu .menu > li.open > a:not(.btn) .item-text,
.app-nav-menu .menu > li.open > a:not(.btn):hover,
.app-nav-menu .menu > li.open > a:not(.btn):focus,
.app-nav-menu .menu > li.show > a:not(.btn),
.app-nav-menu .menu > li.show > a:not(.btn) .item-text,
.app-nav-menu .menu > li.show > a:not(.btn):hover,
.app-nav-menu .menu > li.show > a:not(.btn):focus,
.app-nav-menu .menu > li.active > a:not(.btn) > i,
.app-nav-menu .menu > li.open > a:not(.btn) > i,
.app-nav-menu .menu > li.show > a:not(.btn) > i,
.app-nav-menu .menu > li.active > a:not(.btn) > .ls-caret,
.app-nav-menu .menu > li.open > a:not(.btn) > .ls-caret,
.app-nav-menu .menu > li.show > a:not(.btn) > .ls-caret,
.app-nav-menu .top-nav > li.active > a:not(.btn),
.app-nav-menu .top-nav > li.active > a:not(.btn) .item-text,
.app-nav-menu .top-nav > li.open > a:not(.btn),
.app-nav-menu .top-nav > li.open > a:not(.btn) .item-text,
.app-nav-menu .top-nav > li.show > a:not(.btn),
.app-nav-menu .top-nav > li.show > a:not(.btn) .item-text {
    color: var(--iniz-main-nav-link-active) !important;
    font-weight: 600 !important;
}

/* Remove Lagom active blue underline */
.app-nav-menu .menu > li.active > a:not(.btn),
.app-nav-menu .menu > li.active > a:not(.btn):hover,
.app-nav-menu .menu > li.active > a:not(.btn):focus,
.app-nav-menu .top-nav > li.active > a:not(.btn),
.app-nav-menu .top-nav > li.active > a:not(.btn):hover,
.app-nav-menu .top-nav > li.active > a:not(.btn):focus {
    border-bottom: none !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.app-nav-menu .menu > li.active > a:not(.btn)::before,
.app-nav-menu .menu > li.active > a:not(.btn)::after,
.app-nav-menu .top-nav > li.active > a:not(.btn)::before,
.app-nav-menu .top-nav > li.active > a:not(.btn)::after,
.app-nav-menu .menu > li.active::before,
.app-nav-menu .menu > li.active::after,
.app-nav-menu .top-nav > li.active::before,
.app-nav-menu .top-nav > li.active::after {
    content: none !important;
    display: none !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    height: 0 !important;
    width: 0 !important;
}

/* Keep dropdown panels in main menu on Lagom grey / primary-blue hover */
.app-nav-menu .dropdown-menu,
.app-nav-menu .dropdown-menu.dropdown-lazy {
    --top-nav-link-color: var(--gray-base);
    --top-nav-link-active-color: var(--brand-primary);
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: var(--gray-base) !important;
}

.app-nav-menu .dropdown-menu > li > a,
.app-nav-menu .dropdown-menu > li > a .item-text,
.app-nav-menu .dropdown-menu > li > a .menu-item-content,
.app-nav-menu .dropdown-menu > li > a > i {
    color: var(--gray-base) !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}

.app-nav-menu .dropdown-menu > li > a:hover,
.app-nav-menu .dropdown-menu > li > a:focus,
.app-nav-menu .dropdown-menu > li:hover > a,
.app-nav-menu .dropdown-menu > li.active > a,
.app-nav-menu .dropdown-menu > li > a:hover .item-text,
.app-nav-menu .dropdown-menu > li > a:hover > i,
.app-nav-menu .dropdown-menu > li:hover > a .item-text,
.app-nav-menu .dropdown-menu > li:hover > a > i {
    color: var(--brand-primary) !important;
}

/* Mobile sidebar menu — white panel (Lagom slides .app-nav-menu from the side) */
@media (max-width: 991.98px) {
    .app-nav-menu,
    .app-nav-menu.app-nav-menu-default,
    .app-nav-menu.menu-hover-option,
    .app-nav .app-nav-menu {
        background-color: #ffffff !important;
        background: #ffffff !important;
    }

    .app-nav-menu .dropdown-menu,
    .app-nav-menu .dropdown-menu.dropdown-lazy,
    .app-nav .app-nav-menu .dropdown-menu.dropdown-lazy {
        background-color: #ffffff !important;
        background: #ffffff !important;
        border-color: var(--gray-lighter-3, #DEE0E3) !important;
    }
}

/* Home banner — primary gradient vertical (#E9F1FF → #FFFFFF) */
.main-banner.banner-home,
.main-banner.banner-center.banner-home.banner-default {
    background-color: var(--brand-primary-gradient-start, #E9F1FF) !important;
    background-image: var(--brand-primary-gradient-v) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}