/**
 * Sticky header.
 *
 * Lives in its own file (not style.css) so LiteSpeed can be told to skip UCSS
 * for it and inline it in full on every page - see
 * cakeclub_litespeed_ucss_file_exc_inline() in includes/litespeed-compat.php.
 * `.sticky-visible` is only added by js/main.js after the visitor scrolls,
 * so the QUIC.cloud UCSS crawler never sees it and stripped the fixed-position
 * rule from every page's bundle after the 7.48 UCSS purge (2026-10-01); the
 * header then just scrolled away with the page.
 *
 * Enqueued by cakeclub_scripts() only when the Customizer "Sticky Header"
 * option is on (body.sticky-header-enabled).
 */

body.sticky-header-enabled .site-header {
    position: relative;
    /* Never `transition: all`: position/offset changes must be instant so
       the hand-over between in-flow and fixed happens in a single frame. */
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Placeholder inserted by main.js in the header's slot while it is fixed,
   sized to the header's measured in-flow height so the content below does
   not move. Must contribute nothing of its own to the layout. */
.site-header-spacer {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    pointer-events: none;
}

body.sticky-header-enabled .site-header.sticky-visible {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: var(--color-background) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(0);
    animation: slideDownFromTop 0.3s ease-out;
}

@keyframes slideDownFromTop {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.sticky-header-enabled .site-header.sticky-visible {
        animation: none;
    }
}
