/* Tipografie de bază & reset */
:root {
  --font-main: 'Roboto', system-ui, Arial, sans-serif;
  --transition: .4s cubic-bezier(.4,0,.2,1);
  --radius: 18px;
  --glass-bg: rgba(255,255,255,.08);
  --glass-border: rgba(255,255,255,.25);
  --shadow: 0 4px 14px -2px rgba(0,0,0,.45);
  --outline: 2px solid #fff6;

  /* Paletă Toamnă */
  --autumn-bg: #2a1a12;
  --autumn-grad-1: #5a2c0a;
  --autumn-grad-2: #a74d00;
  --autumn-accent: #ffb347;
  --autumn-accent-2: #ffd27f;
  --autumn-text: #ffe9d6;
  --autumn-table-head: linear-gradient(135deg,#b35c00,#ff9800 70%);

  /* Paletă Crăciun */
  --xmas-bg: #0d1f1a;
  --xmas-grad-1: #0d3b2e;
  --xmas-grad-2: #146b49;
  --xmas-accent: #ff3d3d; /* mai vibrant */
  --xmas-accent-2: #ffd74d; /* aur mai cald */
  --xmas-text: #f1fff9;
  --xmas-table-head: linear-gradient(135deg,#b71c1c,#ff7043 65%);

  /* Variabile dinamice (se schimbă cu tema) */
  --c-bg: var(--autumn-bg);
  --c-grad-1: var(--autumn-grad-1);
  --c-grad-2: var(--autumn-grad-2);
  --c-accent: var(--autumn-accent);
  --c-accent-2: var(--autumn-accent-2);
  --c-text: var(--autumn-text);
  --c-table-head: var(--autumn-table-head);
  --c-snow-leaf: #ffb347;
}

body.theme-christmas {
  --c-bg: var(--xmas-bg);
  --c-grad-1: var(--xmas-grad-1);
  --c-grad-2: var(--xmas-grad-2);
  --c-accent: var(--xmas-accent);
  --c-accent-2: var(--xmas-accent-2);
  --c-text: var(--xmas-text);
  --c-table-head: var(--xmas-table-head);
  --c-snow-leaf: #fff;
}

* { box-sizing: border-box; }
html,body { height: 100%; }
body {
  margin: 0;
  font-family: var(--font-main);
  color: var(--c-text);
  background: radial-gradient(circle at 30% 20%, var(--c-grad-2) -10%, var(--c-bg) 70%) fixed;
  background-attachment: fixed;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  transition: background 1.2s ease, color var(--transition);
}

.site-header { position:sticky; top:0; z-index:60; backdrop-filter:blur(14px) saturate(1.4); background:linear-gradient(115deg, rgba(0,0,0,.55), rgba(0,0,0,.15)); border-bottom:1px solid rgba(255,255,255,.12); box-shadow:0 2px 8px -2px #0008; padding:.65rem .9rem; }
.site-header .inner { max-width:1150px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:1.6rem; }
.brand-block { display:flex; align-items:center; gap:.9rem; }
.author-link { font-weight:600; font-size:.8rem; letter-spacing:.6px; text-transform:uppercase; color: var(--c-accent-2); text-decoration:none; padding:.55rem .85rem; border:1px solid rgba(255,255,255,.25); border-radius:10px; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.04)); position:relative; overflow:hidden; transition:var(--transition); }
.author-link::after { content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent,rgba(255,255,255,.25),transparent); transform:translateX(-120%); transition:transform .8s ease; }
.author-link:hover::after { transform:translateX(120%); }
.author-link:hover, .author-link:focus-visible { color: var(--c-accent); outline:none; }
.toolbar { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.6rem; }

