/* Saisonales Theme (admin-konfigurierbar im Manager) + Partikel-Canvas + Deko. */

#seasonal-particles{position:fixed;inset:0;z-index:40;pointer-events:none}

[data-season="none"] #seasonal-particles,[data-particles="0"] #seasonal-particles{display:none}

.seasonal-toggle{position:fixed;right:16px;bottom:16px;z-index:41;display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid var(--line-strong);border-radius:99px;background:rgba(17,23,32,.86);backdrop-filter:blur(6px);color:var(--muted);font-size:11px;font-weight:800;cursor:pointer}
.seasonal-toggle:hover{color:var(--text)}
[data-season="none"] .seasonal-toggle{display:none}

.announcement-banner{padding:10px 16px;text-align:center;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(90deg,var(--orange),var(--orange-soft))}

.seasonal-homepage-message{margin:18px auto 0;padding:14px 20px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(120deg,rgba(243,107,43,.12),var(--surface) 60%);font-size:14px;font-weight:600;text-align:center}

/* --- Deko-Elemente: generisch per Position/Animation, Inhalt (Emoji oder Bild) kommt aus dem Manager --- */
#seasonal-decor{position:fixed;inset:0;z-index:5;pointer-events:none;overflow:hidden}
[data-season="none"] #seasonal-decor{display:none}
.seasonal-decor-item{position:fixed;font-size:84px;line-height:1;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45));opacity:.9;user-select:none}
.seasonal-decor-item img{display:block;width:1em;height:1em;object-fit:contain}
.seasonal-decor-item[data-position="bottom-left"]{left:-10px;bottom:-14px}
.seasonal-decor-item[data-position="bottom-right"]{right:-6px;bottom:-10px}
.seasonal-decor-item[data-position="top-left"]{left:0;top:84px}
.seasonal-decor-item[data-position="top-right"]{right:4%;top:84px}
.seasonal-decor-item[data-animation="sway"]{animation:seasonal-sway 6s ease-in-out infinite}
.seasonal-decor-item[data-animation="bob"]{animation:seasonal-bob 3.4s ease-in-out infinite}
@media(max-width:760px){.seasonal-decor-item{font-size:52px}}

@keyframes seasonal-sway{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(4deg) translateY(-6px)}}
@keyframes seasonal-bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-8px) rotate(3deg)}}

@media (prefers-reduced-motion: reduce){#seasonal-particles,#seasonal-decor{display:none}}