/* ============================================================
   Holiday themes — loaded only while a holiday is active
   (includes/holiday.php; toggle in Admin > Settings).

   <body> gets:  .holiday .holiday--<key>   colors (always)
                 .holiday-decor             decorations (unless "Colors only")

   Brand tokens (--blue/--orange) are deliberately NOT remapped:
   orange is used as text on dark blue across the site, so swapping it
   per holiday would break contrast. Each holiday instead sets its own
   --hol-* tokens, applied to the site chrome below. Every rule is gated
   on :not(.a11y-high-contrast) so the High Contrast tool always wins.
   ============================================================ */

/* ── Per-holiday tokens ─────────────────────────────────────
   --hol-1/--hol-2  accent pair (header rule, dividers, footer rule)
   --hol-bar        top bar + greeting bar background (white text ≥ 9:1)
   --hol-bar-link   top bar phone links (≥ 5.9:1 on --hol-bar)
   --hol-hero       tint blended into the start of the page-hero gradient
   --hol-trim       strip hanging under the header (and over the footer); tiles keep
                    their SVG aspect ratio, so only the strip height is set
   --hol-acc        logo accessory, sat on the wheelchair figure's head
   --hol-hero-art   background layers drawn over heroes / the slideshow */
body.holiday--halloween {
  --hol-1: #ed722c; --hol-2: #6b2fa3;
  --hol-bar: #2a1640; --hol-bar-link: #ffb347; --hol-hero: #2a1640;
  --hol-trim: url("../images/holidays/halloween-trim.svg");
  --hol-acc: url("../images/holidays/halloween-hat.svg");
  --acc-w: 34px; --acc-x: 85%; --acc-y: 9%; --acc-tx: -46%; --acc-ty: -86%; --acc-rot: -10deg;
  --hol-hero-art:
    url("../images/holidays/halloween-web.svg") left top / 120px no-repeat,
    url("../images/holidays/halloween-web-r.svg") right top / 120px no-repeat,
    url("../images/holidays/halloween-edge.svg") left bottom / auto 56px repeat-x;
}
body.holiday--christmas {
  --hol-1: #c62828; --hol-2: #1b7a3d;
  --hol-bar: #0f4d2a; --hol-bar-link: #f2c14e; --hol-hero: #0f4d2a;
  --hol-trim: url("../images/holidays/xmas-lights.svg");
  --hol-acc: url("../images/holidays/xmas-hat.svg");
  --acc-w: 34px; --acc-x: 85%; --acc-y: 9%; --acc-tx: -40%; --acc-ty: -84%; --acc-rot: -8deg;
  --hol-hero-art:
    url("../images/holidays/xmas-flakes.svg") 0 0 / 220px auto repeat,
    url("../images/holidays/xmas-snow.svg") left bottom / auto 34px repeat-x;
}
body.holiday--thanksgiving {
  --hol-1: #c0392b; --hol-2: #d4a017;
  --hol-bar: #4a2310; --hol-bar-link: #f0b44c; --hol-hero: #4a2310;
  --hol-trim: url("../images/holidays/thanks-garland.svg");
  --hol-acc: url("../images/holidays/thanks-hat.svg");
  --acc-w: 30px; --acc-x: 85%; --acc-y: 9%; --acc-tx: -50%; --acc-ty: -86%; --acc-rot: -6deg;
  --hol-hero-art: url("../images/holidays/thanks-edge.svg") left bottom / auto 46px repeat-x;
}
body.holiday--newyear {
  --hol-1: #d4af37; --hol-2: #b8bcc8;
  --hol-bar: #14121f; --hol-bar-link: #e8c76a; --hol-hero: #14121f;
  --hol-trim: url("../images/holidays/ny-trim.svg");
  --hol-acc: url("../images/holidays/ny-hat.svg");
  --acc-w: 28px; --acc-x: 85%; --acc-y: 9%; --acc-tx: -50%; --acc-ty: -88%; --acc-rot: 10deg;
  --hol-hero-art:
    url("../images/holidays/ny-fireworks.svg") right 4% top 10px / 170px no-repeat,
    url("../images/holidays/ny-fireworks.svg") left 3% top 30px / 120px no-repeat,
    url("../images/holidays/ny-edge.svg") left bottom / auto 46px repeat-x;
}
body.holiday--july4 {
  --hol-1: #b22234; --hol-2: #3c3b6e;
  --hol-bar: #3c3b6e; --hol-bar-link: #ffffff; --hol-hero: #3c3b6e;
  --hol-trim: url("../images/holidays/patriotic-bunting.svg");
  --hol-acc: url("../images/holidays/flag.svg");
  --acc-w: 24px; --acc-x: 91%; --acc-y: 9%; --acc-tx: -10%; --acc-ty: -80%; --acc-rot: 8deg;
  --hol-hero-art:
    url("../images/holidays/july4-fireworks.svg") right 4% top 10px / 170px no-repeat,
    url("../images/holidays/july4-fireworks.svg") left 3% top 30px / 120px no-repeat,
    url("../images/holidays/stars-edge.svg") left bottom / auto 22px repeat-x;
}
/* Veterans Day + Labor Day: same red/white/blue family, intentionally quieter. */
body.holiday--veterans {
  --hol-1: #b22234; --hol-2: #c9a646;
  --hol-bar: #1f2f5a; --hol-bar-link: #e6c869; --hol-hero: #1f2f5a;
  --hol-trim: url("../images/holidays/patriotic-bunting.svg");
  --hol-acc: url("../images/holidays/flag.svg");
  --acc-w: 24px; --acc-x: 91%; --acc-y: 9%; --acc-tx: -10%; --acc-ty: -80%; --acc-rot: 8deg;
  --hol-hero-art: url("../images/holidays/stars-edge.svg") left bottom / auto 22px repeat-x;
}
body.holiday--labor {
  --hol-1: #b22234; --hol-2: #2e558c;
  --hol-bar: #1e3a61; --hol-bar-link: #ffffff; --hol-hero: #1e3a61;
  --hol-trim: url("../images/holidays/patriotic-bunting.svg");
  --hol-acc: url("../images/holidays/labor-hat.svg");
  --acc-w: 26px; --acc-x: 85%; --acc-y: 9%; --acc-tx: -50%; --acc-ty: -82%; --acc-rot: -6deg;
  --hol-hero-art: url("../images/holidays/stars-edge.svg") left bottom / auto 22px repeat-x;
}

