/**
 * Compression Works — Fluent Forms branding.
 *
 * Site-wide override that restyles every Fluent Forms submit button to
 * match the Nova brand button (gradient pill, soft shadow, shimmer-on-
 * hover, trailing arrow). Scoped to `.frm-fluent-form .ff-btn-submit`
 * so it applies to every FF form on the front-end — gated content,
 * contact forms, lead-capture forms, anywhere FF renders a Submit.
 *
 * Specificity is bumped to 0,3,0 (`.fluentform .frm-fluent-form .ff-btn-submit`)
 * so we win over FF's own 0,2,0 button rules without `!important`.
 *
 * The Nova styles are mirrored from cw-elementor-widgets'
 * `cw-hero-homepage.css` (`.cw-hero__btn` + `.cw-hero__btn--nova`). If
 * that source ever changes its visual identity, mirror the change here
 * to keep the brand consistent.
 */

.fluentform .frm-fluent-form .ff-btn-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 2rem;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	border-radius: 999px;
	border: none;
	cursor: pointer;
	box-sizing: border-box;
	width: 100%;
	position: relative;
	overflow: hidden;
	color: #fff;
	background: linear-gradient(
		135deg,
		var(--cw-accent-primary, #dc2626) 0%,
		var(--cw-accent-secondary, #00b7fa) 100%
	);
	box-shadow: 0 10px 25px color-mix(in srgb, var(--cw-accent-primary, #dc2626) 30%, transparent);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

@media (min-width: 640px) {
	.fluentform .frm-fluent-form .ff-btn-submit {
		width: auto;
	}
}

.fluentform .frm-fluent-form .ff-btn-submit:hover,
.fluentform .frm-fluent-form .ff-btn-submit:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 15px 30px color-mix(in srgb, var(--cw-accent-secondary, #00b7fa) 40%, transparent);
	color: #fff;
	outline: none;
}

/* Submitting state — FF adds .disabled / disabled attr while AJAX is in flight. */
.fluentform .frm-fluent-form .ff-btn-submit.disabled,
.fluentform .frm-fluent-form .ff-btn-submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
	transform: none;
	box-shadow: 0 6px 15px color-mix(in srgb, var(--cw-accent-primary, #dc2626) 20%, transparent);
}

/* Shimmer overlay (matches `.cw-hero__btn--nova::after`). Uses `::before`
   so `::after` stays free for the trailing arrow. */
.fluentform .frm-fluent-form .ff-btn-submit::before {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.3), transparent);
	transform: skewX(-20deg);
	transition: left 0.5s ease;
	pointer-events: none;
}

.fluentform .frm-fluent-form .ff-btn-submit:hover::before {
	left: 150%;
}

/* Trailing arrow appended to the visible button label. */
.fluentform .frm-fluent-form .ff-btn-submit::after {
	content: "→";
	display: inline-block;
	margin-left: 0.25rem;
	font-weight: 700;
	transition: transform 0.3s ease;
}

.fluentform .frm-fluent-form .ff-btn-submit:hover::after {
	transform: translateX(3px);
}

/* Reduced motion: kill the shimmer + arrow nudge. */
@media (prefers-reduced-motion: reduce) {
	.fluentform .frm-fluent-form .ff-btn-submit,
	.fluentform .frm-fluent-form .ff-btn-submit::before,
	.fluentform .frm-fluent-form .ff-btn-submit::after {
		transition-duration: 1ms;
	}
}