
/* Ensure containers allow absolute positioning */
ul.products li.product, .product { position: relative; }

/* Shared style */
.boleh-cod-badge,
.boleh-cod-badge-single {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 12;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 20px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 12px;
  text-transform: none;
  line-height: 1;
  color: #1f2937; /* dark */
  background: linear-gradient(135deg, #ffd34d 0%, #ffb300 100%);
  box-shadow: 0 4px 12px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.5);
  border: 1px solid rgba(0,0,0,.08);
  letter-spacing: .3px;
  animation: codBlink 1.3s ease-in-out infinite;
  pointer-events: none; /* don’t block clicks */
  user-select: none;
  white-space: nowrap;
}

/* Increase spacing explicitly between words */
.boleh-cod-badge .boleh,
.boleh-cod-badge-single .boleh { margin-right: 4px; }

/* Slightly larger on single product */
.boleh-cod-badge-single {
  top: 12px;
  right: 12px;
  font-size: 14px;
  padding: 8px 12px;
  border-radius: 24px;
}

/* Text emphasis */
.boleh-cod-badge strong,
.boleh-cod-badge-single strong {
  color: #0b0f1a;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}

/* Subtle pulsing + blink */
@keyframes codBlink {
  0%, 100% { opacity: 1; transform: translateY(0) scale(1); }
  45% { opacity: .55; }
  50% { transform: translateY(-1px) scale(1.03); }
  55% { opacity: .55; }
}

/* Optional: reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  .boleh-cod-badge, .boleh-cod-badge-single { animation: none; }
}
