/* 🎉 Website sale look — only active while a website sale is running
   (set it in the dashboard: Products → 🎉 Website sale). */
html.saletheme:not(.xmas){ --coral:#E5195E; --coral-d:#A80F43; --sun:#FFD000; }

/* top sale bar */
.sale-bar{display:flex;align-items:center;justify-content:center;gap:10px 16px;flex-wrap:wrap;padding:9px 16px;text-align:center;
  color:#fff;font-size:.97rem;position:relative;z-index:41;
  background:repeating-linear-gradient(135deg,#2B2340 0 26px,#352A4E 26px 52px)}
.sale-bar b{color:#FFD000;font-weight:800;letter-spacing:.02em;text-transform:uppercase}
.sale-bar .sb-cd{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border-radius:999px;padding:2px 12px;font-weight:700;font-size:.88rem;white-space:nowrap}
.sale-bar .sb-btn{background:#FFD000;color:#2B2340;font-weight:800;border-radius:999px;padding:4px 16px;font-size:.9rem;white-space:nowrap}
.sale-bar .sb-btn:hover{background:#fff}
@media (max-width:560px){.sale-bar{font-size:.9rem;padding:8px 12px}.sale-bar .sb-txt2{display:none}}
html.saletheme .xmas-bar{display:none} /* one bar at a time: the sale bar wins */
html.saletheme:not(.xmas) .nav{border-bottom:3px solid #FFD000}

/* hero sticker */
.sale-sticker{position:absolute;top:-3%;inset-inline-start:-4%;width:32%;aspect-ratio:1;z-index:3;transform:rotate(-12deg);
  filter:drop-shadow(0 10px 14px rgba(43,35,64,.25));animation:ss-pop 2.8s ease-in-out infinite;pointer-events:none}
.sale-sticker .ss-star{position:absolute;inset:0;background:#FFD000;
  clip-path:polygon(50% 0%,59% 12%,73% 5%,76% 20%,91% 18%,86% 33%,100% 40%,89% 51%,98% 64%,83% 69%,85% 84%,70% 82%,63% 96%,51% 87%,38% 98%,32% 83%,17% 86%,18% 70%,3% 64%,12% 52%,0% 40%,14% 33%,9% 18%,24% 20%,27% 5%,41% 12%)}
.sale-sticker .ss-txt{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#2B2340;line-height:.95}
.sale-sticker b{font-size:clamp(1.5rem,4.2vw,2.5rem);font-weight:800}
.sale-sticker span{font-size:clamp(.85rem,2vw,1.1rem);font-weight:800;letter-spacing:.06em}
.sale-sticker small{font-size:clamp(.55rem,1.3vw,.72rem);font-weight:700;margin-top:3px}
@keyframes ss-pop{0%,100%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(-8deg) scale(1.06)}}
html.saletheme .hero-art .toy:nth-of-type(1){display:none}

/* big banner above the toys */
.salebanner:empty{display:none}
.salebanner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px 24px;margin:0 0 30px;padding:22px 28px;border-radius:26px;color:#fff;position:relative;overflow:hidden;
  background:radial-gradient(circle at 92% 18%,rgba(255,208,0,.35) 0 4px,transparent 5px) 0 0/46px 46px,
             radial-gradient(circle at 30% 70%,rgba(255,255,255,.18) 0 3px,transparent 4px) 0 0/38px 38px,
             linear-gradient(120deg,#2B2340,#4B2A6B 55%,#E5195E);box-shadow:0 16px 36px rgba(43,35,64,.22)}
html.xmas .salebanner{background:radial-gradient(circle at 30% 70%,rgba(255,255,255,.22) 0 3px,transparent 4px) 0 0/38px 38px,linear-gradient(120deg,#0B3D2B,#0F7B4F 50%,#C8102E)}
.salebanner .sbn-pct{width:104px;height:104px;border-radius:50%;background:#FFD000;color:#2B2340;display:grid;place-content:center;text-align:center;line-height:.9;transform:rotate(-8deg);box-shadow:0 8px 18px rgba(0,0,0,.2)}
.salebanner .sbn-pct b{font-size:2.1rem;font-weight:800}
.salebanner .sbn-pct small{font-size:.8rem;font-weight:800;letter-spacing:.06em}
.salebanner h3{font-size:1.6rem;font-weight:800;line-height:1.15;margin-bottom:4px}
.salebanner p{opacity:.92}
.salebanner .sbn-side{display:grid;gap:10px;justify-items:end}
.salebanner .sbn-cd{background:rgba(255,255,255,.14);border-radius:999px;padding:4px 14px;font-weight:700;font-size:.92rem;white-space:nowrap}
.salebanner .sbn-btn{background:#FFD000;color:#2B2340;font-weight:800;border-radius:999px;padding:10px 22px;white-space:nowrap;box-shadow:0 4px 0 #C9A400}
.salebanner .sbn-btn:hover{background:#fff}
@media (max-width:700px){.salebanner{grid-template-columns:1fr;justify-items:center;text-align:center;padding:22px 18px}.salebanner .sbn-side{justify-items:center}.salebanner h3{font-size:1.35rem}}

/* toy cards, toy page, basket */
.wsbadge{position:absolute;top:12px;inset-inline-end:12px;background:#FFD000;color:#2B2340;border-radius:999px;padding:3px 11px;font-size:.8rem;font-weight:800;z-index:1;box-shadow:0 4px 10px rgba(201,164,0,.35)}
.wsnote{background:#FFF6CC;border:2px dashed #F2C200;border-radius:14px;padding:10px 14px;font-weight:600;margin:-4px 0 18px;color:#5A4500}
.salelines{display:grid;gap:6px}
.salelines .subl,.salelines .discl{display:flex;justify-content:space-between;gap:10px;font-weight:600;color:var(--muted)}
.salelines .discl{color:#E5195E;font-weight:800}
html.xmas .salelines .discl{color:#C8102E}
.salelines .minl{background:#FFF6CC;border-radius:12px;padding:8px 12px;font-weight:700;font-size:.92rem;text-align:center;color:#5A4500}

/* section labels */
html.saletheme:not(.xmas) .eyebrow{background:#FFD000;border-color:#FFD000;color:#2B2340}
@media print{.sale-bar,.sale-sticker{display:none}}
@media (prefers-reduced-motion:reduce){.sale-sticker{animation:none}}
