/* =============================================================================
   Temi stagionali.

   Si attivano da soli in base al mese (vedi utils/season.js) e cambiano SOLO
   l'aspetto: nessuna funzione dipende da questo file. Se lo togli, la
   dashboard torna al tema normale e tutto continua a funzionare.

   Ogni tema ridefinisce i token di public/css/dashboard.css, quindi si
   ridipingono tutte le pagine insieme. In piu' ognuno ha un segno suo,
   uno solo, discreto, mai davanti al contenuto.

   Si disattiva con ?season=off (resta in un cookie per 30 giorni).
   ============================================================================= */

/* La decorazione sta DIETRO a tutto e non intercetta i clic.
   z-index negativo: un figlio con z-index:-1 si disegna sopra lo sfondo del
   genitore ma sotto il contenuto in flusso. Cosi' non serve toccare il
   position di nessun altro elemento.

   NON reintrodurre regole come "[data-season] .sidebar { position: relative }":
   la sidebar e' position:fixed e una relative la rimette in flusso, dove si
   restringe al contenuto e sfascia il layout di tutte le pagine. */
.season-layer {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
}
[data-season=""] .season-layer { display: none; }

/* Chi ha chiesto meno movimento non vede nulla muoversi. */
@media (prefers-reduced-motion: reduce) {
    .season-layer * { animation: none !important; }
}

/* Su schermi piccoli la decorazione si fa da parte: serve la batteria. */
@media (max-width: 767px) {
    .season-layer { display: none; }
}

/* =========================================================== HALLOWEEN
   Ottobre. Zucca al posto dell'ambra, viola al posto del verde acqua.
   Segno: una ragnatela nell'angolo in alto a sinistra, ferma. */
[data-season="halloween"] {
    --accent: #FF8B2E;
    --accent-hover: #FFB067;
    --accent-dark: #E0631A;
    --accent-soft: rgba(255, 139, 46, 0.14);
    --border-accent: rgba(255, 139, 46, 0.45);
    --success: #A98BFF;
    --success-soft: rgba(169, 139, 255, 0.14);
    --shadow-accent-glow: 0 10px 26px rgba(255, 139, 46, 0.26);
    --bg-primary: #0C0A12;
    --bg-secondary: #130F1C;
    --bg-card: #171221;
    --bg-input: #100C18;
}
[data-season="halloween"] .season-web {
    position: absolute;
    top: 0; left: 0;
    width: 230px; height: 230px;
    color: rgba(255, 139, 46, .16);
}
[data-season="halloween"] .season-moon {
    position: absolute;
    top: 46px; right: 64px;
    width: 92px; height: 92px;
    border-radius: 50%;
    background: radial-gradient(circle at 36% 32%, rgba(255, 196, 120, .22), rgba(255, 139, 46, .05) 68%, transparent 72%);
}


/* Zucche appoggiate in basso: ferme, discrete, dietro a tutto. */
[data-season="halloween"] .season-pumpkins i {
    position: absolute;
    bottom: -6px;
    color: rgba(255, 139, 46, .22);
}
[data-season="halloween"] .season-pumpkins i svg { width: 100%; height: 100%; display: block; }

/* Il ragno cala dal filo, resta appeso un momento e risale.
   Passa di rado: 28 secondi di giro, quasi tutto fuori scena. */
[data-season="halloween"] .season-spider {
    position: absolute;
    top: 0;
    width: 34px;
    color: rgba(214, 196, 255, .5);
    transform: translateY(-120%);
    animation: spiderDrop 28s ease-in-out infinite;
}
[data-season="halloween"] .season-spider .filo {
    display: block;
    width: 1px;
    height: 120px;
    margin: 0 auto;
    background: linear-gradient(180deg, transparent, rgba(214, 196, 255, .35));
}
[data-season="halloween"] .season-spider svg { display: block; width: 34px; height: 34px; }
@keyframes spiderDrop {
    0%, 4%    { transform: translateY(-120%); }
    12%, 22%  { transform: translateY(0); }
    26%       { transform: translateY(-14px); }
    30%, 38%  { transform: translateY(0); }
    48%, 100% { transform: translateY(-120%); }
}

/* Un pipistrello attraversa lo schermo ogni tanto, in diagonale. */
[data-season="halloween"] .season-bat {
    position: absolute;
    top: 18%;
    left: -60px;
    width: 26px;
    color: rgba(169, 139, 255, .42);
    animation: batCross 34s linear infinite;
}
[data-season="halloween"] .season-bat svg { display: block; width: 26px; height: 26px; animation: batFlap 0.42s ease-in-out infinite; transform-origin: center; }
@keyframes batCross {
    0%        { transform: translate(0, 0); opacity: 0; }
    4%        { opacity: 1; }
    40%       { transform: translate(60vw, -40px); opacity: 1; }
    58%       { transform: translate(104vw, 30px); opacity: 0; }
    100%      { transform: translate(104vw, 30px); opacity: 0; }
}
@keyframes batFlap {
    0%, 100% { transform: scaleY(1); }
    50%      { transform: scaleY(.62); }
}

/* =========================================================== NATALE
   Dicembre. Rosso e verde abete, con la neve che scende piano. */
