/* TypeX festive decorations — Diwali & Christmas. Pure CSS/JS, no images. Toggled from Admin > Site Settings. */
#festive{ position:absolute; top:0; left:0; width:100%; height:0; z-index:1200; pointer-events:none; overflow:visible; }
#festive *{ pointer-events:none; }
#festive-fx{ position:fixed; inset:0; width:100%; height:100%; z-index:60; pointer-events:none; }

/* ---------- string lights ---------- */
.fz-wire{ position:absolute; top:0; left:0; width:100%; height:60px; overflow:visible; }
.fz-wire path{ fill:none; stroke:#2b2b2b; stroke-width:1.6; opacity:.75; }
.fz-bulb{ position:absolute; width:11px; height:16px; margin:-1px 0 0 -5px; border-radius:50% 50% 55% 55%/40% 40% 60% 60%; background:var(--c); box-shadow:0 0 8px 2px var(--c), 0 0 18px 4px color-mix(in srgb, var(--c) 55%, transparent); transform-origin:50% 0; animation:fzTwinkle 1.8s ease-in-out infinite; }
.fz-bulb::before{ content:''; position:absolute; left:50%; top:-5px; width:6px; height:6px; margin-left:-3px; background:#3a3a3a; border-radius:2px 2px 0 0; }
.fz-bulb.p2{ animation-duration:2.4s; } .fz-bulb.p3{ animation-duration:1.3s; animation-direction:alternate; }
@keyframes fzTwinkle{ 0%,100%{ opacity:1; filter:brightness(1.15);} 50%{ opacity:.45; filter:brightness(.8);} }

/* ---------- hanging things (lanterns, baubles) ---------- */
.fz-hang{ position:absolute; top:0; transform-origin:50% 0; animation:fzSway 4.5s ease-in-out infinite alternate; }
.fz-hang .str{ display:block; width:1.5px; margin:0 auto; background:linear-gradient(#888,#bbb); }
@keyframes fzSway{ from{ transform:rotate(-3.5deg);} to{ transform:rotate(3.5deg);} }
.fz-lantern{ display:block; width:38px; height:50px; margin:0 auto; border-radius:12px/16px; position:relative;
  background:linear-gradient(90deg,#b3260f,#ff7a18 35%,#ffd36b 50%,#ff7a18 65%,#b3260f); box-shadow:0 0 22px 6px rgba(255,150,40,.55), inset 0 0 12px rgba(255,255,255,.35); animation:fzGlow 2.4s ease-in-out infinite alternate; }
.fz-lantern::before,.fz-lantern::after{ content:''; position:absolute; left:6px; right:6px; height:5px; background:#6b1a08; border-radius:3px; }
.fz-lantern::before{ top:-4px; } .fz-lantern::after{ bottom:-4px; }
.fz-tassel{ display:block; width:3px; height:16px; margin:5px auto 0; background:#ffb703; border-radius:2px; box-shadow:-6px 2px 0 #ffb703, 6px 2px 0 #ffb703; }
@keyframes fzGlow{ from{ filter:brightness(.9);} to{ filter:brightness(1.25);} }
.fz-bauble{ display:block; width:34px; height:34px; border-radius:50%; margin:0 auto; position:relative; background:radial-gradient(circle at 32% 28%, #fff9 0 12%, transparent 13%), radial-gradient(circle at 50% 55%, var(--c), color-mix(in srgb, var(--c) 55%, #000)); box-shadow:0 4px 10px rgba(0,0,0,.25); }
.fz-bauble::before{ content:''; position:absolute; left:50%; top:-6px; width:12px; height:7px; margin-left:-6px; border-radius:2px; background:linear-gradient(#e8c15a,#a67c00); }
.fz-bauble.star{ border-radius:0; background:var(--c); clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%); width:36px; height:36px; box-shadow:none; filter:drop-shadow(0 0 6px var(--c)); }
.fz-bauble.star::before{ display:none; }

/* ---------- marigold garlands (Diwali) ---------- */
.fz-garland{ position:absolute; top:0; width:30px; }
.fz-garland i{ display:block; width:22px; height:22px; margin:-6px auto 0; border-radius:50%; background:radial-gradient(circle,#ff8f00 0 25%,#ffb300 26% 55%,#ff6d00 56% 100%); box-shadow:0 2px 4px rgba(0,0,0,.25); animation:fzSway 3.6s ease-in-out infinite alternate; transform-origin:50% -20px; }
.fz-garland i:nth-child(3n){ background:radial-gradient(circle,#ffd54f 0 25%,#ffca28 26% 55%,#ffa000 56% 100%); }
.fz-garland i:nth-child(5n){ width:14px; height:20px; border-radius:0 100% 0 100%; background:linear-gradient(135deg,#2e7d32,#66bb6a); }

/* ---------- ground decorations ---------- */
.fz-ground{ position:fixed; bottom:0; z-index:55; line-height:1; user-select:none; }
.fz-ground.r{ right:14px; } .fz-ground.l{ left:150px; }
.fz-emoji{ font-size:54px; filter:drop-shadow(0 4px 6px rgba(0,0,0,.28)); display:inline-block; animation:fzBounce 3.2s ease-in-out infinite; }
.fz-emoji:nth-child(2){ animation-delay:.6s; font-size:44px; } .fz-emoji:nth-child(3){ animation-delay:1.2s; font-size:48px; }
@keyframes fzBounce{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-6px);} }
.fz-diya{ display:inline-block; position:relative; width:54px; height:34px; margin:0 3px; }
.fz-diya .bowl{ position:absolute; bottom:0; left:0; right:0; height:18px; border-radius:2px 2px 28px 28px/2px 2px 18px 18px; background:linear-gradient(#e2711d,#8c3b0a); box-shadow:0 3px 6px rgba(0,0,0,.3); }
.fz-diya .bowl::before{ content:''; position:absolute; left:6px; right:6px; top:-3px; height:6px; border-radius:50%; background:#5a2305; }
.fz-diya .flame{ position:absolute; left:50%; bottom:15px; width:12px; height:22px; margin-left:-6px; border-radius:50% 50% 50% 50%/65% 65% 35% 35%; background:radial-gradient(ellipse at 50% 80%,#fff7c2 0 25%,#ffc83d 45%,#ff7a18 80%); box-shadow:0 0 14px 6px rgba(255,170,40,.65),0 0 34px 14px rgba(255,120,20,.35); transform-origin:50% 100%; animation:fzFlame 1.1s ease-in-out infinite alternate; }
.fz-diya:nth-child(2) .flame{ animation-duration:.8s; } .fz-diya:nth-child(3) .flame{ animation-duration:1.4s; }
@keyframes fzFlame{ 0%{ transform:scale(1,1) rotate(-2deg);} 100%{ transform:scale(.88,1.12) rotate(3deg);} }
.fz-drift{ position:fixed; left:0; right:0; bottom:0; height:16px; z-index:54; background:radial-gradient(24px 16px at 50% 100%,#fff 97%,transparent 100%) 0 0/48px 16px repeat-x; filter:drop-shadow(0 -2px 3px rgba(120,150,200,.4)); }

/* ---------- greeting toast ---------- */
.fz-greet{ position:fixed; left:50%; bottom:22px; transform:translate(-50%,40px); opacity:0; z-index:1250; max-width:min(92vw,520px); padding:12px 44px 12px 18px; border-radius:999px; color:#fff; font-weight:700; font-size:14.5px; line-height:1.4; box-shadow:0 10px 30px rgba(0,0,0,.28); transition:all .6s cubic-bezier(.2,.9,.3,1.2); pointer-events:auto !important; }
.fz-greet.show{ transform:translate(-50%,0); opacity:1; }
.fz-greet button{ position:absolute; right:8px; top:50%; transform:translateY(-50%); width:26px; height:26px; border:0; border-radius:50%; background:rgba(255,255,255,.25); color:#fff; font-size:15px; cursor:pointer; pointer-events:auto !important; }
.fz-diwali .fz-greet{ background:linear-gradient(135deg,#b3260f,#ff7a18 60%,#ffb703); }
.fz-christmas .fz-greet{ background:linear-gradient(135deg,#b3001b,#d62839 55%,#1b7f3a); }

/* ---------- theme tint on page chrome (very light, keeps the design intact) ---------- */
html.fz-diwali .navbar, html.fz-diwali header.site-header{ box-shadow:0 2px 0 #ffb703, 0 4px 14px rgba(255,140,0,.18); }
html.fz-christmas .navbar, html.fz-christmas header.site-header{ box-shadow:0 2px 0 #d62839, 0 4px 14px rgba(27,127,58,.18); }

@media (max-width:760px){
  .fz-ground.l, .fz-lantern-wide{ display:none; }
  .fz-emoji{ font-size:38px; } .fz-emoji:nth-child(2){ font-size:32px; } .fz-emoji:nth-child(3){ font-size:34px; }
  .fz-ground.r{ right:6px; bottom:56px; }
  .fz-greet{ bottom:78px; font-size:13px; border-radius:18px; }
}
@media (prefers-reduced-motion:reduce){
  .fz-bulb,.fz-hang,.fz-emoji,.fz-flame,.fz-diya .flame,.fz-lantern,.fz-garland i{ animation:none !important; }
  #festive-fx{ display:none; }
}
@media print{ #festive,#festive-fx,.fz-ground,.fz-drift,.fz-greet{ display:none !important; } }
