/* =============================================================================
   ESTATIKA CLEAN — Navigation
   Two-row header: .header-top (logo/contact/social) + .header-nav-bar (nav).
   wp_nav_menu() with items_wrap='%3$s' → <li> as direct children of <nav>.
============================================================================= */

/* ── Nav bar separator ───────────────────────────────────────────────────── */
.header-nav-bar {
    border-top: 1px solid var(--beige, #EAE6E1);
}

/* ── Reset ───────────────────────────────────────────────────────────────── */
.primary-nav li { list-style: none; }           /* suppress ::marker on <li> inside <nav> */
.primary-nav ul,
.primary-nav ul ul { list-style: none; margin: 0; padding: 0; }

/* ── Top-level items: full nav-bar height ────────────────────────────────── */
.primary-nav > li { position: relative; }

/* ── Chevron on dropdown parents ─────────────────────────────────────────── */
.primary-nav .menu-item-has-children > a::after {
    content:       '';
    display:       inline-block;
    width:         5px;
    height:        5px;
    border-right:  1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform:     rotate(45deg);
    margin-left:   6px;
    flex-shrink:   0;
    position:      relative;
    top:           -1px;
    opacity:       0.5;
    transition:    transform 0.18s ease, top 0.18s ease, opacity 0.18s ease;
}
.primary-nav .menu-item-has-children:hover > a::after {
    transform: rotate(225deg);
    top:       1px;
    opacity:   1;
}
/* Second-level parents: right-pointing chevron (fly-out indicator) */
.primary-nav > li > ul .menu-item-has-children > a::after {
    transform:  rotate(-45deg);
    top:        0;
    margin-left: auto;
    margin-right: 0;
}
.primary-nav > li > ul .menu-item-has-children:hover > a::after {
    transform: rotate(-45deg);
    opacity:   1;
}

/* ── Dropdown panel ──────────────────────────────────────────────────────── */
/* Override main.css display:none — use opacity/visibility for smooth reveal */
.primary-nav > li > ul {
    display:    block !important;
    opacity:    0;
    visibility: hidden;
    transform:  translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
    pointer-events: none;
}
.primary-nav > li:hover > ul {
    opacity:       1;
    visibility:    visible;
    transform:     translateY(0);
    transition:    opacity 0.18s ease, transform 0.18s ease, visibility 0s;
    pointer-events: auto;
}

/* Nested 3rd-level */
.primary-nav > li > ul li { position: relative; }
.primary-nav > li > ul > li > ul {
    position:      absolute;
    top:           -9px;
    left:          100%;
    border-top:    3px solid var(--green, #7FB13D);
    border-radius: 0 6px 6px 6px;
    min-width:     190px;
    background:    #fff;
    border:        1px solid #EAE6E1;
    border-top:    3px solid #7FB13D;
    box-shadow:    0 10px 40px rgba(0,0,0,0.09);
    padding:       8px 0;
    z-index:       9999;
    opacity:       0;
    visibility:    hidden;
    transform:     translateY(-4px);
    transition:    opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
    pointer-events: none;
}
.primary-nav > li > ul > li:hover > ul {
    opacity:       1;
    visibility:    visible;
    transform:     translateY(0);
    transition:    opacity 0.18s ease, transform 0.18s ease, visibility 0s;
    pointer-events: auto;
}

/* ── Mobile overrides ────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .primary-nav .menu-item-has-children > a::after { display: none; }
    .site-header.mobile-open + .header-nav-bar .primary-nav > li > a::before,
    .site-header.mobile-open + .header-nav-bar .primary-nav > li > a::after { display: none !important; }
    /* Static sub-menus on mobile — override the opacity/visibility approach */
    .site-header.mobile-open + .header-nav-bar .primary-nav > li > ul {
        position:   static !important;
        opacity:    1 !important;
        visibility: visible !important;
        transform:  none !important;
        transition: none !important;
        pointer-events: auto !important;
        box-shadow: none !important;
        border:     none !important;
        border-radius: 0 !important;
    }
    /* Third-level sub-menus on mobile — also static */
    .site-header.mobile-open + .header-nav-bar .primary-nav > li > ul > li > ul {
        position:   static !important;
        opacity:    1 !important;
        visibility: visible !important;
        transform:  none !important;
        transition: none !important;
        pointer-events: auto !important;
        box-shadow: none !important;
        border:     none !important;
        border-radius: 0 !important;
        padding:    0 0 8px 12px !important;
    }
    .site-header.mobile-open + .header-nav-bar .primary-nav > li > ul > li > ul a {
        font-size:  12px;
        padding:    5px 0;
        color:      #666;
    }
}