/* Colors, typography and radius stay in theme.json / native block controls.
 * A translucent inset shadow darkens custom colors and gradients without
 * replacing them, or dimming the text. All selectors preserve native markup. */
:where(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button) {
	transition: box-shadow 180ms ease, translate 180ms ease, scale 80ms ease;
}

:is(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button):focus-visible {
	outline: 2px solid var(--wp--preset--color--custom-accent, #2563eb);
	outline-offset: 4px;
}

/* Form submits, download packaging and explicit Plain Hover Effects stay put.
 * Do not stack another lift/shadow on a container the editor already animates. */
:where(input, button[type="submit"], form .wp-element-button, .is-style-tone-only, .plain-hover-effects, .plain-hover-effects *, .preset-download-button, .freepresets-download-button, .fp-cart-button, .wp-block-edd-checkout, .wp-block-edd-login, .wp-block-edd-register) {
	--fp-button-lift: 0px;
	--fp-button-shadow: 0 0 0 transparent;
}

@media (hover: hover) and (pointer: fine) {
	:where(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button):where(:not(:disabled, [disabled], [aria-disabled="true"], a:not([href]))):hover {
		translate: 0 var(--fp-button-lift, -2px);
		box-shadow: inset 0 0 0 100vmax rgb(0 0 0 / 8%), var(--fp-button-shadow, 0 5px 10px rgb(0 0 0 / 8%));
	}
}

:where(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button):where(:not(:disabled, [disabled], [aria-disabled="true"], a:not([href]))):active {
	translate: 0;
	scale: .98;
}

/* Two decorative masks: only the arrow moves; the tray and label stay fixed.
 * CSS selectors also match the uncached AJAX island's replacement markup.
 * No click handler, speculative request or simulated "download complete" state. */
a.freepresets-download-button[href],
.preset-download-button a[href] {
	position: relative;
	padding-inline-end: 3em;
}

:where(.freepresets-download-button[href], .preset-download-button a[href])::before,
:where(.freepresets-download-button[href], .preset-download-button a[href])::after {
	content: "";
	position: absolute;
	inline-size: 1.2em;
	block-size: 1.2em;
	inset-inline-end: 1em;
	inset-block-start: calc(50% - .6em);
	background: currentColor;
	pointer-events: none;
}

:where(.freepresets-download-button[href], .preset-download-button a[href])::before {
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 16v4h14v-4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

:where(.freepresets-download-button[href], .preset-download-button a[href])::after {
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3v12m-4-4 4 4 4-4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (hover: hover) and (pointer: fine) {
	:where(.freepresets-download-button[href], .preset-download-button a[href]):where(:not([aria-disabled="true"])):hover::after {
		animation: fp-download-tuck 360ms cubic-bezier(.2, .8, .2, 1);
	}
}

:where(.freepresets-download-button[href], .preset-download-button a[href]):where(:not([aria-disabled="true"])):focus-visible::after {
	animation: fp-download-tuck 360ms cubic-bezier(.2, .8, .2, 1);
}

@keyframes fp-download-tuck {
	0%, 100% { translate: 0; opacity: 1; }
	45% { translate: 0 5px; opacity: 0; }
	46% { translate: 0 -5px; opacity: 0; }
}

/* EDD owns loading, errors, checkout navigation and its accessible success
 * message. The native checkout control gets the flood after a real success.
 * Full width keeps Add / Checkout labels from changing the control's width. */
.edd_download_purchase_form .fp-cart-button {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	box-sizing: border-box;
	inline-size: 100%;
}

.edd_download_purchase_form .edd_purchase_submit_wrapper .fp-cart-button {
	padding-inline: 2.75em;
}

.fp-cart-button::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset-block-start: 100%;
	left: 50%;
	inline-size: 210%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: color-mix(in srgb, var(--wp--preset--color--custom-success, #10b981) 60%, #000);
	transform: translate(-50%, -50%) scale(0);
	pointer-events: none;
}

.edd_download_purchase_form .fp-cart-button.fp-cart-confirmed {
	color: #fff;
}

.fp-cart-button.fp-cart-confirmed::before {
	transform: translate(-50%, -50%) scale(1);
	/* EDD reveals Checkout and emits success in the same task. A keyframe
	 * also runs when that control had no previously painted box. */
	animation: fp-cart-flood 320ms cubic-bezier(.45, 0, .2, 1) both;
}

@keyframes fp-cart-flood {
	from { transform: translate(-50%, -50%) scale(0); }
	to { transform: translate(-50%, -50%) scale(1); }
}

.fp-cart-button.fp-cart-confirmed::after {
	content: "";
	position: absolute;
	inset-inline-end: 1em;
	inset-block-start: calc(50% - .6em);
	inline-size: 1.2em;
	block-size: 1.2em;
	background: currentColor;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4.5 4.5L19 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	animation: fp-cart-check 300ms 100ms ease-out both;
	pointer-events: none;
}

@keyframes fp-cart-check {
	from { clip-path: inset(0 100% 0 0); }
	to { clip-path: inset(0); }
}

@media (prefers-reduced-motion: reduce) {
	:where(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button),
	.fp-cart-button::before {
		transition: none;
	}
	:where(.wp-element-button, .wp-block-button__link, .edd-submit.button, .fp-cart-button):is(:hover, :active) {
		translate: none;
		scale: none;
	}
	:where(.freepresets-download-button[href], .preset-download-button a[href]):is(:hover, :focus-visible)::after,
	.fp-cart-button.fp-cart-confirmed::before,
	.fp-cart-button.fp-cart-confirmed::after {
		animation: none;
	}
}

@media (forced-colors: active) {
	:where(.freepresets-download-button[href], .preset-download-button a[href])::before,
	:where(.freepresets-download-button[href], .preset-download-button a[href])::after,
	.fp-cart-button.fp-cart-confirmed::after {
		background: ButtonText;
		forced-color-adjust: none;
	}
	.edd_download_purchase_form .fp-cart-button.fp-cart-confirmed { color: ButtonText; }
	.fp-cart-button::before { display: none; }
}
