/*
 * Arcade Direct — Mobile header accessibility and interaction repair
 * Design reminder: preserve native WordPress Primary Navigation, with a navy
 * drawer, bright readable labels, explicit teal focus and 44px touch controls.
 */

@media (max-width: 768px) {
    /* The overlay is outside the sticky header's stacking context. Lift the header/drawer above it,
       otherwise the overlay visibly darkens the menu and intercepts every menu tap. */
    body.ad-navigation-open .site-header {
        z-index: 1400;
    }

    body.ad-navigation-open .nav-overlay {
        z-index: 1300;
    }

    body.ad-navigation-open #primary-navigation.primary-nav.is-open {
        z-index: 1450;
        pointer-events: auto;
    }

    body.ad-navigation-open #primary-navigation.primary-nav.is-open .primary-nav__inner,
    body.ad-navigation-open #primary-navigation.primary-nav.is-open .primary-nav__menu,
    body.ad-navigation-open #primary-navigation.primary-nav.is-open .primary-nav__menu * {
        pointer-events: auto;
    }

    /* The empty desktop search grid track previously governed the logo/action spacing. */
    .header-main__inner {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: clamp(0.55rem, 2vw, 1rem);
    }

    .site-logo {
        grid-column: 1;
        min-width: 0;
    }

    .site-logo img {
        max-width: min(44vw, 18rem);
    }

    .header-actions {
        grid-column: 2;
        justify-content: flex-end;
        justify-self: end;
        gap: clamp(0.3rem, 1.5vw, 0.55rem);
    }

    .header-action-btn,
    .mobile-menu-toggle {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
    }

    .header-action-btn--quote {
        width: 44px;
        padding-inline: 0;
    }

    /* The native drawer is a solid surface, not an overlay-muted approximation. */
    #primary-navigation.primary-nav.is-open {
        background: #081224;
        box-shadow: -18px 0 44px rgba(0, 0, 0, 0.34);
    }

    #primary-navigation.primary-nav.is-open .primary-nav__menu > li > a {
        color: #ffffff !important;
        opacity: 1;
    }

    #primary-navigation.primary-nav.is-open .primary-nav__menu .sub-menu > li > a {
        color: #d3e3e3 !important;
        opacity: 1;
    }

    #primary-navigation.primary-nav.is-open .ad-native-menu-toggle {
        color: #ffffff !important;
        cursor: pointer;
        position: relative;
        z-index: 1;
    }

    #primary-navigation.primary-nav.is-open .primary-nav__menu a:focus-visible,
    #primary-navigation.primary-nav.is-open .ad-native-menu-toggle:focus-visible,
    .mobile-menu-toggle:focus-visible,
    .header-action-btn:focus-visible {
        outline: 3px solid #35bb9d;
        outline-offset: 3px;
    }

    /* The drawer owns its mobile search field; do not inherit the desktop hidden state. */
    #primary-navigation .mobile-search-bar .header-search {
        display: block;
        max-width: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    #primary-navigation.primary-nav,
    #primary-navigation.primary-nav.is-open {
        transition: none;
    }
}