/* Comfortrek V254 — authoritative editable badge rendering.
 * The persisted admin variables are now the single source of truth on cards,
 * PDP and Badge Studio previews. No legacy rule may replace the saved finish.
 */

.product-card-topline .product-badge,
.product-badges-pdp .product-badge,
.pm-badge-preview-stage .product-badge,
.pm-badge-library-trigger .product-badge {
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  isolation:isolate !important;
  padding-left:24px !important;
  color:var(--ct-badge-text,#fff) !important;
  font-family:var(--ct-badge-font,system-ui,sans-serif),system-ui,sans-serif !important;
  font-size:clamp(8px,var(--ct-badge-size,9px),12px) !important;
  font-weight:var(--ct-badge-weight,800) !important;
  letter-spacing:var(--ct-badge-spacing,.055em) !important;
  line-height:1 !important;
  border-radius:var(--ct-badge-radius,999px) !important;
  border:1px solid var(--ct-badge-border,rgba(255,255,255,.24)) !important;
  text-shadow:none !important;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease !important;
}

/* Saved background/gradient choices are authoritative. */
.product-card-topline .product-badge[style*="--ct-badge-visual:solid"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:solid"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:solid"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:solid"] {
  background:var(--ct-badge-bg,#1d2430) !important;
}
.product-card-topline .product-badge[style*="--ct-badge-visual:gradient"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:gradient"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:gradient"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:gradient"] {
  background:linear-gradient(135deg,var(--ct-badge-bg,#1d2430),var(--ct-badge-gradient,#33465d)) !important;
}
.product-card-topline .product-badge[style*="--ct-badge-visual:glass"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:glass"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:glass"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:glass"] {
  background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,.06)) !important;
  backdrop-filter:blur(8px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(8px) saturate(135%) !important;
}
.product-card-topline .product-badge[style*="--ct-badge-visual:metallic"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:metallic"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:metallic"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:metallic"] {
  background:linear-gradient(110deg,var(--ct-badge-bg,#454b55) 0%,#f4f5f7 47%,var(--ct-badge-gradient,#5a616b) 100%) !important;
  color:#111827 !important;
}
.product-card-topline .product-badge[style*="--ct-badge-visual:neon"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:neon"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:neon"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:neon"] {
  background:linear-gradient(135deg,var(--ct-badge-bg,#1d2430),var(--ct-badge-gradient,#33465d)) !important;
}
.product-card-topline .product-badge[style*="--ct-badge-visual:outline"],
.product-badges-pdp .product-badge[style*="--ct-badge-visual:outline"],
.pm-badge-preview-stage .product-badge[style*="--ct-badge-visual:outline"],
.pm-badge-library-trigger .product-badge[style*="--ct-badge-visual:outline"] {
  background:transparent !important;
  border-width:1.5px !important;
}

/* Icon and text are separate layers, so changing font/background never removes
 * the icon or the shine pseudo-element. */
.product-card-topline .product-badge::before,
.product-badges-pdp .product-badge::before,
.pm-badge-preview-stage .product-badge::before,
.pm-badge-library-trigger .product-badge::before {
  content:var(--ct-badge-icon,"✦") !important;
  position:absolute !important;
  left:7px !important;
  top:50% !important;
  width:13px !important;
  height:13px !important;
  transform:translateY(-50%) !important;
  display:grid !important;
  place-items:center !important;
  color:var(--ct-badge-text,#fff) !important;
  font-family:system-ui,sans-serif !important;
  font-size:9px !important;
  font-weight:900 !important;
  line-height:1 !important;
  z-index:3 !important;
  opacity:.96 !important;
  pointer-events:none !important;
  text-shadow:0 0 6px color-mix(in srgb,var(--ct-badge-bg,#1d2430) 70%,transparent) !important;
}

/* Tight colour-following glow — no filter/drop-shadow haze. */
.product-card-topline .product-badge,
.product-badges-pdp .product-badge,
.pm-badge-preview-stage .product-badge,
.pm-badge-library-trigger .product-badge {
  box-shadow:
    0 5px 14px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -1px 0 rgba(0,0,0,.12),
    0 0 7px color-mix(in srgb,var(--ct-badge-bg,#1d2430) 25%,transparent) !important;
  filter:none !important;
  animation:ctBadge254Glow 3.6s ease-in-out infinite !important;
}
@keyframes ctBadge254Glow {
  0%,100% { box-shadow:0 5px 14px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.12),0 0 6px color-mix(in srgb,var(--ct-badge-bg,#1d2430) 22%,transparent); }
  50% { box-shadow:0 6px 16px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(0,0,0,.12),0 0 12px color-mix(in srgb,var(--ct-badge-bg,#1d2430) 42%,transparent); }
}

/* Contained shine: only the narrow highlight moves, never a full badge-sized beam. */
.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 {
  content:"" !important;
  position:absolute !important;
  top:-55% !important;
  bottom:-55% !important;
  left:-12% !important;
  width:20% !important;
  min-width:12px !important;
  border-radius:999px !important;
  background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,0) 32%,rgba(255,255,255,.42) 45%,rgba(255,255,255,.90) 50%,rgba(255,255,255,.42) 55%,rgba(255,255,255,0) 68%,transparent 100%) !important;
  transform:translate3d(-320%,0,0) skewX(-18deg) !important;
  mix-blend-mode:normal !important;
  opacity:0 !important;
  pointer-events:none !important;
  z-index:4 !important;
  animation:ctBadge254Shine var(--ct-badge-speed,2.35s) linear infinite !important;
}
@keyframes ctBadge254Shine {
  0%,14% { transform:translate3d(-320%,0,0) skewX(-18deg); opacity:0; }
  22% { opacity:calc(.82 * var(--ct-badge-shine,1)); }
  34% { opacity:calc(.92 * var(--ct-badge-shine,1)); }
  48%,100% { transform:translate3d(620%,0,0) skewX(-18deg); opacity:0; }
}

/* The admin preview should be visually identical to the storefront renderer. */
.pm-badge-preview-stage .product-badge,
.pm-badge-library-trigger .product-badge { flex:0 0 auto !important; }

/* Explicit effect switches always win. */
.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"] {
  animation:none !important;
  box-shadow:0 5px 14px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.12) !important;
}
.product-card-topline .product-badge[style*="--ct-badge-shine:0"]::after,
.product-badges-pdp .product-badge[style*="--ct-badge-shine:0"]::after,
.pm-badge-preview-stage .product-badge[style*="--ct-badge-shine:0"]::after,
.pm-badge-library-trigger .product-badge[style*="--ct-badge-shine:0"]::after { animation:none !important; opacity:0 !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 { animation:none !important; }
  .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; opacity:0 !important; }
}