/*
 * Tema de Natal (03/11/2026) — carregado por includes/favicon.php só quando
 * system_settings.site_theme = 'christmas'. Camada ADITIVA, igual ao Halloween:
 * troca os tokens de destaque e acrescenta decoração (neve, luzes, gorro).
 *
 * `html:root` tem especificidade maior que o `:root` das páginas, então vence
 * independentemente da ordem em que o <style> da página aparece.
 */
html:root {
    --accent: #e11d2e;
    --accent-bright: #ff4d5e;
    --accent-deep: #9f1239;
    --zx-gold: #f5c451;
    --zx-glow: rgba(225, 29, 46, 0.35);
}

::selection { background: #e11d2e; color: #fff; }

/* Barra de rolagem em vermelho (Chromium/WebKit e Firefox). */
html { scrollbar-color: #9f1239 #0a0e1a; }
::-webkit-scrollbar-thumb { background: #9f1239; }

/* Brilho vermelho e dourado sob a navbar compartilhada. */
#siteNav, nav.nav { box-shadow: 0 1px 0 rgba(245, 196, 81, 0.35), 0 8px 30px -12px var(--zx-glow); }

/* Navbar e rodapé compartilhados declaram as variáveis no próprio .nav/.footer
 * (css/shared-header.css), então o html:root acima não chega neles. `html .nav`
 * tem especificidade maior que `.nav`. */
html .nav, html .footer {
    --accent: #e11d2e;
    --accent-bright: #ff4d5e;
}
/* Texto escuro (#001f28) some no vermelho: botões cheios em branco. */
html .nav-links a.nav-btn.solid,
html .nav-links a.nav-btn.solid:hover,
html .btn-pill { color: #fff; }
/* Tons azuis fixos (rgba) do header/rodapé e do botão da home. */
html .nav.is-stuck { border-bottom-color: rgba(245, 196, 81, 0.22); }
html .nav-links a.nav-btn.ghost:hover { border-color: rgba(255, 77, 94, 0.5); }
html .nav-links a.nav-btn.solid:hover { box-shadow: 0 8px 22px rgba(225, 29, 46, 0.4); }
html .nav-social a:hover,
html .footer-social a:hover { border-color: rgba(255, 77, 94, 0.45); background: rgba(225, 29, 46, 0.1); }
html .footer-brand-mark .mark { background: rgba(225, 29, 46, 0.12); border-color: rgba(225, 29, 46, 0.3); }
html .btn-pill { box-shadow: 0 14px 38px rgba(225, 29, 46, 0.35); }
@media (max-width: 1024px) {
    html .nav-links.is-open { border-bottom-color: rgba(245, 196, 81, 0.22); }
}

/* "CHEATS" do logo em dourado + gorro de Papai Noel sobre o "Z". */
.nav-logo { position: relative; }
.nav-logo span { color: var(--zx-gold); }
.nav-logo::before {
    content: "";
    position: absolute;
    left: -0.62em;
    top: -1.05em;
    width: 1.9em;
    height: 1.55em;
    background: url("santa-hat.svg") no-repeat center / contain;
    transform: rotate(-16deg);
    pointer-events: none;
}

/* ---- Luzinhas penduradas sob a navbar (montadas por theme.js) ---- */
.zx-lights {
    position: absolute;
    left: 0; right: 0; top: 100%;
    height: 30px;
    pointer-events: none;
    overflow: hidden;
    transition: opacity .2s ease;
}
.zx-lights svg { display: block; width: 100%; height: 100%; max-width: none; max-height: none; } /* preflight do Tailwind */
.zx-lights .zx-bulb { animation: zx-twinkle 2.4s ease-in-out infinite; }
@keyframes zx-twinkle {
    0%, 100% { opacity: 1; }
    50%      { opacity: .35; }
}
/* Menu mobile aberto ocupa o espaço logo abaixo da navbar: as luzes saem da frente. */
.nav-toggle.is-open ~ .zx-lights,
.nav:has(.nav-links.is-open) .zx-lights { opacity: 0; }
/* Páginas de pagamento: luzes acesas, sem piscar. */
.zx-static .zx-bulb { animation: none; }

/* ---- Neve e brilho de geada (montados por theme.js; aria-hidden, sem cliques) ---- */
.zx-deco { position: fixed; inset: 0; pointer-events: none; z-index: 40; overflow: hidden; }
.zx-snow { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; }
.zx-frost {
    position: absolute; left: 0; right: 0; bottom: 0; height: 110px;
    background:
        radial-gradient(60% 100% at 18% 100%, rgba(225, 29, 46, 0.13), transparent 70%),
        radial-gradient(60% 100% at 82% 100%, rgba(220, 235, 255, 0.10), transparent 70%);
}

/* Cards: brilho dourado no hover (só realce; o layout do catálogo não muda). */
.featured-grid > .card:hover,
.product-grid > .card:hover {
    box-shadow: 0 0 0 1px rgba(245, 196, 81, 0.35), 0 0 30px rgba(225, 29, 46, 0.28);
}

@media (max-width: 767px) {
    .zx-frost { height: 70px; }
}

@media print {
    .zx-deco, .zx-lights, .nav-logo::before { display: none; }
}
