/* =========================================================
   MENU „PŁYNNE ZŁOTO” – wybierane w panelu: Ustawienia → Górne menu sklepu
   Linki w szklanej kapsule ze złotą obwódką. Pod aktywnym (i wskazanym kursorem) linkiem
   gładko przesuwa się złota „pigułka” – bez rozlewania i podskoków.
   Na telefonie pełnoekranowe menu, które napełnia się złotem.
   ========================================================= */

header.hdr-liquid {
    --lq-gold-1: #f3e2a6;
    --lq-gold-2: #d7b65f;
    --lq-gold-3: #a8842f;
    --lq-ease: cubic-bezier(.22, 1, .36, 1);
}
/* Strona główna przed przewinięciem: przezroczysty pasek nad zdjęciem z delikatnym rozjaśnieniem u góry.
   Podstrony i po przewinięciu: „szklane” tło jak w menu klasycznym (header {…} w style.css). */
header.hdr-liquid.is-home:not(.scrolled) {
    background: linear-gradient(to bottom, rgba(247,246,242,.7), rgba(247,246,242,0)) !important;
    border-bottom: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html.theme-dark header.hdr-liquid.is-home:not(.scrolled) { background: linear-gradient(to bottom, rgba(10,10,10,.7), rgba(10,10,10,0)) !important; }

header.hdr-liquid .header-inner { padding: 10px 0; gap: 18px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; }
header.hdr-liquid .header-inner > .logo { grid-column: 1; }
header.hdr-liquid .header-inner > .lq-nav { grid-column: 2; justify-self: center; }
header.hdr-liquid .header-inner > .header-icons { grid-column: 3; margin-left: 0; }
@media (max-width: 900px) { header.hdr-liquid .header-inner { grid-template-columns: auto 1fr; } header.hdr-liquid .header-inner > .header-icons { grid-column: 2; justify-self: end; } }

/* ── Szklana kapsuła ze złotą obwódką ── */
header.hdr-liquid .lq-nav {
    position: relative;
    margin: 0;
    padding: 5px;
    border-radius: 999px;
    background: rgba(255, 253, 247, .72);
    backdrop-filter: blur(16px) saturate(1.3);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
    box-shadow: 0 8px 30px rgba(60, 45, 10, .10), inset 0 0 0 1px rgba(215, 182, 95, .45), inset 0 1px 0 rgba(255,255,255,.9);
    isolation: isolate;
}
html.theme-dark header.hdr-liquid .lq-nav { background: rgba(22, 19, 13, .7); box-shadow: 0 8px 30px rgba(0,0,0,.35), inset 0 0 0 1px rgba(215, 182, 95, .35); }

header.hdr-liquid .lq-nav ul {
    position: relative; z-index: 2;
    list-style: none; margin: 0; padding: 0;
    display: flex; align-items: center; gap: 2px;
    background: none !important; border: none !important; box-shadow: none !important;
}
header.hdr-liquid .lq-nav a {
    display: block; position: relative;
    padding: 9px 16px;
    border-radius: 999px;
    font-family: 'Playfair Display', serif;
    font-size: var(--lq-fs, 14px);
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--text);
    white-space: nowrap;
    transition: color .3s ease;
}
header.hdr-liquid .lq-nav a::after { display: none !important; }
header.hdr-liquid .lq-nav a:focus-visible { outline: 2px solid var(--lq-gold-3); outline-offset: 2px; }
header.hdr-liquid .lq-nav a.lq-on { color: #2b210b !important; }
header.hdr-liquid .lq-nav a.lq-special { color: var(--lq-gold-3); }
html.theme-dark header.hdr-liquid .lq-nav a.lq-special { color: var(--lq-gold-1); }
header.hdr-liquid .lq-nav a.nav-promo { margin: 0 4px; padding: 8px 15px !important; }

/* ── Złota pigułka pod aktywnym / wskazanym linkiem ── */
header.hdr-liquid .lq-pill {
    position: absolute; z-index: 1; left: 0; top: 5px; bottom: 5px; width: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--lq-gold-1) 0%, var(--lq-gold-2) 55%, #c9a54e 100%);
    box-shadow: 0 4px 14px rgba(168, 132, 47, .32), inset 0 1px 0 rgba(255,255,255,.65);
    opacity: 0;
    pointer-events: none;
    transition: transform .45s var(--lq-ease), width .45s var(--lq-ease), opacity .25s ease;
}
header.hdr-liquid .lq-pill.on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { header.hdr-liquid .lq-pill { transition: opacity .2s; } }

/* ── Ikony po prawej: też w szklanej kapsułce ── */
header.hdr-liquid .header-icons {
    gap: 12px; padding: 7px 14px; border-radius: 999px;
    background: rgba(255, 253, 247, .62);
    backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 10px 30px rgba(60,45,10,.1), inset 0 0 0 1px rgba(215,182,95,.3);
}
html.theme-dark header.hdr-liquid .header-icons { background: rgba(22,19,13,.6); }
header.hdr-liquid .fb-pill-header { width: 30px; height: 30px; padding: 0; margin-right: 0; justify-content: center; border-radius: 50%; box-shadow: none; }
header.hdr-liquid .fb-pill-header span { display: none; }
header.hdr-liquid .lang-switcher { margin-right: 0 !important; }
header.hdr-liquid .mn-register {
    font-family: 'Inter', sans-serif; font-size: .78rem; font-weight: 600; white-space: nowrap;
    color: #2b210b; padding: 6px 13px; border-radius: 999px;
    background: linear-gradient(135deg, var(--lq-gold-1), var(--lq-gold-2));
}
header.hdr-liquid .mn-register:hover { filter: brightness(1.05); }