/* ============================================================
   COLORS (always on while a holiday is active)
   ============================================================ */
body.holiday:not(.a11y-high-contrast) .top-bar { background: var(--hol-bar); }
body.holiday:not(.a11y-high-contrast) .top-bar-phones a { color: var(--hol-bar-link); }
body.holiday:not(.a11y-high-contrast) .top-bar-phones a:hover { color: #ffffff; }

body.holiday:not(.a11y-high-contrast) .site-header {
  border-bottom: 3px solid var(--hol-1);
  border-image: linear-gradient(90deg, var(--hol-1), var(--hol-2), var(--hol-1)) 1;
}
body.holiday:not(.a11y-high-contrast) .section-divider {
  background: linear-gradient(90deg, var(--hol-1) 0 50%, var(--hol-2) 50% 100%);
}
body.holiday:not(.a11y-high-contrast) .page-hero {
  background: linear-gradient(135deg, var(--hol-hero) 0%, var(--blue-dark) 45%, var(--blue) 100%);
}
body.holiday:not(.a11y-high-contrast) .site-footer {
  border-top: 4px solid var(--hol-1);
  border-image: linear-gradient(90deg, var(--hol-1), var(--hol-2), var(--hol-1)) 1;
}

/* ── Home page greeting bar (same footprint as the hiring bar) ── */
.hol-bar {
  position: relative; z-index: 2; background: var(--hol-bar); color: #ffffff;
  font-family: var(--font-head); letter-spacing: .03em;
  border-bottom: 3px solid var(--hol-1);
}
.hol-bar[hidden] { display: none; }
.hol-bar-inner { display: flex; align-items: center; gap: 12px; min-height: 40px; }
.hol-bar-icon {
  width: 26px; height: 22px; flex-shrink: 0;
  background: var(--hol-acc) center / contain no-repeat;
}
.hol-bar-text { font-weight: 500; line-height: 1.25; padding: 6px 0; }
.hol-bar-close {
  margin-left: auto; background: none; border: 0; color: #ffffff; font-size: 1.5rem; line-height: 1;
  width: 32px; height: 32px; cursor: pointer; border-radius: 50%; opacity: .85; flex-shrink: 0;
}
.hol-bar-close:hover { opacity: 1; background: rgba(255,255,255,.15); }
@media (max-width: 640px) {
  .hol-bar-inner { gap: 8px; }
  .hol-bar-text { font-size: .82rem; }
}

/* ── Admin-only preview notice ── */
.hol-preview {
  position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 1101;
  background: #1c2233; color: #ffffff; border: 2px solid var(--hol-1); border-radius: 999px;
  padding: 6px 16px; font-size: .85rem; box-shadow: 0 6px 24px rgba(0,0,0,.35); white-space: nowrap;
}
.hol-preview a { color: var(--hol-bar-link); font-weight: 600; margin-left: 10px; text-decoration: underline; }

/* ============================================================
   DECORATIONS (.holiday-decor — off in "Colors only" mode)
   All pointer-events: none and aria-hidden, so they never block
   a tap or reach a screen reader.
   ============================================================ */
.hol-trim, .hol-logo-acc, .hol-dangler { display: none; }

body.holiday-decor:not(.a11y-high-contrast) .hol-trim {
  display: block; position: absolute; left: 0; right: 0; top: 100%; height: 34px;
  margin-top: 3px; /* clear the header's holiday rule */
  background: var(--hol-trim) left top / auto 100% repeat-x;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s;
}
/* main.js tucks the trim away once the page scrolls (the header is fixed) */
body.holiday-decor:not(.a11y-high-contrast) .hol-trim.is-tucked { opacity: 0; visibility: hidden; }

/* Logo accessory: .site-logo shrinks to the logo so % offsets track the image */
body.holiday-decor:not(.a11y-high-contrast) .site-header .site-logo { position: relative; justify-self: start; }
body.holiday-decor:not(.a11y-high-contrast) .hol-logo-acc {
  display: block; position: absolute; pointer-events: none;
  left: var(--acc-x); top: var(--acc-y); width: var(--acc-w); aspect-ratio: 1.2;
  background: var(--hol-acc) center bottom / contain no-repeat;
  transform: translate(var(--acc-tx), var(--acc-ty)) rotate(var(--acc-rot));
}

/* Hero / home slideshow art (sits under the text, over the background) */
body.holiday-decor:not(.a11y-high-contrast) .page-hero::after,
body.holiday-decor:not(.a11y-high-contrast) .slideshow::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: var(--hol-hero-art);
}
body.holiday-decor:not(.a11y-high-contrast) .slideshow::after { z-index: 1; }

