/* Comfortrek V253 — badge visual cleanup + CTA readability
 * Keeps the V241/V248 rail geometry. Removes the hazy/rectangular-looking glow
 * caused by filter/drop-shadow layers and makes the shine a contained, premium
 * highlight. Also hard-locks Add to Cart text to white on dark CTA buttons.
 */

/* ---------- Product-card CTA readability ---------- */
html body .tag-card .add-to-cart-btn,
html body .product-card .add-to-cart-btn,
html body.appearance-light .tag-card .add-to-cart-btn,
html body.appearance-auto.appearance-light .tag-card .add-to-cart-btn,
html body.appearance-dark .tag-card .add-to-cart-btn,
html body.appearance-auto.appearance-dark .tag-card .add-to-cart-btn {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:none !important;
  opacity:1 !important;
  font-weight:750 !important;
}

html body .tag-card .add-to-cart-btn:hover,
html body .tag-card .add-to-cart-btn:focus-visible,
html body .tag-card .add-to-cart-btn:active {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* ---------- Clean premium badge glow ---------- */
.product-card-topline .product-badge,
.product-badges-pdp .product-badge,
.pm-badge-preview-stage .product-badge,
.pm-badge-library-trigger .product-badge {
  /* Never let the badge itself become a hazy rectangular light source. */
  filter:none !important;
  transform:none !important;
  will-change:box-shadow !important;
  box-shadow:
    0 5px 14px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.12),
    0 0 8px color-mix(in srgb,var(--ct-badge-bg,#9b6b12) 28%,transparent) !important;
  animation:ctBadge253Glow 3.8s ease-in-out infinite !important;
}

/* The glow follows the badge colour and remains tight to its rounded shape. */
@keyframes ctBadge253Glow {
  0%,100% {
    box-shadow:
      0 5px 14px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.22),
      inset 0 -1px 0 rgba(0,0,0,.12),
      0 0 7px color-mix(in srgb,var(--ct-badge-bg,#9b6b12) 24%,transparent);
  }
  50% {
    box-shadow:
      0 6px 16px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.30),
      inset 0 -1px 0 rgba(0,0,0,.12),
      0 0 13px color-mix(in srgb,var(--ct-badge-bg,#9b6b12) 42%,transparent);
  }
}

/* Keep the shine inside the rounded badge. No screen blend and no giant
 * translucent beam, which is what made the old effect look like an illusion. */
.product-card-topline .product-badge::after,
.product-badges-pdp .product-badge::after,
.pm-badge-preview-stage .product-badge::after,
.pm-badge-library-trigger .product-badge::after {
  top:-45% !important;
  bottom:-45% !important;
  left:-8% !important;
  width:24% !important;
  min-width:14px !important;
  border-radius:999px !important;
  transform:translate3d(-300%,0,0) skewX(-18deg) !important;
  background:linear-gradient(105deg,
    transparent 0%,
    rgba(255,255,255,0) 30%,
    rgba(255,255,255,.28) 44%,
    rgba(255,255,255,.72) 50%,
    rgba(255,255,255,.28) 56%,
    rgba(255,255,255,0) 70%,
    transparent 100%) !important;
  mix-blend-mode:normal !important;
  animation:ctBadge253Shine var(--ct-badge-speed,2.35s) linear infinite !important;
  opacity:calc(.72 * var(--ct-badge-shine,1)) !important;
  pointer-events:none !important;
}

@keyframes ctBadge253Shine {
  0%,12% { transform:translate3d(-300%,0,0) skewX(-18deg); opacity:0; }
  20% { opacity:calc(.72 * var(--ct-badge-shine,1)); }
  34% { opacity:calc(.82 * var(--ct-badge-shine,1)); }
  48%,100% { transform:translate3d(520%,0,0) skewX(-18deg); opacity:0; }
}

/* Explicitly disabled effects must stay disabled even though this file is
 * the final visual override. */
.product-card-topline .product-badge[style*="--ct-badge-glow:0"],
.product-badges-pdp .product-badge[style*="--ct-badge-glow:0"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-glow:0"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-glow:0"] {
  filter:none !important;
  animation:none !important;
  box-shadow:
    0 5px 14px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.12) !important;
}

@media (prefers-reduced-motion:reduce) {
  .product-card-topline .product-badge,
  .product-badges-pdp .product-badge,
  .pm-badge-preview-stage .product-badge,
  .pm-badge-library-trigger .product-badge,
  .product-card-topline .product-badge::after,
  .product-badges-pdp .product-badge::after,
  .pm-badge-preview-stage .product-badge::after,
  .pm-badge-library-trigger .product-badge::after {
    animation:none !important;
  }
}