.gradient-text { background: linear-gradient(120deg,var(--c-accent),var(--c-accent-2)); background-clip:text; -webkit-background-clip:text; color:transparent; filter:drop-shadow(0 2px 4px #000a); font-size:clamp(1.5rem,3.2vw,2.85rem); margin:0; line-height:1.05; letter-spacing:.5px; font-weight:700; position:relative; }
body.theme-christmas #site-title::after { content:"🎅"; position:absolute; right:-2.2rem; top:-.6rem; font-size:2.2rem; filter:drop-shadow(0 2px 4px #000); animation: hat-bob 3.5s ease-in-out infinite; }
@keyframes hat-bob { 0%,100% { transform: translateY(0) rotate(-6deg);} 50% { transform: translateY(5px) rotate(-3deg);} }

.theme-controls { display: flex; align-items: center; gap: .6rem; }
.btn { background:linear-gradient(140deg,var(--c-accent) 10%,var(--c-accent-2)); color:#1d0f06; border:none; padding:.55rem 1.05rem; font-weight:600; font-size:.8rem; border-radius:14px; cursor:pointer; letter-spacing:.5px; box-shadow:0 2px 6px -1px #000a; transition:var(--transition); position:relative; overflow:hidden; }
.btn::before { content:""; position:absolute; inset:0; background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent); transform:translateX(-120%); transition:transform .7s ease; }
.btn:hover::before { transform:translateX(120%); }
.btn:hover, .btn:focus-visible { outline:none; filter:brightness(1.1); }
.btn:active { transform:translateY(2px); }

.auto-switch { font-size: .8rem; display: flex; align-items: center; gap: .35rem; user-select: none; }
.auto-switch input { accent-color: var(--c-accent); cursor: pointer; }

.container { max-width:1100px; margin:clamp(.6rem,3.5vh,2.2rem) auto 3.5rem; padding:2.2rem clamp(1rem,2.8vw,2.4rem); background:linear-gradient(170deg,rgba(255,255,255,.10),rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.18); border-radius:clamp(16px,2vw,26px); box-shadow:0 6px 28px -8px #000a, inset 0 0 0 1px rgba(255,255,255,.05); position:relative; overflow:hidden; }

.container::before,
.container::after {
  content: "";
  position: absolute;
  width: 420px; height: 420px;
  background: radial-gradient(circle at 30% 30%, var(--c-accent-2) 0%, transparent 70%);
  opacity: .06;
  filter: blur(10px);
  animation: float 14s linear infinite;
}
.container::after { top: auto; bottom: -160px; right: -160px; animation-duration: 18s; }
.container::before { top: -160px; left: -160px; }
@keyframes float { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.countdown-table { width: 100%; border-collapse: collapse; font-size: clamp(.85rem,1.5vw,1rem); }
.countdown-table thead th {
  background: var(--c-table-head);
  color: #fff;
  text-align: left;
  padding: .85rem .9rem;
  font-weight: 600;
  letter-spacing: .5px;
  position: sticky; top: 0; backdrop-filter: blur(6px);
}
.countdown-table tbody td { padding: .7rem .8rem; border-bottom: 1px solid rgba(255,255,255,.12); }
.countdown-table tbody tr { transition: background .35s ease; }
.countdown-table tbody tr:hover { background: rgba(255,255,255,.12); }
.countdown-table tbody tr.past { opacity: .55; }

.legend { font-size: .75rem; opacity: .75; margin-top: .6rem; }

.next-big { margin-top:2.2rem; background:linear-gradient(135deg, rgba(0,0,0,.35), rgba(255,255,255,.07)); padding:1.15rem 1.25rem; border-radius:var(--radius); border:1px solid rgba(255,255,255,.22); box-shadow:0 4px 14px -4px #000a, inset 0 0 0 1px rgba(255,255,255,.08); }
.next-big h3 { margin: 0 0 .5rem; font-size: 1.1rem; letter-spacing: .5px; text-transform: uppercase; }
#next-stage { margin: 0; font-weight: 600; }

.site-footer { text-align: center; padding: 2rem 1rem 3rem; font-size: .8rem; opacity: .8; }

.visually-hidden { position: absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0; }

/* Responsivitate */
@media (max-width: 640px) { .countdown-table thead th, .countdown-table tbody td { padding:.65rem .55rem; } .theme-controls { flex-wrap:wrap; } .container { padding:1.35rem 1rem 1.9rem; } .brand-block { flex-direction:column; align-items:flex-start; gap:.4rem; } .author-link { font-size:.7rem; } }

/* Particule sezoniere (frunze sau zăpadă) */
.particle-layer { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: 5; }
.leaf, .snowflake { position: absolute; top: -10vh; font-size: clamp(14px,2vw,28px); animation: fall linear forwards; opacity: .85; }
@keyframes fall { to { transform: translate3d(var(--x-end), 110vh, var(--z,0)) rotate(var(--rot-end)); opacity: .3; } }

body.theme-christmas .leaf { display:none; }
body:not(.theme-christmas) .snowflake { display:none; }
/* Overlay ninsoare subtle */
body.theme-christmas::before { content:""; position:fixed; inset:0; pointer-events:none; background-image: radial-gradient(circle at 10% 20%, rgba(255,255,255,.12) 0 2px, transparent 2px), radial-gradient(circle at 80% 40%, rgba(255,255,255,.1) 0 2px, transparent 2px), radial-gradient(circle at 50% 70%, rgba(255,255,255,.09) 0 2px, transparent 2px); background-size: 220px 220px, 180px 180px, 260px 260px; animation: snow-static 18s linear infinite; }
@keyframes snow-static { from { background-position: 0 0, 0 0, 0 0;} to { background-position: 0 600px, 0 400px, 0 500px;} }

/* Bară lumini */
.lights-bar { height:52px; width:100%; display:flex; justify-content:center; gap:18px; padding:10px 0 12px; position:relative; overflow:visible; }
body.theme-christmas .lights-bar { background:linear-gradient(90deg,#0d3b2e,#174d3d 40%,#0d3b2e); box-shadow: inset 0 -2px 4px -2px #000a; }
body:not(.theme-christmas) .lights-bar { display:none; }
.lights-bar::before, .lights-bar::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, rgba(255,255,255,.07) 0 12px, transparent 12px 24px); opacity:.25; }
.lights-bar::after { background:linear-gradient(90deg,transparent,rgba(255,255,255,.35) 50%,transparent); mix-blend-mode:overlay; animation: slide-glow 6s linear infinite; }
@keyframes slide-glow { from { background-position: -200% 0;} to { background-position: 200% 0;} }

/* Becuri */
body.theme-christmas .lights-bar { counter-reset: bulb 0; }
body.theme-christmas .lights-bar::after { pointer-events:none; }
body.theme-christmas .lights-bar { --bulbs: 22; }
body.theme-christmas .lights-bar { display:grid; grid-auto-flow:column; grid-auto-columns: minmax(16px,1fr); }
body.theme-christmas .lights-bar::before { content:""; position:absolute; left:0; right:0; top:9px; height:4px; background: linear-gradient(90deg,#20382f,#284a3f); box-shadow:0 2px 3px -1px #0009, inset 0 0 2px 1px #17352b; border-radius:4px; }
body.theme-christmas .lights-bar span { --s: calc(var(--i) * .1s); width:22px; height:34px; margin:0 6px; position:relative; top:0; display:inline-block; border-radius:42% 42% 55% 55%; background: radial-gradient(circle at 32% 24%, #fff9, transparent 58%), linear-gradient(180deg, #fff6, currentColor 35%, currentColor 65%, #0006); border:2px solid #0005; box-shadow: 0 3px 6px -1px #000c, 0 0 10px 3px currentColor, inset 0 -5px 10px -3px rgba(0,0,0,.45); filter: drop-shadow(0 0 4px currentColor); animation: bulb-fade 3.2s ease-in-out infinite; animation-delay: var(--s); }
body.theme-christmas .lights-bar span { transform-origin: top center; animation: bulb-fade 3.2s ease-in-out infinite, sway 4.8s ease-in-out infinite; }
body.theme-christmas .lights-bar span:nth-child(odd) { animation-duration:3.4s, 5.2s; }
@keyframes sway { 0%,100% { transform: rotate(3deg); } 25% { transform: rotate(-4deg); } 50% { transform: rotate(2.5deg); } 75% { transform: rotate(-3deg);} }

/* Sârmă curbată */
body.theme-christmas .lights-bar .wire { position:absolute; inset:0 0 auto 0; width:100%; height:40px; pointer-events:none; }
body.theme-christmas .wire-base { fill:none; stroke:#1a2d27; stroke-width:2.2; filter: drop-shadow(0 2px 2px #000a); }
body.theme-christmas .wire-glow { fill:none; stroke:#52ffc055; stroke-width:4; stroke-linecap:round; stroke-dasharray:6 14; animation: wire-glow 7s linear infinite; }
@keyframes wire-glow { to { stroke-dashoffset:-200; } }
body.theme-christmas .lights-bar span::before { content:""; position:absolute; top:-6px; left:50%; transform:translateX(-50%); width:12px; height:8px; background:#222; border-radius:3px 3px 2px 2px; box-shadow:0 2px 3px -1px #000a; }
@keyframes bulb-fade { 0%,100% { opacity:.95; transform:translateY(0) scale(1);} 45% { opacity:.5; transform:translateY(2px) scale(.96);} 55% { opacity:.65; } }
/* Puls color shift subtil pentru câteva becuri */
body.theme-christmas .lights-bar span:nth-child(4n) { animation: bulb-fade 3.4s ease-in-out infinite, hue 12s linear infinite; }
@keyframes hue { from { filter:hue-rotate(0deg) drop-shadow(0 0 3px currentColor);} to { filter:hue-rotate(360deg) drop-shadow(0 0 3px currentColor);} }

/* Ornamentare container în modul Crăciun */
body.theme-christmas .container { border:2px solid #fff3; background:linear-gradient(175deg, rgba(255,255,255,.15), rgba(255,255,255,.03)); box-shadow:0 8px 30px -10px #000a, 0 0 0 2px rgba(255,255,255,.08) inset; }
body.theme-christmas .container::after { background: radial-gradient(circle at 30% 30%, #ffd74d33 0%, transparent 70%); opacity:.12; }
body.theme-christmas .container::before { background: radial-gradient(circle at 70% 70%, #ff3d3d33 0%, transparent 70%); opacity:.10; }

/* Bordură candy cane pentru panou următor prag */
body.theme-christmas .next-big { border:2px solid #fff7; background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.04)); position:relative; }
body.theme-christmas .next-big::before { content:""; position:absolute; inset:0; padding:2px; border-radius:inherit; background: repeating-linear-gradient(45deg,#ff3d3d 0 8px,#ffffff 8px 16px,#2e7d32 16px 24px,#ffffff 24px 32px); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: destination-out; mask-composite: exclude; opacity:.35; }

/* Zăpadă la footer */

/* Tranziții line între culori */
body, .container, .countdown-table thead th, .next-big, .btn, .author-link, .site-header { transition: background 1s ease, color .6s ease, border-color .8s ease, box-shadow 1s ease; }

/* Stilizare scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0003; }
::-webkit-scrollbar-thumb { background: linear-gradient(var(--c-accent),var(--c-accent-2)); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(var(--c-accent-2),var(--c-accent)); }