
/* ================================================================
MOEFCC / DBIM V3.0 – NAVBAR ONLY
Add AFTER existing site/theme stylesheets.
================================================================ */

.moefcc-dbim-navigation {
    --dbim-nav-blue: #173b69 !important;
    --dbim-nav-text: #203451 !important;
    --dbim-nav-border: #dce4ed !important;
    --dbim-nav-focus: #b88205 !important;

    position: relative !important;
    z-index: 1050 !important;
    background: #fff !important;
    border-top: 1px solid var(--dbim-nav-border) !important;
    border-bottom: 2px solid var(--dbim-nav-blue) !important;
}

/* Desktop Navigation */
@media (min-width: 1201px) {

    .moefcc-dbim-navigation .main-menu__nav {
        width: 100% !important;
    }

    .moefcc-dbim-navigation .main-menu__list {
        display: flex !important;
        align-items: stretch !important;
        flex-wrap: nowrap !important;
        /* justify-content: center; */
        gap: 78px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        list-style: none !important;
    }

    .moefcc-dbim-navigation .main-menu__list > li {
        position: relative !important;
        flex: 0 1 auto !important;
        min-width: 0 !important;
        list-style: none !important;
    }

    .moefcc-dbim-navigation .main-menu__list > li > a {
        display: inline-flex !important;
        /* align-items: center; */
        /* justify-content: center; */
        min-height: 60px !important;
        padding: 12px clamp(10px, 1.25vw, 23px) !important;
        border-bottom: 3px solid transparent !important;
        color: var(--dbim-nav-text) !important;
        font-size: clamp(20px, .92vw, 16px) !important;
        line-height: 1.35 !important;
        font-weight: 650 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        transition: color .15s ease, background-color .15s ease !important;
    }

    .moefcc-dbim-navigation .main-menu__list > li:hover > a,
    .moefcc-dbim-navigation .main-menu__list > li:focus-within > a,
    .moefcc-dbim-navigation .main-menu__list > li > a.active {
        color: var(--dbim-nav-blue) !important;
        background: #edf3f9 !important;
        border-bottom-color: var(--dbim-nav-blue) !important;
    }

    /* First Dropdown */
    .moefcc-dbim-navigation .main-menu__list > li > ul {
        position: absolute !important;
        display: block !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        left: 0 !important;
        top: 100% !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        width: 275px !important;
        min-width: 245px !important;
        max-width: min(320px, 90vw) !important;
        background: #fff !important;
        border: 1px solid var(--dbim-nav-border) !important;
        border-top: 3px solid var(--dbim-nav-blue) !important;
        border-radius: 0 0 8px 8px !important;
        box-shadow: 0 12px 25px rgba(12, 35, 69, .14) !important;
        z-index: 1500 !important;
        transform: translateY(4px) !important;
        transition: opacity .15s ease, transform .15s ease, visibility .15s ease !important;
    }

    .moefcc-dbim-navigation .main-menu__list > li:hover > ul,
    .moefcc-dbim-navigation .main-menu__list > li:focus-within > ul {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }

    .moefcc-dbim-navigation .main-menu__list ul li {
        position: relative !important;
        display: block !important;
        float: none !important;
        list-style: none !important;
        margin: 0 !important;
    }

    .moefcc-dbim-navigation .main-menu__list ul li > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        padding: 11px 16px !important;
        color: var(--dbim-nav-text) !important;
        background: #fff !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        text-decoration: none !important;
        border-bottom: 1px solid #edf0f4 !important;
    }

    .moefcc-dbim-navigation .main-menu__list ul li:hover > a,
    .moefcc-dbim-navigation .main-menu__list ul li:focus-within > a {
        background: #edf3f9 !important;
        color: var(--dbim-nav-blue) !important;
    }

    /* Nested Dropdowns */
    .moefcc-dbim-navigation .main-menu__list ul li > ul {
        position: absolute !important;
        display: block !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        left: 100% !important;
        top: -1px !important;
        margin: 0 !important;
        padding: 6px 0 !important;
        width: 275px !important;
        min-width: 235px !important;
        max-width: min(310px, 90vw) !important;
        background: #fff !important;
        border: 1px solid var(--dbim-nav-border) !important;
        border-radius: 5px !important;
        box-shadow: 0 10px 22px rgba(12, 35, 69, .14) !important;
        z-index: 1510 !important;
    }

    .moefcc-dbim-navigation .main-menu__list ul li:hover > ul,
    .moefcc-dbim-navigation .main-menu__list ul li:focus-within > ul {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* Right Edge Dropdown Alignment */
    .moefcc-dbim-navigation .main-menu__list > li:nth-last-child(-n+2) > ul {
        left: auto !important;
        right: 0 !important;
    }

    .moefcc-dbim-navigation .main-menu__list > li:nth-last-child(-n+2) ul li > ul {
        left: auto !important;
        right: 100% !important;
    }
}

/* Keyboard Accessibility */
.moefcc-dbim-navigation a:focus-visible,
.moefcc-dbim-navigation button:focus-visible {
    outline: 3px solid var(--dbim-nav-focus) !important;
    outline-offset: -3px !important;
}

/* Mobile Navigation */
@media (max-width: 1200px) {

    .moefcc-dbim-navigation .main-menu__nav,
    .moefcc-dbim-navigation .main-menu__list {
        display: none !important;
    }

    .moefcc-dbim-navigation .main-menu__right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        min-height: 52px !important;
    }

    .moefcc-dbim-navigation .main-menu__toggler {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 48px !important;
        height: 48px !important;
        border: 1px solid var(--dbim-nav-border) !important;
        border-radius: 6px !important;
        background: #fff !important;
        color: var(--dbim-nav-blue) !important;
        cursor: pointer !important;
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {

    .moefcc-dbim-navigation .main-menu__list > li > ul,
    .moefcc-dbim-navigation .main-menu__list > li > a {
        transition: none !important;
    }
}

/* ==========================================
   DBIM NAVBAR - WHITE DROPDOWN BACKGROUND
   ========================================== */

/* All Dropdown Menu Backgrounds */
.moefcc-dbim-navigation .main-menu__list li ul,
.moefcc-dbim-navigation .main-menu__list li ul li,
.moefcc-dbim-navigation .main-menu__list li ul li a {
    background-color: #ffffff !important;
}

/* Hover and Active States */
.moefcc-dbim-navigation .main-menu__list li ul li:hover,
.moefcc-dbim-navigation .main-menu__list li ul li:hover > a,
.moefcc-dbim-navigation .main-menu__list li ul li a:focus-visible {
    background-color: #ffffff !important;
}
