/**
 * Gravity Forms — token mapping.
 *
 * Loaded ONLY when Gravity Forms renders a form (see inc/assets.php). Gravity
 * Forms 2.7+ ships a "theme framework" driven by CSS custom properties; we
 * map those to Oogle tokens instead of restyling markup, so GF updates keep
 * working and a child theme changes the look by changing tokens.
 *
 * Reference: https://docs.gravityforms.com/gravity-forms-css-custom-properties/
 *
 * Why the !important on the variables: since GF 3.x the form block prints a
 * per-form <style> keyed to the wrapper ID (#gform_wrapper_N[data-form-index]
 * .gform-theme) that sets the same variables to GF's own defaults (its blue,
 * its grey border, 3px radius). An ID selector beats any class selector, so
 * the token mapping must be marked !important to apply at all. Nothing else
 * in this file uses !important.
 */

.gform_wrapper.gravity-theme,
.gform_wrapper.gform-theme--foundation,
.gform_wrapper.gform-theme--framework {
	--gf-color-primary: var(--wp--preset--color--accent) !important;
	--gf-color-primary-contrast: var(--wp--preset--color--base) !important;
	--gf-color-primary-darker: var(--wp--preset--color--accent-deep) !important;
	--gf-color-primary-lighter: var(--wp--preset--color--accent-tint) !important;
	--gf-color-secondary: var(--wp--preset--color--surface) !important;
	--gf-color-secondary-contrast: var(--wp--preset--color--contrast) !important;
	--gf-color-in-error: #b3261e !important;
	--gf-color-in-error-contrast: var(--wp--preset--color--base) !important;
	--gf-font-size-primary: var(--wp--preset--font-size--medium) !important;
	--gf-font-size-secondary: var(--wp--preset--font-size--small) !important;
	--gf-radius: var(--wp--custom--radius--sm) !important;
	--gf-ctrl-border-color: var(--wp--preset--color--muted) !important;
	--gf-ctrl-border-color-focus: var(--wp--preset--color--primary-deep) !important;
	--gf-ctrl-label-color-primary: var(--wp--preset--color--contrast) !important;
	--gf-ctrl-label-color-secondary: var(--wp--preset--color--muted) !important;
	--gf-ctrl-desc-color: var(--wp--preset--color--muted) !important;
	--gf-ctrl-border-color-focus: var(--wp--preset--color--primary-deep) !important;
	--gf-ctrl-btn-bg-color-primary: var(--wp--preset--color--accent) !important;
	--gf-ctrl-btn-bg-color-hover-primary: var(--wp--preset--color--accent-deep) !important;
	--gf-ctrl-btn-color-primary: var(--wp--preset--color--base) !important;
	--gf-ctrl-btn-radius: var(--wp--custom--radius--sm) !important;
	--gf-ctrl-btn-font-weight: var(--wp--custom--font--weight--semibold) !important;
	--gf-ctrl-btn-size: var(--wp--custom--target--min) !important;
	--gf-ctrl-size: var(--wp--custom--target--min) !important;
	--gf-ctrl-choice-size: 1.25rem !important;
	--gf-form-gap-y: var(--wp--preset--spacing--40) !important;
	--gf-form-gap-x: var(--wp--preset--spacing--40) !important;
	--gf-ctrl-shadow-focus: 0 0 0 2px var(--wp--preset--color--base), 0 0 0 4px var(--wp--preset--color--primary-deep) !important;
}

/* Legacy (pre-framework) rendering: minimal, low-specificity fallbacks. */
.gform_wrapper :where(input:not([type=submit]):not([type=checkbox]):not([type=radio]), select, textarea) {
	inline-size: 100%;
	border: 1px solid var(--wp--preset--color--muted);
	border-radius: var(--wp--custom--radius--sm);
	padding: 0.6em 0.8em;
	font: inherit;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

.gform_wrapper :where(input[type=submit], button[type=submit]) {
	min-block-size: var(--wp--custom--target--min);
	padding: 0.8em 1.4em;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	font: inherit;
	font-weight: var(--wp--custom--font--weight--semibold);
	cursor: pointer;
}

.gform_wrapper .validation_message,
.gform_wrapper .gform_validation_errors {
	color: #b3261e;
}

/* ---- Custom look on top of the GF theme framework --------------------------
   Low specificity; GF's own variables above do most of the work. */

.gform_wrapper.gravity-theme .gform_fields,
.gform_wrapper.gform-theme--framework .gform_fields {
	row-gap: var(--wp--preset--spacing--40);
}

.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label {
	font-size: var(--wp--preset--font-size--small);
	font-weight: var(--wp--custom--font--weight--semibold);
	color: var(--wp--preset--color--contrast);
	margin-block-end: var(--wp--preset--spacing--10);
}

.gform_wrapper .gfield_required {
	color: var(--wp--preset--color--muted);
	font-weight: var(--wp--custom--font--weight--regular);
}

.gform_wrapper .gfield_description {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--muted);
}

.gform_wrapper :where(input:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=button]), select, textarea) {
	border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--base);
	border-radius: var(--wp--custom--radius--sm);
	padding: 0.8em 0.9em;
	font: inherit;
	color: var(--wp--preset--color--contrast);
	transition: border-color var(--wp--custom--transition--fast), box-shadow var(--wp--custom--transition--fast);
}

.gform_wrapper :where(input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary-deep);
	outline-offset: 1px;
	border-color: var(--wp--preset--color--primary-deep);
}

/* GF's framework sets outline: 0 on focused controls at (0,3,1) and relies on
   a border-colour change; a ring is required (2.4.7 / 2.4.11), so restate it
   above that specificity. */
.gform_wrapper .gfield input:not([type=submit]):not([type=checkbox]):not([type=radio]):focus-visible,
.gform_wrapper .gfield select:not([multiple]):not([hidden]):not([disabled]):focus-visible,
.gform_wrapper .gfield textarea:not([hidden]):not([disabled]):not([readonly]):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary-deep);
	outline-offset: 2px;
}

.gform_wrapper textarea {
	min-block-size: 7rem;
}

.gform_wrapper .gform_footer,
.gform_wrapper .gform-footer {
	margin-block-start: var(--wp--preset--spacing--40);
	padding: 0;
}

.gform_wrapper :where(input[type=submit], button[type=submit]) {
	inline-size: 100%;
	min-block-size: var(--wp--custom--target--min);
	padding: 0.9em 1.4em;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	font: inherit;
	font-weight: var(--wp--custom--font--weight--semibold);
	cursor: pointer;
	transition: background-color var(--wp--custom--transition--base);
}

.gform_wrapper :where(input[type=submit], button[type=submit]):hover {
	background: var(--wp--preset--color--accent-deep);
}

/* Validation: color plus text, never color alone. */
.gform_wrapper .gfield_error :where(input, select, textarea) {
	border-color: #b3261e;
}

.gform_wrapper .gform_validation_errors {
	border: 1px solid #b3261e;
	border-radius: var(--wp--custom--radius--sm);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	background: #fbeeed;
}

.gform_wrapper .gform_confirmation_message {
	font-size: var(--wp--preset--font-size--large);
	padding: var(--wp--preset--spacing--40) 0;
}