/*
Theme Name: DXNPoint Navigation Fix
Description: DXNPoint V2 child theme with corrected desktop dropdowns and mobile navigation.
Version: 2.2.1
Author: DXNPoint
Template: dxnpoint-co-v2.1.0-variation-source
Text Domain: dxnpoint-navigation-fix
*/

/* Parent nav outputs top-level <li> elements directly inside .container (%3$s). */
.dxn-header { position: sticky; top: 0; z-index: 1000; }
.dxn-nav { position: relative; z-index: 1001; isolation: isolate; }
.dxn-nav > .container {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 30px;
    height: auto;
    min-height: 44px;
    overflow: visible;
}
.dxn-nav > .container > li {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    align-self: stretch;
    margin: 0;
    padding: 0;
    list-style: none;
}
.dxn-nav > .container > li > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 2px;
    white-space: nowrap;
    line-height: 1.3;
}
.dxn-nav li { position: relative; list-style: none; margin: 0; }
.dxn-nav a { text-decoration: none; }
.dxn-nav .menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin: -4px 0 0 9px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    flex: 0 0 auto;
}
.dxn-nav .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: -12px;
    z-index: 1100;
    min-width: 255px;
    max-width: 310px;
    margin: 0;
    padding: 8px 0;
    list-style: none;
    background: #fff;
    border: 1px solid var(--line, #dce6e0);
    border-radius: 11px;
    box-shadow: 0 14px 34px rgba(4, 60, 40, .17);
    text-align: left;
}
.dxn-nav li:hover > .sub-menu,
.dxn-nav li:focus-within > .sub-menu,
.dxn-nav li.submenu-open > .sub-menu { display: block; }
.dxn-nav .sub-menu li { display: block; width: 100%; margin: 0; padding: 0; }
.dxn-nav .sub-menu li > a {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 0;
    padding: 11px 17px;
    color: var(--deep, #043c28);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
    white-space: normal;
}
.dxn-nav .sub-menu li > a:hover,
.dxn-nav .sub-menu li > a:focus {
    color: var(--green, #075b3b);
    background: var(--mint, #edf7ef);
}
.dxn-nav .sub-menu .menu-item-has-children > a::after { margin-left: auto; transform: rotate(-45deg); }
.dxn-nav .sub-menu .sub-menu { top: -8px; left: calc(100% - 2px); }
.dxn-nav .dxnp-submenu-toggle { display: none; }
.dxn-mobile-toggle {
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--deep, #043c28);
    font-size: 21px;
    line-height: 1;
    padding: 0;
}
.dxn-mobile-toggle:focus-visible,
.dxn-nav a:focus-visible,
.dxn-nav button:focus-visible {
    outline: 3px solid var(--gold, #d29a2e);
    outline-offset: 3px;
}
@media (min-width: 721px) {
    .dxn-nav .sub-menu { animation: dxnp-dropdown-in .13s ease-out; }
    @keyframes dxnp-dropdown-in {
        from { opacity: 0; transform: translateY(4px); }
        to { opacity: 1; transform: translateY(0); }
    }
}
@media (max-width: 1050px) and (min-width: 721px) {
    .dxn-nav > .container { gap: 19px; }
    .dxn-nav > .container > li > a { font-size: 12px; }
}
@media (max-width: 720px) {
    .dxn-header { position: relative; }
    .dxn-header-main { grid-template-columns: minmax(0, 1fr) auto; }
    .dxn-actions { align-items: center; }
    .dxn-mobile-toggle {
        display: inline-flex;
        width: 42px;
        height: 42px;
        border: 1px solid var(--line, #dce6e0);
        border-radius: 8px;
        background: #fff;
    }
    .dxn-nav { display: none; border-top: 1px solid var(--line, #dce6e0); background: #fff; }
    .dxn-header.mobile-menu-open .dxn-nav { display: block; }
    .dxn-nav > .container {
        display: block;
        width: 100%;
        max-height: min(72vh, 620px);
        overflow-x: hidden;
        overflow-y: auto;
        padding: 8px 16px 16px;
    }
    .dxn-nav > .container > li {
        display: block;
        width: 100%;
        border-bottom: 1px solid #edf1ee;
    }
    .dxn-nav > .container > li > a {
        display: flex;
        width: 100%;
        min-height: 46px;
        padding: 10px 48px 10px 4px;
        white-space: normal;
    }
    .dxn-nav .menu-item-has-children > a::after { display: none; }
    .dxn-nav .dxnp-submenu-toggle {
        display: inline-flex;
        position: absolute;
        top: 5px;
        right: 0;
        width: 38px;
        height: 36px;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--line, #dce6e0);
        border-radius: 7px;
        background: #fff;
        color: var(--deep, #043c28);
        cursor: pointer;
        font-size: 18px;
    }
    .dxn-nav .menu-item-has-children.submenu-open > .dxnp-submenu-toggle { transform: rotate(180deg); }
    .dxn-nav .sub-menu,
    .dxn-nav .sub-menu .sub-menu {
        display: none;
        position: static;
        min-width: 0;
        max-width: none;
        width: 100%;
        margin: 0;
        padding: 0 0 8px 14px;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: #f8fbf8;
        animation: none;
    }
    .dxn-nav li.submenu-open > .sub-menu { display: block; }
    .dxn-nav .sub-menu li { border: 0; }
    .dxn-nav .sub-menu li > a { min-height: 40px; padding: 9px 12px; }
}