@media (max-width: 1280px) {
    header.hdr-liquid .lq-nav a { padding: 9px 11px; }
    header.hdr-liquid .mn-register { display: none; }
}
@media (max-width: 1100px) {
    header.hdr-liquid .lq-nav a { padding: 8px 8px; font-size: calc(var(--lq-fs, 14px) * .92); }
    header.hdr-liquid .fb-pill-header { display: none; }
}

/* ── Telefon: pełnoekranowe menu, które napełnia się złotem ── */
header.hdr-liquid .mn-drawer-head, header.hdr-liquid .mn-drawer-foot { display: none; }
@media (max-width: 900px) {
    header.hdr-liquid .lq-nav { display: none; }
    header.hdr-liquid .mobile-only { display: flex; }
    header.hdr-liquid .header-icons { margin-left: auto; padding: 6px 10px; gap: 8px; }
    header.hdr-liquid.is-home, header.hdr-liquid { background: rgba(247,246,242,.85) !important; }
    html.theme-dark header.hdr-liquid { background: rgba(12,12,12,.85) !important; }

    header.hdr-liquid .mobile-dropdown {
        position: fixed; inset: 0; height: 100vh; height: 100dvh; width: 100%;
        padding: 20px 28px 30px;
        background: #0e0c08;
        border: none; box-shadow: none;
        display: flex; flex-direction: column;
        opacity: 0; visibility: hidden; transform: none;
        transition: opacity .3s ease, visibility .3s;
        overflow: hidden; z-index: 3000;
    }
    header.hdr-liquid .mobile-dropdown.open { opacity: 1; visibility: visible; }
    /* Złoty płyn wypełniający dół ekranu, z falą */
    header.hdr-liquid .mobile-dropdown::before {
        content: ''; position: absolute; left: -50%; right: -50%; bottom: 0; height: 0;
        background:
            url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'><path d='M0 10 Q25 0 50 10 T100 10 T150 10 T200 10 V20 H0 Z' fill='%23d7b65f'/></svg>") repeat-x top / 50% 26px,
            linear-gradient(to bottom, transparent 25px, #d7b65f 26px, #a8842f 100%);
        transition: height 1.1s cubic-bezier(.3,.9,.3,1);
        animation: lqWave 3s linear infinite;
        z-index: 0;
    }
    header.hdr-liquid .mobile-dropdown.open::before { height: 17%; }
    @keyframes lqWave { to { transform: translateX(25%); } }

    header.hdr-liquid .mn-drawer-head { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 1; }
    header.hdr-liquid .mn-drawer-close { background: none; border: none; font-size: 2.2rem; line-height: 1; color: var(--lq-gold-1); cursor: pointer; }
    header.hdr-liquid .mobile-dropdown ul { position: relative; z-index: 1; text-align: center; gap: 0; margin-top: 2vh; }
    header.hdr-liquid .mobile-dropdown ul li { opacity: 0; transform: translateY(14px); transition: opacity .45s ease, transform .45s ease; }
    header.hdr-liquid .mobile-dropdown.open ul li { opacity: 1; transform: none; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(1) { transition-delay: .15s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(2) { transition-delay: .2s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(3) { transition-delay: .25s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(4) { transition-delay: .3s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(5) { transition-delay: .35s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(6) { transition-delay: .4s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(7) { transition-delay: .45s; }
    header.hdr-liquid .mobile-dropdown.open ul li:nth-child(n+8) { transition-delay: .5s; }
    header.hdr-liquid .mobile-dropdown ul li a {
        font-family: 'Playfair Display', serif; font-size: 1.4rem; color: #f5ecd2 !important;
        padding: 7px; background: none !important;
    }
    header.hdr-liquid .mobile-dropdown ul li a:hover { color: var(--lq-gold-1) !important; }
    header.hdr-liquid .mn-drawer-foot { display: flex; gap: 10px; justify-content: center; margin-top: auto; position: relative; z-index: 1; }
    header.hdr-liquid .mn-drawer-foot a { padding: 8px 16px; border-radius: 999px; font-size: .85rem; color: #2b210b; background: rgba(255,255,255,.35); }
    header.hdr-liquid .mn-drawer-foot a.on { background: #2b210b; color: var(--lq-gold-1); }
}

/* Gdy menu na telefonie jest otwarte – chowamy baner cookies i pływające przyciski */
body:has(.mobile-dropdown.open) #cookieCard,
body:has(.mobile-dropdown.open) #sa-float-btn,
body:has(.mobile-dropdown.open) #chatBtn { visibility: hidden !important; }

@media (prefers-reduced-motion: reduce) {
    header.hdr-liquid .mobile-dropdown::before { animation: none; }
}
