/* Seasonal styling stays separate so disabling the event restores site.css. */
[data-theme-only="halloween"] {
    display: none;
}

:root[data-theme="halloween"] [data-theme-only="classic"] {
    display: none;
}

:root[data-theme="halloween"] [data-theme-only="halloween"] {
    display: inline;
}

.seasonal-toggle {
    display: inline-flex;
    min-height: 44px;
    padding: 8px 11px;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    color: #ffd6a1;
    background: #211910;
    border: 1px solid #735333;
    border-radius: 5px 14px 5px 14px;
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 800;
}

.seasonal-toggle[hidden] { display: none; }
.seasonal-toggle:hover { background: #332214; border-color: #ffb56e; }
.seasonal-toggle:active { transform: translateY(1px); }
.seasonal-toggle:focus-visible { outline: 3px solid #ffb56e; outline-offset: 4px; }
.seasonal-toggle__state { width: 2ch; font-size: 0.67rem; }
.seasonal-toggle__switch {
    display: flex;
    width: 30px;
    height: 18px;
    padding: 3px;
    flex: 0 0 auto;
    align-items: center;
    background: #5e4b39;
    border-radius: 12px;
}
.seasonal-toggle__switch i { width: 12px; height: 12px; background: #ffddb6; border-radius: 50%; }
.seasonal-toggle[aria-pressed="true"] .seasonal-toggle__switch { background: #ef984f; }
.seasonal-toggle[aria-pressed="true"] .seasonal-toggle__switch i { background: #21140a; transform: translateX(12px); }

.seasonal-notice { display: none; }
.has-js .seasonal-notice {
    display: flex;
    margin-bottom: 24px;
    align-items: center;
    gap: 13px;
    color: #ffdcad;
}
.seasonal-notice__date {
    display: grid;
    width: 44px;
    min-height: 48px;
    flex: 0 0 auto;
    place-content: center;
    color: #21140b;
    background: #f5ad63;
    border-radius: 3px 10px 3px 10px;
    text-align: center;
    line-height: 1;
}
.seasonal-notice__date small { font-size: 0.6rem; font-weight: 800; }
.seasonal-notice__date strong { margin-top: 3px; font-family: var(--font-display); font-size: 1.6rem; }
.seasonal-notice__copy { display: grid; gap: 2px; }
.seasonal-notice__copy strong { font-size: 0.87rem; }
.seasonal-notice__copy span { color: #c9bdac; font-size: 0.76rem; }
.seasonal-notice__action {
    min-height: 44px;
    padding: 8px 0 8px 10px;
    margin-left: auto;
    flex: 0 0 auto;
    color: #ffd6a1;
    background: transparent;
    border: 0;
    text-decoration: underline;
    text-underline-offset: 4px;
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
}
.seasonal-notice__action:hover { color: #fff4d5; }

:root[data-theme="halloween"] {
    --bg: #110f0b;
    --bg-deep: #090b08;
    --surface: #1c1912;
    --surface-soft: #272219;
    --surface-raised: #30281d;
    --gold: #edaa63;
    --gold-light: #ffd29a;
    --orange: #ef9852;
    --muted: #c0b8a9;
    --line: rgba(243, 173, 97, 0.2);
    --line-strong: rgba(243, 173, 97, 0.42);
    accent-color: #efa15b;
    scrollbar-color: #765332 #110f0b;
}
:root[data-theme="halloween"] ::selection { color: #1b140d; background: #ffd29a; }
:root[data-theme="halloween"] body {
    background: linear-gradient(rgba(16, 13, 9, 0.88), rgba(8, 11, 7, 0.95)), url("../img/moss-stone.webp") center top / 900px auto;
}
:root[data-theme="halloween"] .site-header { background: rgba(17, 15, 10, 0.98); border-bottom-color: var(--line); }
:root[data-theme="halloween"] .home-hero {
    background: linear-gradient(90deg, rgba(8, 12, 7, 0.93), rgba(8, 12, 7, 0.64) 42%, rgba(8, 12, 7, 0.15)),
        linear-gradient(180deg, transparent 70%, var(--bg)), url("../img/halloween-forest.png") 58% center / cover;
}
:root[data-theme="halloween"] .hero-brand__wilds {
    color: #f5ae67;
    background: none;
    -webkit-text-fill-color: currentColor;
}
:root[data-theme="halloween"] .hero-scene {
    background: linear-gradient(180deg, rgba(9, 13, 7, 0.12), rgba(9, 13, 7, 0.42)), url("../img/halloween-forest.png") 75% center / cover;
    border-color: rgba(239, 158, 82, 0.5);
}
:root[data-theme="halloween"] .hero-scene__glow { background: radial-gradient(circle, rgba(239, 136, 48, 0.25), transparent 68%); }
:root[data-theme="halloween"] .home-character {
    width: 1100px;
    right: -490px;
    bottom: -20px;
}
:root[data-theme="halloween"] .hero-scene__caption,
:root[data-theme="halloween"] .hero-server-strip { background-color: rgba(19, 18, 12, 0.97); border-color: var(--line); }
:root[data-theme="halloween"] .hero-scene__label { color: #ffd8a8; background: rgba(16, 14, 9, 0.9); border-color: var(--line); }
:root[data-theme="halloween"] .button--primary {
    color: #24170b;
    background: linear-gradient(180deg, rgba(255, 244, 209, 0.26), transparent 48%), #efa15b;
    border-color: #ffd29a;
    box-shadow: 0 10px 26px rgba(129, 70, 26, 0.24);
}
:root[data-theme="halloween"] .button--secondary { background-color: #282116; border-color: var(--line-strong); }
:root[data-theme="halloween"] .feature-card,
:root[data-theme="halloween"] .home-product-card,
:root[data-theme="halloween"] .product-card,
:root[data-theme="halloween"] .dashboard-card { background-color: #1c1a13; border-color: var(--line); }
:root[data-theme="halloween"] .home-portal-section { background-color: #10120c; }
:root[data-theme="halloween"] .site-footer { background-color: #0e100b; border-top-color: var(--line); }

@media (prefers-reduced-motion: no-preference) {
    .seasonal-toggle__switch i { transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), background-color 180ms ease; }
    :root[data-theme="halloween"] .home-character { animation: halloween-arrival 480ms cubic-bezier(0.16, 1, 0.3, 1) both; }
    @keyframes halloween-arrival { from { opacity: 0.65; } to { opacity: 1; } }
}

@media (max-width: 1280px) and (min-width: 941px) {
    .site-header__inner { gap: 12px; }
    .primary-navigation { gap: 8px; }
    .nav-link { padding-inline: 10px; }
    .server-quick { display: none; }
}
@media (max-width: 1180px) {
    :root[data-theme="halloween"] .home-character { width: 1010px; right: -475px; }
}
@media (min-width: 941px) and (max-height: 840px) {
    .has-js .seasonal-notice { margin-bottom: 16px; }
}
@media (max-width: 940px) {
    .seasonal-toggle { margin-left: auto; }
    :root[data-theme="halloween"] .primary-navigation { background: linear-gradient(rgba(12, 14, 8, 0.95), rgba(12, 14, 8, 0.98)), url("../img/halloween-forest.png") center / cover; }
    :root[data-theme="halloween"] .home-hero {
        background: linear-gradient(rgba(8, 12, 7, 0.65), rgba(8, 12, 7, 0.85)), url("../img/halloween-forest.png") 62% center / cover;
    }
    :root[data-theme="halloween"] .home-character { width: auto; height: calc(100% - 30px); left: 4%; right: auto; bottom: 0; }
}
@media (max-width: 680px) {
    .seasonal-toggle { padding: 7px 9px; gap: 6px; font-size: 0.7rem; }
    .seasonal-toggle__state { display: none; }
    .site-header__inner { gap: 10px; }
    .has-js .seasonal-notice { gap: 10px; margin-bottom: 20px; }
    .seasonal-notice__copy strong { font-size: 0.78rem; }
    .seasonal-notice__copy span { font-size: 0.7rem; }
    .seasonal-notice__action { font-size: 0.74rem; padding-left: 0; }
}
@media (max-width: 430px) {
    .seasonal-toggle { padding-inline: 7px; }
    .site-header__inner { gap: 7px; }
    .site-brand { gap: 7px; }
    .site-brand__mark { width: 36px; }
    .site-brand__copy strong { font-size: 0.85rem; }
    .seasonal-notice__date { width: 36px; min-height: 44px; }
    .seasonal-notice__copy span { max-width: 23ch; }
}