/* Temporary holiday look (src/holiday.js). Loaded only while it is switched on.
   Decorations never cover or block anything: every layer ignores clicks. */

/* ---------- fairy lights hanging under the header ---------- */
.site-header { position: sticky; }
.holiday-lights { position: absolute; left: 0; right: 0; top: 100%; height: 26px; overflow: hidden; pointer-events: none; display: flex; justify-content: space-around; padding: 0 8px; border-top: 2px solid #1f2a00; }
.holiday-lights i { position: relative; flex: none; width: 9px; height: 13px; margin-top: var(--drop, 3px); border-radius: 50% 50% 50% 50% / 38% 38% 62% 62%; background: var(--c, #e9c46a); box-shadow: 0 0 10px 2px var(--c, #e9c46a); animation: holiday-twinkle 2.8s ease-in-out infinite; animation-delay: var(--d, 0s); }
.holiday-lights i::before { content: ''; position: absolute; left: 2px; top: -4px; width: 5px; height: 5px; border-radius: 1px; background: #2c3a00; }
.holiday-lights i:nth-child(4n+1) { --c: #d83a3a; }
.holiday-lights i:nth-child(4n+2) { --c: #f1c453; }
.holiday-lights i:nth-child(4n+3) { --c: #58b368; }
.holiday-lights i:nth-child(4n+4) { --c: #fff3d6; }
@keyframes holiday-twinkle { 0%, 100% { opacity: 1; } 50% { opacity: .45; box-shadow: 0 0 3px 0 var(--c, #e9c46a); } }

/* ---------- a light snowfall over the page ---------- */
.holiday-snow { position: fixed; inset: 0; z-index: 90; pointer-events: none; overflow: hidden; }
.holiday-snow i { position: absolute; top: -14px; width: var(--s, 6px); height: var(--s, 6px); border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(120, 150, 170, .22), 0 1px 4px rgba(60, 90, 110, .35); opacity: var(--o, .8); animation: holiday-fall var(--t, 16s) linear infinite; animation-delay: var(--d, 0s); }
@keyframes holiday-fall { to { transform: translate(var(--x, 30px), 105vh); } }

/* ---------- candy-cane edge on the announcement bar ---------- */
.holiday .announce-bar { position: relative; padding-top: calc(.5rem + 5px); }
.holiday .announce-bar::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: repeating-linear-gradient(135deg, #c9302c 0 10px, #fff 10px 20px); opacity: .9; }

/* ---------- a snowdrift on top of the footer ---------- */
.holiday .site-footer { padding-top: 4.4rem; }
.holiday .site-footer::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 44px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 44' preserveAspectRatio='none'%3E%3Cpath fill='%23fbf6ee' d='M0 0h600v14c-40 22-80 26-130 12s-90-6-140 8-110 12-160-2S60 14 0 30z'/%3E%3C/svg%3E") top center / 600px 44px repeat-x; }

/* ---------- small festive touches ---------- */
.holiday .product-card:hover { box-shadow: 0 0 0 2px #e9c46a, 0 18px 34px -20px rgba(120, 30, 30, .55); }
.holiday .cart-total { padding: .7rem 1rem; border-radius: 12px; background: linear-gradient(120deg, #fff8e4, #fff); border: 1.5px solid #e6c36a; display: inline-block; }

/* ---------- festive note on the cart and thank-you pages ---------- */
.holiday-note { position: relative; display: flex; align-items: center; gap: 1.1rem; margin: 1rem 0 1.4rem; padding: 1.1rem 1.3rem 1.1rem 1.6rem; border-radius: 18px; overflow: hidden; color: #fff8ea;
  background: radial-gradient(ellipse 60% 90% at 0% 0%, rgba(233, 196, 106, .32), transparent 70%), radial-gradient(ellipse 40% 80% at 100% 100%, rgba(179, 38, 45, .45), transparent 70%), linear-gradient(150deg, #17432a, #0d2a1a); box-shadow: 0 0 0 2px #e9c46a, 0 18px 34px -22px rgba(0, 0, 0, .6); }
.holiday-note::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 8px; background: repeating-linear-gradient(135deg, #c9302c 0 9px, #fff 9px 18px); }
.holiday-note__gift { flex: none; position: relative; width: 54px; height: 46px; margin-top: 10px; border-radius: 6px; background: #b3262d; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .12); }
.holiday-note__gift::before { content: ''; position: absolute; left: 50%; top: -8px; bottom: 0; width: 10px; margin-left: -5px; background: #e9c46a; }
.holiday-note__gift::after { content: ''; position: absolute; left: -4px; right: -4px; top: -8px; height: 14px; border-radius: 4px; background: #d0323a; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .1); border-left: 0; background-image: linear-gradient(90deg, transparent calc(50% - 5px), #e9c46a calc(50% - 5px) calc(50% + 5px), transparent calc(50% + 5px)); }
.holiday-note__txt { min-width: 0; }
.holiday-note__txt p { margin: 0; }
.holiday-note__eyebrow { font-size: .74rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: #e9c46a; }
.holiday-note__title { font-family: var(--font-serif, Georgia, serif); font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 700; line-height: 1.2; color: #fff; margin: 2px 0 4px !important; }
.holiday-note__text { font-size: .96rem; color: #e2ecdd; }
.holiday-note a { color: #e9c46a; font-weight: 700; }
@media (max-width: 560px) { .holiday-note { padding: .9rem 1rem .9rem 1.3rem; gap: .8rem; } .holiday-note__gift { width: 40px; height: 34px; } }

/* calm version */
@media (prefers-reduced-motion: reduce) { .holiday-snow { display: none; } .holiday-lights i { animation: none; } }
@media print { .holiday-snow, .holiday-lights, .holiday-note { display: none; } }

/* polish: soft flakes without an outline, and room for the lights above the announcement text */
.holiday-snow i { background: radial-gradient(circle, #fff 0 55%, rgba(255, 255, 255, .6) 100%); box-shadow: 0 1px 5px rgba(70, 100, 125, .38); }
.holiday .announce-bar { padding-top: calc(.5rem + 24px); }
.holiday main.wrap { padding-top: 10px; }