/* public/css/menu-zindex-fix.css
 * ADDITIVE ONLY — fixes the hamburger menu appearing BEHIND page content
 * when opened from the sticky header (the one shown after scrolling down).
 *
 * Root causes:
 *  1. sticky-header-fix.css sets `.qondri-header-fixed { max-height:80px;
 *     overflow:hidden }` — this CLIPS the hamburger overlay/panel that
 *     lives inside it, and creates a stacking context that traps the
 *     menu under later page sections.
 *  2. The overlay/panel have no high z-index of their own, so hero,
 *     cards and the scroll-to-top button paint over them.
 *
 * Fix: lift the overlay + panel out of the clipping via position:fixed
 * with a very high z-index, and let the fixed header overflow while
 * the menu is what matters visually (menu is fixed, so header overflow
 * no longer clips it).
 */

/* Never clip the menu — override the overflow:hidden clamp */
.qondri-header-fixed,
.qondri-header,
.qondri-header-fixed .elementor-section,
.qondri-header .elementor-section {
    overflow: visible !important;
}

/* The dark backdrop behind the menu */
.qondri-hamburger-menu .hidden-menu-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 99998 !important;
}

/* The sliding menu panel itself */
.qondri-hamburger-menu .hidden-menu-wrap {
    position: fixed !important;
    top: 0 !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    z-index: 99999 !important;
}

/* Layer the two header rows so the main menu sits IN FRONT of the
 * sticky/scroll menu (.qondri-header-fixed), while both still sit above
 * every other page element (hero, cards, scroll-to-top button, etc.).
 *
 * Both header rows live inside #site-header-wrap, which is `position:
 * relative` + z-index 9999 in the BRSbase CSS, so it forms a
 * stacking context. Stacking inside that context is what matters here:
 *  - .qondri-header        (the always-visible main menu) -> highest
 *  - .qondri-header-fixed  (the menu that slides in on scroll) -> just
 *    below the main menu, but still above any page content
 *  - everything else (hero, sections, footer, scroll-top) -> no z-index
 *    and rendered behind the whole #site-header-wrap (z-index 9999).
 */
#site-header-wrap {
    z-index: 9999;
}

.qondri-header {
    position: relative;
    z-index: 10002; /* main menu: in front of the sticky menu */
}

.qondri-header-fixed {
    z-index: 10001; /* sticky menu: just behind main menu, above content */
}

/* Hamburger icon stays clickable above everything in the header row */
.hamburger-menu-wrap {
    position: relative;
    z-index: 10000;
}