/**
 * Sticky Nav — CSS transitions for fixed/scrolled header states
 *
 * JS (sticky-nav.js) toggles classes; all visual changes are in CSS.
 *   .uksr-header--fixed    → header sticks to top
 *   .uksr-header--scrolled → top bar + partner bar hide, logo shrinks, compact padding
 *   .uksr-header--hidden   → header slides up out of view on scroll-down
 *
 * @version 1.3.0
 */

/* ── Slide-down animation ────────────────────────────────── */
@keyframes uksr-slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ── Base header ──────────────────────────────────────────── */
.uksr-header {
    position: relative;
    z-index: var(--uksr-z-sticky, 200);
    width: 100%;
    background-color: var(--uksr-white, #fff);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* ── Fixed state (scroll > 0) ─────────────────────────────── */
.uksr-header--fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Entrance animation — only on initial fix, removed once scrolled */
.uksr-header--fixed:not(.uksr-header--scrolled):not(.uksr-header--hidden) {
    animation: uksr-slideDown 0.3s ease;
}

/* ── Hidden state — slides header up on scroll-down ──────── */
.uksr-header--hidden {
    transform: translateY(-100%) !important;
    box-shadow: none !important;
    pointer-events: none;   /* prevent invisible header catching clicks */
    animation: none !important;
}

/* ── Spacer (prevents content jump when header becomes fixed) */
.uksr-header-spacer {
    display: none;
    width: 100%;
}

.uksr-header--fixed ~ .uksr-header-spacer,
.uksr-header-spacer--active {
    display: block;
}

/* ── Scrolled state — hide top bar ───────────────────────── */
.uksr-header--scrolled .header_top {
    display: none;
}

/* ── Scrolled state — hide partner bar ───────────────────── */
.uksr-header--scrolled .partner-bar {
    display: none;
}

/* ── Scrolled state — shrink logo ────────────────────────── */
.uksr-header .logo img {
    transition: max-height 0.3s ease;
}

.uksr-header--scrolled .logo img {
    max-height: 42px;
}

/* ── Scrolled state — compact main bar ───────────────────── */
.uksr-header--scrolled .header_bottom {
    min-height: auto;
    padding: 10px 0 8px;
}

/* ── Tablet scrolled — even more compact (top/partner already hidden by CSS) ── */
@media (min-width: 900px) and (max-width: 1024px) {
    .uksr-header--scrolled .logo img {
        max-height: 38px;
    }

    .uksr-header--scrolled .header_bottom {
        min-height: auto;
        padding: 8px 0 4px;
    }
}

/* ── Mobile — disable sticky entirely ────────────────────── */
@media (max-width: 899px) {
    /* Keep header below drawer overlay */
    .uksr-header {
        z-index: 100;
    }

    .uksr-header--fixed {
        position: relative;
        box-shadow: none;
        animation: none;
        background: var(--uksr-white, #fff);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .uksr-header--hidden {
        transform: none;
        pointer-events: auto;
    }

    .uksr-header-spacer {
        display: none !important;
    }

    /* Top bar is hidden on mobile via mobile-drawer.css —
       don't let sticky-nav scroll state re-show it */
    .uksr-header--scrolled .header_top {
        display: none;
    }

    .uksr-header--scrolled .logo img {
        max-height: none;
    }

    .uksr-header--scrolled .header_bottom {
        min-height: auto;
        padding: 12px 0;
    }
}