/*
 * Savvy Rest form styling for WPForms (modern markup).
 *
 * Replaces the UAEL "WPForms Styler" widget, which stopped rendering when
 * Ultimate Addons for Elementor was deactivated. Applies to every WPForms form
 * on the site so the Contact, Dealer, Marketing, Swatches, Subscribe, Review
 * and Trade forms all share one look.
 *
 * WPForms prints its defaults as CSS variables on :root; redefining them on
 * the container wins by inheritance. !important is only needed where a Gutenberg
 * form block writes its own variables inline on the container.
 */

.wpforms-container {
	--sr-plum: #9660a2;
	--sr-plum-deep: #754c83;
	--sr-plum-halo: rgba(150, 96, 162, 0.18);
	--sr-slate: #4b4f58;
	--sr-muted: #6b6f78;
	--sr-line: #948d9b;
	--sr-line-hover: #6f6877;
	--sr-error: #b3261e;

	--wpforms-field-border-radius: 10px !important;
	--wpforms-field-border-color: var(--sr-line) !important;
	--wpforms-field-background-color: #fff !important;
	--wpforms-field-text-color: var(--sr-slate) !important;
	--wpforms-label-color: var(--sr-slate) !important;
	--wpforms-label-sublabel-color: var(--sr-muted) !important;
	--wpforms-label-error-color: var(--sr-error) !important;
	--wpforms-field-size-input-height: 48px !important;
	--wpforms-field-size-input-spacing: 22px !important;
	--wpforms-field-size-font-size: 16px !important;
	--wpforms-field-size-padding-h: 16px !important;
	--wpforms-label-size-font-size: 15px !important;
	--wpforms-label-size-sublabel-font-size: 13px !important;
	--wpforms-button-border-radius: 999px !important;
	--wpforms-button-background-color: var(--sr-plum) !important;
	--wpforms-button-border-color: var(--sr-plum) !important;
	--wpforms-button-text-color: #fff !important;
	--wpforms-button-size-font-size: 16px !important;
	--wpforms-button-size-height: 50px !important;
	--wpforms-button-size-padding-h: 36px !important;
	--wpforms-button-size-margin-top: 8px !important;
	--wpforms-page-break-color: var(--sr-plum) !important;

	font-family: 'Cabinet Grotesk', system-ui, sans-serif;
}

div.wpforms-container-full .wpforms-form,
div.wpforms-container-full .wpforms-form label,
div.wpforms-container-full .wpforms-form input,
div.wpforms-container-full .wpforms-form select,
div.wpforms-container-full .wpforms-form textarea,
div.wpforms-container-full .wpforms-form button {
	font-family: inherit;
}

/* Labels */
div.wpforms-container-full .wpforms-form .wpforms-field-label {
	font-weight: 500;
	letter-spacing: 0.005em;
	margin-bottom: 8px;
}

div.wpforms-container-full .wpforms-form .wpforms-field-sublabel {
	margin-top: 6px;
}

div.wpforms-container-full .wpforms-form .wpforms-required-label {
	color: var(--sr-plum);
	font-weight: 500;
}

/* Fields */
div.wpforms-container-full .wpforms-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
div.wpforms-container-full .wpforms-form select,
div.wpforms-container-full .wpforms-form textarea {
	width: 100%;
	max-width: 100%;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

div.wpforms-container-full .wpforms-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):hover,
div.wpforms-container-full .wpforms-form select:hover,
div.wpforms-container-full .wpforms-form textarea:hover {
	border-color: var(--sr-line-hover);
}

div.wpforms-container-full .wpforms-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):focus,
div.wpforms-container-full .wpforms-form select:focus,
div.wpforms-container-full .wpforms-form textarea:focus {
	border-color: var(--sr-plum);
	box-shadow: 0 0 0 4px var(--sr-plum-halo);
	outline: none;
}

div.wpforms-container-full .wpforms-form textarea {
	min-height: 150px;
	padding-top: 12px;
	line-height: 1.5;
	resize: vertical;
}

div.wpforms-container-full .wpforms-form ::placeholder {
	color: #9a9ea6;
	opacity: 1;
}

/* Radios and checkboxes */
div.wpforms-container-full .wpforms-form input[type="radio"],
div.wpforms-container-full .wpforms-form input[type="checkbox"] {
	accent-color: var(--sr-plum);
}

div.wpforms-container-full .wpforms-form fieldset > legend.wpforms-field-label {
	margin-bottom: 12px;
}

div.wpforms-container-full .wpforms-form .wpforms-field-radio li,
div.wpforms-container-full .wpforms-form .wpforms-field-checkbox li {
	margin-bottom: 8px;
}

/* Errors */
div.wpforms-container-full .wpforms-form input.wpforms-error,
div.wpforms-container-full .wpforms-form select.wpforms-error,
div.wpforms-container-full .wpforms-form textarea.wpforms-error {
	border-color: var(--sr-error);
}

div.wpforms-container-full .wpforms-form input.wpforms-error:focus,
div.wpforms-container-full .wpforms-form textarea.wpforms-error:focus {
	box-shadow: 0 0 0 4px rgba(179, 38, 30, 0.14);
}

div.wpforms-container-full .wpforms-form em.wpforms-error,
div.wpforms-container-full .wpforms-form label.wpforms-error {
	font-size: 14px;
	font-style: normal;
	margin-top: 6px;
}

/* Submit */
div.wpforms-container-full .wpforms-form .wpforms-submit-container {
	padding-top: 6px;
}

div.wpforms-container-full .wpforms-form button[type="submit"] {
	font-weight: 500;
	letter-spacing: 0.01em;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

div.wpforms-container-full .wpforms-form button[type="submit"]:hover,
div.wpforms-container-full .wpforms-form button[type="submit"]:active {
	background: var(--sr-plum-deep) !important;
	border-color: var(--sr-plum-deep) !important;
}

div.wpforms-container-full .wpforms-form button[type="submit"]:focus-visible {
	outline: 2px solid var(--sr-plum);
	outline-offset: 3px;
}

div.wpforms-container-full .wpforms-form button[type="submit"]:focus:after {
	display: none;
}

/* Confirmation after a successful send */
div.wpforms-container-full .wpforms-confirmation-container-full,
div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	background: #f6f1f8;
	border: 1px solid #e3d5e8;
	border-radius: 12px;
	color: var(--sr-slate);
	padding: 20px 24px;
}

/* Phones: stack side-by-side fields, full-width button */
@media (max-width: 600px) {
	div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block,
	div.wpforms-container-full .wpforms-form .wpforms-field-row.wpforms-field-medium .wpforms-field-row-block {
		width: 100% !important;
		padding: 0 !important;
	}

	div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block + .wpforms-field-row-block {
		margin-top: 14px;
	}

	div.wpforms-container-full .wpforms-form button[type="submit"] {
		width: 100%;
	}

	/* hCaptcha's iframe is a fixed 303px and gets clipped in narrow cards; scale it to fit. */
	div.wpforms-container-full .wpforms-is-hcaptcha {
		height: 62px;
		margin-bottom: 16px;
	}

	div.wpforms-container-full .wpforms-is-hcaptcha iframe {
		width: 303px !important;
		max-width: none !important;
		transform: scale(0.8);
		transform-origin: 0 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	div.wpforms-container-full .wpforms-form * {
		transition: none !important;
	}
}
