/**
 * Smart Sticky Header (Parent Target Fix)
 * 
 * Problem Solved: 
 * Prevents the "Sticky Trap" where the inner group sticks 
 * but the parent <header> scrolls away.
 */

/* 
 * 1. Target the Parent Header 
 */
header:has(.wc-blocks-header-pattern),
header:has(.has-smart-sticky-header),
header.is-smart-sticky-root {
    position: sticky !important;
    top: 0;
    z-index: 10;
    width: 100%;

    background-color: var(--wp--preset--color--base, #ffffff);

    /* Animation */
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s ease;

    /* 
     * CRITICAL: 'will-change: transform' creates a new containing block.
     * This normally breaks position: fixed children, but we fix it below
     * using the :has(.is-menu-open) exception.
     */
    will-change: transform;

    box-shadow: none;
}

/* --------------------------------------------------------------------------
   CRITICAL FIX: DRAWER ESCAPE HATCH
   --------------------------------------------------------------------------
   Problem: If the header has 'transform' or 'will-change: transform', 
   any position: fixed child (like the Nav Drawer) becomes relative to the 
   Header height (80px) instead of the Viewport height (100vh).
   
   Solution: When the menu is OPEN, we strip the header of all transform 
   properties so the Drawer can see the Viewport again.
   -------------------------------------------------------------------------- */
header:has(.wp-block-navigation__responsive-container.is-menu-open) {
    transform: none !important;
    will-change: auto !important;

    /* Ensure it stays on top of other content even without sticky magic */
    z-index: 1000 !important;

    /* Optional: If sticky behavior causes jitters when opening, force static.
       Usually removing transform is enough. */
}

/* 2. Scrolled State (Shadow) */
header.is-scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

/* 3. Hidden State (Scrolling Down) */
header.is-header-hidden {
    transform: translateY(-100%);
}

/* 
   EXCEPTION: If menu is open, NEVER hide the header, 
   even if JS adds the class.
*/
header.is-header-hidden:has(.wp-block-navigation__responsive-container.is-menu-open) {
    transform: none !important;
}

/* 4. Admin Bar Compatibility (Desktop) */
body.admin-bar header:has(.wc-blocks-header-pattern),
body.admin-bar header:has(.has-smart-sticky-header),
body.admin-bar header.is-smart-sticky-root {
    top: 32px;
}

/* 5. Admin Bar Compatibility (Mobile) */
@media screen and (max-width: 782px) {

    body.admin-bar header:has(.wc-blocks-header-pattern),
    body.admin-bar header:has(.has-smart-sticky-header),
    body.admin-bar header.is-smart-sticky-root {
        top: 0;
    }
}

/* 6. Safety: Ensure Parent Overflow is Visible */
html,
body,
.wp-site-blocks {
    overflow-y: visible !important;
    overflow-x: clip !important;
}