/* ===========================
   wb-cio — SALE badge (modular)
   =========================== */

/* Theme tokens (can be overridden per theme/season) */
:root{
  --sale-1: color-mix(in srgb, var(--brand-burnt) 90%, #ff9 10%);
  --sale-2: #ff4d6d;            /* warm magenta fallback */
  --sale-text: #fff;
  --sale-ring: rgba(0,0,0,.06);
}

/* Hide legacy Woo .onsale if any */
.woocommerce ul.products li.product .onsale,
.woocommerce div.product .onsale{ display:none !important; }

/* Positioning host */
.woocommerce ul.products li.product,
.woocommerce div.product .images{ position:relative }

/* Badge */
.wbc-sale{
  position:absolute; z-index:2;
  top:12px; left:12px;
  display:inline-grid; grid-auto-flow:column; align-items:center; gap:8px;
  padding:6px 10px;
  border-radius:999px;
  color:var(--sale-text);
  background: linear-gradient(135deg, var(--sale-1), var(--sale-2));
  box-shadow: 0 8px 20px rgba(0,0,0,.14), inset 0 0 0 1px var(--sale-ring);
  font-weight:800;
  line-height:1;
  -webkit-font-smoothing: antialiased;
  overflow:hidden;
}

/* Label chip */
.wbc-sale__badge{
  padding:.25rem .5rem;
  border-radius:999px;
  background: color-mix(in srgb, #000 16%, transparent);
  font-size:12px;
}

/* Percentage */
.wbc-sale__value{ font-size:13px; }

/* Sheen motion */
.wbc-sale::before{
  content:"";
  position:absolute; inset:-1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  transform: translateX(-120%);
  animation: wbc-sale-sheen 2.8s ease-in-out infinite;
  mix-blend-mode: screen;
}
@keyframes wbc-sale-sheen{
  0%{ transform:translateX(-120%) }
  55%{ transform:translateX(120%) }
  100%{ transform:translateX(120%) }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .wbc-sale::before{ animation:none }
}