/*!
 * EEHP Pages — progress indicator for the quiz's final step.
 *
 * WHY
 * ---
 * The last quiz screen POSTs to eehp-quiz/v1/submit, which mints a real
 * WooCommerce coupon before the "here is your code" popup can open. On this
 * install that round trip measures ~9s — WooCommerce plus every plugin hooked
 * into saving a coupon — and homepage-inline-quiz-v4.js gives no visual
 * feedback for it beyond swapping the button's text to "Minting your offer
 * code…". The button keeps its normal fill and its normal cursor, so a click
 * reads as having done nothing and people click again.
 *
 * HOW
 * ---
 * submitEmailForm() sets `disabled` on the continue button for exactly the
 * duration of that await (homepage-inline-quiz-v4.js:621 sets it,
 * :660 clears it immediately before showDiscountModal()), and nothing else in
 * the quiz ever disables that button — the only other disabled control is
 * .q-actions__back on the first step, which is a different class. So the
 * attribute is a precise hook for "minting in progress", and the spinner can
 * be pure CSS. That matters: js/homepage-inline-quiz-v4.js is a delivered
 * build file and stays byte-identical to the source theme's copy.
 *
 * Loaded only on the ported home template, after homepage.scoped.css.
 * The prefix is repeated to match what tools/scope-css.php gives the build's
 * own rules (0,4,2), so this cannot be outranked by them or by the kit.
 */

body.eehp-ported-page.eehp-ported-page.eehp-ported-page .q-actions__continue[disabled] {
	cursor: progress;
}

body.eehp-ported-page.eehp-ported-page.eehp-ported-page .q-actions__continue[disabled]::before {
	content: "";
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
	margin-inline-end: 0.6em;
	border: 2px solid currentColor;
	/* One transparent edge is what makes the ring read as spinning. */
	border-top-color: transparent;
	border-radius: 50%;
	animation: eehp-quiz-minting 0.7s linear infinite;
}

@keyframes eehp-quiz-minting {
	to {
		transform: rotate(360deg);
	}
}

/*
 * No spin for anyone who has asked the OS for less motion. The ring stays,
 * dimmed and still, and the button's own "Minting your offer code…" label
 * carries the state — losing the animation must not lose the signal.
 */
@media (prefers-reduced-motion: reduce) {
	body.eehp-ported-page.eehp-ported-page.eehp-ported-page .q-actions__continue[disabled]::before {
		animation: none;
		border-top-color: currentColor;
		opacity: 0.55;
	}
}