[data-season="natale"] {
    --accent: #E8503F;
    --accent-hover: #FF7A6A;
    --accent-dark: #C33A2B;
    --accent-soft: rgba(232, 80, 63, 0.14);
    --border-accent: rgba(232, 80, 63, 0.45);
    --success: #3FB27A;
    --success-soft: rgba(63, 178, 122, 0.14);
    --shadow-accent-glow: 0 10px 26px rgba(232, 80, 63, 0.26);
    --bg-primary: #080E12;
    --bg-secondary: #0D151B;
    --bg-card: #101920;
    --bg-input: #0A1116;
}
[data-season="natale"] .season-snow i {
    position: absolute;
    top: -12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .55);
    animation: seasonFall linear infinite;
}
@keyframes seasonFall {
    from { transform: translateY(-12px) translateX(0); opacity: 0; }
    10%  { opacity: .9; }
    90%  { opacity: .9; }
    to   { transform: translateY(102vh) translateX(26px); opacity: 0; }
}

/* =========================================================== EPIFANIA
   Prima meta' di gennaio. Blu notte e oro, con la stella cometa. */
[data-season="epifania"] {
    --accent: #F0C04A;
    --accent-hover: #FFD782;
    --accent-dark: #D1A032;
    --accent-soft: rgba(240, 192, 74, 0.14);
    --border-accent: rgba(240, 192, 74, 0.45);
    --success: #6FC3E8;
    --success-soft: rgba(111, 195, 232, 0.14);
    --shadow-accent-glow: 0 10px 26px rgba(240, 192, 74, 0.26);
    --bg-primary: #080B16;
    --bg-secondary: #0D1220;
    --bg-card: #111728;
    --bg-input: #0B0F1C;
}
[data-season="epifania"] .season-comet {
    position: absolute;
    top: 58px; right: 90px;
    width: 3px; height: 3px;
    border-radius: 50%;
    background: #FFE6A6;
    box-shadow: 0 0 10px 3px rgba(240, 192, 74, .5);
}
[data-season="epifania"] .season-comet::after {
    content: '';
    position: absolute;
    right: 3px; top: 50%;
    width: 150px; height: 1.5px;
    transform: translateY(-50%) rotate(-16deg);
    transform-origin: right center;
    background: linear-gradient(270deg, rgba(240, 192, 74, .5), transparent);
}
[data-season="epifania"] .season-stars i {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 230, 166, .7);
    animation: seasonTwinkle ease-in-out infinite;
}
@keyframes seasonTwinkle {
    0%, 100% { opacity: .16; transform: scale(.85); }
    50%      { opacity: .85; transform: scale(1); }
}

/* =========================================================== CARNEVALE
   Febbraio. Coriandoli: i colori diventano piu' squillanti. */
[data-season="carnevale"] {
    --accent: #F2B01E;
    --accent-hover: #FFCF5E;
    --accent-dark: #E0761F;
    --accent-soft: rgba(242, 176, 30, 0.14);
    --border-accent: rgba(242, 176, 30, 0.45);
    --success: #2BC4A4;
    --success-soft: rgba(43, 196, 164, 0.14);
    --color-purple: #A974FF;
    --color-purple-soft: rgba(169, 116, 255, 0.14);
    --color-pink: #FF5C93;
    --shadow-accent-glow: 0 10px 26px rgba(242, 176, 30, 0.26);
    --bg-primary: #0B0A14;
    --bg-secondary: #11101D;
    --bg-card: #151324;
}
[data-season="carnevale"] .season-confetti i {
    position: absolute;
    top: -14px;
    width: 7px; height: 11px;
    border-radius: 1px;
    animation: seasonFlutter linear infinite;
}
@keyframes seasonFlutter {
    from { transform: translateY(-14px) rotate(0deg); opacity: 0; }
    12%  { opacity: .85; }
    88%  { opacity: .85; }
    to   { transform: translateY(104vh) rotate(540deg); opacity: 0; }
}

/* =========================================================== PASQUA
   Marzo. Pastelli e un cielo piu' chiaro, senza perdere il tema scuro. */
[data-season="pasqua"] {
    --accent: #FFC46B;
    --accent-hover: #FFD99B;
    --accent-dark: #F0A24B;
    --accent-soft: rgba(255, 196, 107, 0.14);
    --border-accent: rgba(255, 196, 107, 0.45);
    --success: #7FD6A8;
    --success-soft: rgba(127, 214, 168, 0.14);
    --info: #9FD4F0;
    --info-soft: rgba(159, 212, 240, 0.14);
    --color-pink: #FFA3C0;
    --shadow-accent-glow: 0 10px 26px rgba(255, 196, 107, 0.26);
    --bg-primary: #0A0E12;
    --bg-secondary: #101620;
    --bg-card: #141B26;
}
[data-season="pasqua"] .season-petals i {
    position: absolute;
    top: -14px;
    width: 9px; height: 9px;
    border-radius: 50% 0 50% 50%;
    animation: seasonDrift linear infinite;
}
@keyframes seasonDrift {
    from { transform: translateY(-14px) translateX(0) rotate(0deg); opacity: 0; }
    12%  { opacity: .7; }
    88%  { opacity: .7; }
    to   { transform: translateY(103vh) translateX(44px) rotate(220deg); opacity: 0; }
}

/* ---- Striscia d'avviso: dice che tema e' e come si toglie ---- */
.season-note {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 16px;
    padding: 10px 14px;
    border-radius: var(--radius-md);
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 0.82rem;
    line-height: 1.5;
}
.season-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.season-note .season-dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: currentColor; }