/**
 * Purchase Limit — Scarcity Counter (frontend).
 * Layout/colour are inline on the server-rendered markup; this file only owns
 * the pulsing dot (dot / pill / barText templates) and the reduced-motion opt-out.
 */
.scp-pc { line-height: 1.35; }
.scp-pc-inner { max-width: 100%; }

.scp-pc-pulse {
	animation: scp-pc-pulse 1.6s ease-in-out infinite;
}
@keyframes scp-pc-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(0, 0, 0, .28); }
	70%      { box-shadow: 0 0 0 6px rgba(0, 0, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.scp-pc-pulse { animation: none; }
}

/* Auto-rendered counter sitting just above the Buy Now / Enrol button. */
.scp-pl-above-buy { margin: 0 0 10px; }

/* Sold-out treatment on the product/course page (server-side, no JS): disable
   the buy button and relabel it with the Sold Out message. The label comes from
   the --scp-pl-soldout-label custom property set per page; it falls back to
   "Sold Out" if that isn't present. */
.scp-pl-soldout .scp-enroll-btn {
	pointer-events: none;
	opacity: .7;
	filter: grayscale(1);
	cursor: not-allowed;
	position: relative;
}
.scp-pl-soldout .scp-enroll-btn > span { visibility: hidden; }
.scp-pl-soldout .scp-enroll-btn::after {
	content: var(--scp-pl-soldout-label, "Sold Out");
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 10px;
	visibility: visible;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}