/* ── Sezónní témata ─────────────────────────────────────────────
   Aktivují se atributem data-season na <html>, který nastavuje Flask
   (viz current_season v app.py). Bez atributu se nic nemění.        */

/* Barva úvodního pruhu. Mění se jen vrstva přechodu, pozice a velikost zůstávají ze style.css. */
[data-season="autumn"] .hero {
  background-image:
    radial-gradient(ellipse at 85% 10%, rgba(255,200,120,.35), transparent 50%),
    linear-gradient(120deg, rgba(88,46,16,.96) 0%, rgba(130,70,24,.93) 45%, rgba(178,98,34,.86) 100%);
}
[data-season="christmas"] .hero {
  background-image:
    radial-gradient(ellipse at 50% 115%, rgba(255,214,140,.22), transparent 55%),
    linear-gradient(120deg, rgba(110,16,30,.96) 0%, rgba(70,22,32,.92) 38%, rgba(18,66,46,.95) 100%);
}
[data-season="winter"] .hero {
  background-image: linear-gradient(120deg, rgba(52,82,112,.94), rgba(120,156,186,.72));
}
[data-season="spring"] .hero {
  background-image:
    radial-gradient(ellipse at 20% 0%, rgba(255,250,220,.30), transparent 55%),
    linear-gradient(120deg, #2f8a1c 0%, #4dae2c 32%, #8a9a52 58%, #c45d8c 86%, #b84a7e 100%);
}
/* léto: původní zelená klienta, živější, se sluneční září a jemnými paprsky */
[data-season="summer"] .hero {
  background-image:
    radial-gradient(circle at 88% 4%, rgba(255,246,190,.55) 0%, rgba(255,230,140,.22) 22%, transparent 48%),
    linear-gradient(120deg, #2f9a17 0%, #4dbd25 45%, #7ccf3f 100%);
}
[data-season="summer"] .hero .overlay::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-conic-gradient(from 200deg at 88% 0%, rgba(255,250,215,.13) 0deg 5deg, transparent 5deg 15deg);
  -webkit-mask-image:radial-gradient(circle at 88% 0%, #000 0%, transparent 70%); mask-image:radial-gradient(circle at 88% 0%, #000 0%, transparent 70%);
  animation:sunRays 9s ease-in-out infinite; }
@keyframes sunRays { 0%,100% { opacity:.55; } 50% { opacity:1; } }
@media (prefers-reduced-motion: reduce) { [data-season="summer"] .hero .overlay::before { animation:none; } }

/* Sekce Rezervace ladí s barvou úvodu */
.rsv { position:relative; }
.rsv > .rsv-inner { position:relative; z-index:2; }
[data-season="christmas"] .rsv { --rsv-a:#4a0f18; --rsv-b:#123e2b; --rsv-glow:rgba(227,194,122,.26); }
[data-season="winter"]    .rsv { --rsv-a:#1f3450; --rsv-b:#4d6f8f; --rsv-glow:rgba(230,240,250,.22); }
[data-season="spring"]    .rsv { --rsv-a:#3a9a1f; --rsv-b:#c97a9c; --rsv-glow:rgba(253,214,228,.3); }
[data-season="summer"]    .rsv { --rsv-a:#3a9a1f; --rsv-b:#4dbd25; --rsv-glow:rgba(223,250,217,.35); }

/* Vrstva s částicemi (vkládá ji seasons.js) */
.season-fx {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}

/* ── Sezónní ozdoby dárkového poukazu ──────────────────────────────────────
   Vrstva .voucher-deco kopíruje pohyb obrázku poukazu (dýchání, najetí myší, 3D náklon),
   takže ozdoby působí jako jeho součást. */
.voucher-deco { position:absolute; inset:0; pointer-events:none; z-index:2; transform-style:preserve-3d; transform-origin:center;
  transition:transform .6s cubic-bezier(.2,.9,.25,1); will-change:transform; }
.voucher-float.idle .voucher-deco { animation:voucherBreath 6s ease-in-out infinite; }
.voucher-float:hover .voucher-deco, .voucher-float:focus-within .voucher-deco { animation-play-state:paused; transform:translateY(-10px) scale(1.02); }
.voucher-float.is-tilting .voucher-deco { animation-play-state:paused; }
.vd-defs { position:absolute; width:0; height:0; overflow:hidden; }
.voucher-deco .vd { display:none; position:absolute; inset:0; }
[data-season="autumn"] .vd-autumn, [data-season="christmas"] .vd-christmas,
[data-season="winter"] .vd-winter, [data-season="spring"] .vd-spring { display:block; }
.vd-corner { position:absolute; height:auto; overflow:visible; filter:drop-shadow(0 6px 8px rgba(60,30,10,.28)); }

/* podzim */
.vd-autumn .vd-tl { width:180px; left:-62px; top:-64px; }
.vd-autumn .vd-br { width:140px; right:-46px; bottom:-46px; }
.vd-sway { transform-box:fill-box; transform-origin:30% 80%; animation:vdSway 5.5s ease-in-out var(--d, 0s) infinite; }
@keyframes vdSway { 0%,100% { transform:rotate(-4deg); } 50% { transform:rotate(4deg); } }

/* Vánoce: stuha přes poukaz + mašle */
.vd-ribbon-clip { position:absolute; inset:0; border-radius:20px; overflow:hidden; }
.vd-band { position:absolute; box-shadow:0 0 0 1px rgba(0,0,0,.06), 0 3px 10px rgba(0,0,0,.28); }
.vd-band-v { top:0; bottom:0; left:calc(89% - 13px); width:26px; background:linear-gradient(90deg, #7d1420, #b3202f 25%, #d63a45 50%, #b3202f 75%, #7d1420); }
.vd-band-h { left:0; right:0; top:calc(17% - 12px); height:24px; background:linear-gradient(180deg, #7d1420, #b3202f 25%, #d63a45 50%, #b3202f 75%, #7d1420); }
.vd-bow { position:absolute; width:112px; height:auto; left:calc(89% - 56px); top:calc(17% - 41px); filter:drop-shadow(0 6px 8px rgba(60,10,10,.35)); }

/* zima: sněhová čepice + třpytky */
.vd-snow { position:absolute; left:-10px; top:-34px; width:calc(100% + 20px); height:74px; overflow:visible; filter:drop-shadow(0 -1px 3px rgba(70,100,130,.35)) drop-shadow(0 5px 6px rgba(60,90,120,.35)); }
.vd-winter .vd-sparks { width:80px; right:-26px; top:22px; filter:drop-shadow(0 0 4px rgba(255,255,255,.8)); }
.vd-tw { transform-box:fill-box; transform-origin:center; animation:vdTwinkle 2.6s ease-in-out var(--d, 0s) infinite; }
@keyframes vdTwinkle { 0%,100% { opacity:.35; transform:scale(.7); } 50% { opacity:1; transform:scale(1); } }

/* jaro: kvetoucí větvička */
.vd-spring .vd-branch { width:250px; left:-60px; top:-54px; }

@media (max-width: 620px) {
  .vd-autumn .vd-tl { width:132px; left:-24px; top:-44px; }
  .vd-autumn .vd-br { width:104px; right:-16px; bottom:-32px; }
  .vd-spring .vd-branch { width:186px; left:-20px; top:-40px; }
  .vd-winter .vd-sparks { right:-8px; }
  .vd-bow { width:84px; left:calc(89% - 42px); top:calc(17% - 31px); }
  .vd-band-v { width:20px; left:calc(89% - 10px); }
  .vd-band-h { height:18px; top:calc(17% - 9px); }
}
@media (prefers-reduced-motion: reduce) {
  .voucher-deco, .vd-sway, .vd-tw { animation:none !important; }
}
