/* Competer Occasions: the occasion layer only. Layout lives in the theme (ui2026.css); this file colours and decorates.
   Tokens (set in <head> by the plugin): --oc-primary --oc-accent --oc-ink --oc-bg --oc-bg2 --oc-on-primary --oc-pattern */

/* Countdown pill */
.oc-countdown{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.oc-countdown-label{font-weight:600;opacity:.85}
.oc-countdown-time{font-weight:800}

/* Exam countdown strip (sits under the header on home and PLP) */
.oc-exam-strip{background:var(--oc-bg,#F3F7FC);border-bottom:1px solid rgba(15,23,42,.06);color:var(--oc-ink,#0B1F3A);font-size:13px}
.oc-exam-inner{display:flex;align-items:center;gap:10px;min-height:38px;padding-top:4px;padding-bottom:4px;overflow:hidden}
.oc-exam-emoji{font-size:16px;line-height:1}
.oc-exam-label{font-weight:600;white-space:nowrap}
.oc-countdown--exam strong{color:var(--oc-primary,#1F5FBF);font-size:14px}
.oc-exam-cta{margin-left:auto;font-weight:700;color:var(--oc-primary,#1F5FBF);text-decoration:none;white-space:nowrap}
.oc-exam-cta:hover{text-decoration:underline}
@media(max-width:640px){.oc-exam-inner{font-size:12px;gap:8px}.oc-exam-cta{font-size:12px}}

/* Greeting and coupon pills */
.oc-greeting{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--oc-primary)}
.oc-coupon{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1.5px dashed var(--oc-accent,#F28C28);color:var(--oc-ink,#0B1F3A);padding:5px 12px;border-radius:999px;font-size:13px}
.oc-coupon strong{letter-spacing:.06em}

/* Occasion hero surface: the theme's .hero-oc uses these */
body.has-occasion .hero-oc{background:linear-gradient(135deg,var(--oc-bg) 0%,var(--oc-bg2) 100%);color:var(--oc-ink)}
body.has-occasion .hero-oc::before{content:"";position:absolute;inset:0;background-image:var(--oc-pattern);background-size:140px 140px;opacity:.10;pointer-events:none}
body.has-occasion .hero-oc .hero-oc-eyebrow{background:var(--oc-primary);color:var(--oc-on-primary)}
body.has-occasion .hero-oc .hero-oc-cta{background:var(--oc-accent);color:#1a1a1a}
body.has-occasion .hero-oc .hero-oc-title em{color:var(--oc-primary)}

/* Announcement strip and product badge pick up the occasion primary */
body.has-occasion .topstrip{background:var(--oc-primary);color:var(--oc-on-primary)}
body.has-occasion .pc-badge--occasion{background:var(--oc-accent);color:#1a1a1a}
body.has-occasion .nav-occasion a{color:var(--oc-accent)!important}

/* Festive footer motif at very low volume (allowed per design rules: ornament never touches the commerce layer) */
body.has-occasion .cf-accent{background:linear-gradient(90deg,var(--oc-primary),var(--oc-accent))}