/* Footer: the same trim, hanging from the footer's top rule */
body.holiday-decor:not(.a11y-high-contrast) .site-footer { position: relative; }
body.holiday-decor:not(.a11y-high-contrast) .site-footer::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 26px; z-index: 1;
  background: var(--hol-trim) left top / auto 100% repeat-x;
  pointer-events: none;
}

/* ── Motion: at most two slow loops per holiday, in the header only ── */
@keyframes hol-swing {
  from { transform: rotate(-9deg); }
  to   { transform: rotate(9deg); }
}
@keyframes hol-twinkle {
  0%, 100% { opacity: .15; }
  50%      { opacity: 1; }
}

/* Dangler: one ornament/bat/leaf swinging from the trim */
body.holiday-decor:not(.a11y-high-contrast).holiday--christmas .hol-dangler,
body.holiday-decor:not(.a11y-high-contrast).holiday--halloween .hol-dangler,
body.holiday-decor:not(.a11y-high-contrast).holiday--thanksgiving .hol-dangler {
  display: block; position: absolute; top: 6px; right: 14%;
  transform-origin: 50% 0; animation: hol-swing 2.8s ease-in-out infinite alternate;
  background: var(--hol-dangler) center top / contain no-repeat;
}
body.holiday--christmas    { --hol-dangler: url("../images/holidays/xmas-ornament.svg"); }
body.holiday--halloween    { --hol-dangler: url("../images/holidays/halloween-bat.svg"); }
body.holiday--thanksgiving { --hol-dangler: url("../images/holidays/thanks-leaf.svg"); }
body.holiday--christmas    .hol-dangler { width: 28px; height: 38px; }
body.holiday--halloween    .hol-dangler { width: 44px; height: 32px; }
body.holiday--thanksgiving .hol-dangler { width: 28px; height: 36px; }

/* Twinkle: Christmas bulbs (two alternating sets) and New Year sparkles */
body.holiday-decor:not(.a11y-high-contrast).holiday--christmas .hol-trim::before,
body.holiday-decor:not(.a11y-high-contrast).holiday--christmas .hol-trim::after,
body.holiday-decor:not(.a11y-high-contrast).holiday--newyear .hol-trim::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-size: auto 100%; background-repeat: repeat-x;
  animation: hol-twinkle 2.4s ease-in-out infinite;
}
body.holiday--christmas .hol-trim::before { background-image: url("../images/holidays/xmas-glow-a.svg"); }
body.holiday--christmas .hol-trim::after  { background-image: url("../images/holidays/xmas-glow-b.svg"); animation-delay: -1.2s !important; }
body.holiday--newyear   .hol-trim::before { background-image: url("../images/holidays/ny-sparkle.svg"); }

@media (prefers-reduced-motion: reduce) {
  .hol-dangler, .hol-trim::before, .hol-trim::after { animation: none !important; }
  .hol-trim::before, .hol-trim::after { opacity: .6; }
}
body.a11y-reduce-motion .hol-dangler,
body.a11y-reduce-motion .hol-trim::before,
body.a11y-reduce-motion .hol-trim::after { animation: none !important; }
body.a11y-reduce-motion .hol-trim::before,
body.a11y-reduce-motion .hol-trim::after { opacity: .6; }

/* ── Phones ── */
@media (max-width: 1024px) {
  body.holiday-decor:not(.a11y-high-contrast) .hol-trim { height: 24px; }
  body.holiday-decor:not(.a11y-high-contrast) .hol-logo-acc { width: calc(var(--acc-w) * .68); }
  body.holiday-decor:not(.a11y-high-contrast) .hol-dangler { top: 3px; right: 22%; }
}

/* Phones: the fireworks would sit behind the hero heading, so keep just the edge art */
@media (max-width: 640px) {
  body.holiday--newyear { --hol-hero-art: url("../images/holidays/ny-edge.svg") left bottom / auto 40px repeat-x; }
  body.holiday--july4   { --hol-hero-art: url("../images/holidays/stars-edge.svg") left bottom / auto 22px repeat-x; }
}

@media print {
  .hol-bar, .hol-trim, .hol-logo-acc, .hol-preview { display: none !important; }
  .page-hero::after, .slideshow::after, .site-footer::before { display: none !important; }
}
