/* SC Gravity Forms: Orbital theme pointed at the design-system variables, so every
   site gets its own colours, type and sizes, and forms follow invert contexts.
   !important beats the per-form variables GF prints inline (ID specificity). */
.gform-theme--orbital {
	/* Palette: Orbital derives most component colours from these */
	--gf-color-primary: var(--brand) !important;
	--gf-color-primary-darker: var(--brand-hover) !important;
	--gf-color-primary-lighter: var(--tint) !important;
	--gf-color-primary-contrast: var(--on-brand) !important;
	--gf-color-secondary: var(--surface) !important;
	--gf-color-secondary-darker: var(--tint) !important;
	--gf-color-secondary-lighter: var(--surface) !important;
	--gf-color-secondary-contrast: var(--text-color) !important;
	--gf-color-out-ctrl-dark: var(--text-color) !important;
	--gf-color-out-ctrl-dark-darker: var(--text-color) !important;
	--gf-color-out-ctrl-dark-lighter: var(--muted-text) !important;
	--gf-color-out-ctrl-light: var(--field-border) !important;
	--gf-color-out-ctrl-light-darker: var(--field-border) !important;
	--gf-color-out-ctrl-light-lighter: var(--tint) !important;
	--gf-color-in-ctrl: var(--surface) !important;
	--gf-color-in-ctrl-contrast: var(--text-color) !important;
	--gf-color-in-ctrl-dark: var(--text-color) !important;
	--gf-color-in-ctrl-dark-darker: var(--text-color) !important;
	--gf-color-in-ctrl-dark-lighter: var(--muted-text) !important;
	--gf-color-in-ctrl-light: var(--field-border) !important;
	--gf-color-in-ctrl-light-darker: var(--field-border) !important;
	--gf-color-in-ctrl-light-lighter: var(--tint) !important;
	--gf-color-in-ctrl-primary: var(--brand) !important;
	--gf-color-in-ctrl-primary-darker: var(--brand-hover) !important;
	--gf-color-in-ctrl-primary-lighter: var(--tint) !important;
	--gf-color-in-ctrl-primary-contrast: var(--on-brand) !important;
	--gf-color-danger: var(--error) !important;
	--gf-color-success: var(--success) !important;

	/* Colours GF prints inline per form instead of deriving from the palette */
	--gf-ctrl-border-color: var(--field-border) !important;
	--gf-ctrl-label-color-primary: var(--text-color) !important;
	--gf-ctrl-label-color-secondary: var(--text-color) !important;
	--gf-ctrl-btn-border-color-secondary: var(--brand) !important;
	--gf-ctrl-btn-bg-color-hover-tertiary: var(--tint) !important;

	/* Type */
	--gf-font-family-base: var(--body) !important;
	--gf-font-size-primary: var(--body-default) !important;
	--gf-font-size-secondary: calc(var(--body-default) - 0.125rem) !important;
	--gf-font-size-tertiary: var(--body-s-size) !important;
	--gf-line-height-primary: var(--body-line-height) !important;
	--gf-line-height-secondary: var(--body-line-height) !important;
	--gf-line-height-tertiary: var(--body-line-height) !important;

	/* Shape: GF caps textareas at 8px, so the small radius is the one every control can share */
	--gf-radius: var(--radius-s) !important;
	--gf-ctrl-border-width: var(--border-m) !important;
	--gf-form-validation-radius: var(--radius-s) !important;
	--gf-form-validation-border-width: var(--border-m) !important;
	--gf-form-validation-shadow: none !important;

	/* Controls */
	--gf-ctrl-size: auto !important;
	--gf-ctrl-padding-x: var(--button-input-padding-horizontal) !important;
	--gf-ctrl-padding-y: var(--button-input-padding-vertical) !important;
	--gf-ctrl-textarea-padding-y: var(--button-input-padding-vertical) !important;
	--gf-ctrl-line-height: var(--body-line-height) !important;
	--gf-ctrl-textarea-line-height: var(--body-line-height) !important;
	--gf-ctrl-shadow: none !important;
	--gf-ctrl-transition: 0ms !important;
	--gf-ctrl-placeholder-color: var(--muted-text) !important;

	/* Focus ring: the site-wide keyboard ring */
	--gf-ctrl-outline-width-focus: var(--focus-outline) !important;
	--gf-ctrl-outline-color-focus: var(--focus-ring, var(--brand)) !important;
	--gf-ctrl-outline-offset: var(--focus-outline-gap) !important;

	/* Buttons */
	--gf-ctrl-btn-size: auto !important;
	--gf-ctrl-btn-padding-x: var(--button-input-padding-horizontal) !important;
	--gf-ctrl-btn-padding-y: var(--button-input-padding-vertical) !important;
	--gf-ctrl-btn-font-size: var(--body-default) !important;
	--gf-ctrl-btn-line-height: var(--body-line-height) !important;
	--gf-ctrl-btn-shadow: var(--shadow-rest, none) !important;
	--gf-ctrl-btn-radius: var(--radius-m) !important;
	--gf-ctrl-btn-border-width-primary: var(--border-m) !important;
	--gf-ctrl-btn-border-width-secondary: var(--border-m) !important;
	--gf-ctrl-btn-color-secondary: var(--ghost-text, var(--brand-text, var(--brand))) !important; /* Back + Save and continue later = site Ghost button */

	/* Spacing */
	--gf-label-space-primary: var(--spacing-s) !important;
	--gf-form-gap-x: var(--spacing-m) !important;
	--gf-form-gap-y: calc(var(--spacing-m) * 1.75) !important; /* room between questions, sub-labels and errors */
	--gf-form-footer-margin-y-start: var(--spacing-m) !important;

	/* Colours GF builds from its own -rgb values, which can't read our variables */
	--gf-form-validation-bg-color: var(--error-wash) !important;
	--gf-form-validation-border-color: var(--error) !important;
	--gf-form-validation-outline-color-focus: var(--error) !important;
	--gf-form-validation-color: var(--error-text) !important;
	--gf-form-spinner-bg-color-secondary: var(--tint) !important;
	--gf-ctrl-color-disabled: var(--muted-text) !important;
	--gf-ctrl-choice-check-color-disabled: var(--muted-text) !important;
	--gf-ctrl-btn-color-tertiary: var(--text-color) !important; /* "Choose file" button */
	--gf-ctrl-btn-color-simple: var(--muted-text) !important; /* upload cancel/remove icons */
	--gf-ctrl-btn-icon-color-simple: var(--text-color) !important;
	--gf-ctrl-file-zone-color: var(--text-color) !important;
}

/* No "* indicates required fields" line; the asterisks speak for themselves */
.gform-theme--orbital .gform_required_legend {
	display: none;
}

/* Number fields: no spinner arrows (GF's icon + the native one) */
.gform-theme--orbital input[type="number"] {
	--gf-icon-ctrl-number: none;
	--gf-ctrl-number-spin-btn-width: 0;
	appearance: textfield;
}

/* File upload: the "Choose file" button fills the control height (GF sizes it from
   --gf-ctrl-size, which is auto here) and shares the control's text size */
.gform-theme--orbital input[type="file"] {
	--gf-ctrl-file-btn-font-size: var(--gf-ctrl-font-size);
	--gf-ctrl-file-btn-size: calc(var(--gf-ctrl-line-height) + 2 * var(--gf-ctrl-padding-y));
	padding-block: 0;
	line-height: var(--gf-ctrl-file-btn-size);
}

/* GP Word Count: the counter sits inside the field, as in the Gravity Wiz demo. The
   container takes over the textarea's border, radius, background and focus ring (GF's
   own --gf-ctrl-* knobs), so textarea + counter read as one control and the ring wraps
   both; the counter is a secondary-size muted line behind a top rule */
.gform-theme--orbital .ginput_container_textarea:has(> .gp-word-count-label) {
	--gf-local-bg-color: var(--gf-ctrl-bg-color);
	--gf-local-border-color: var(--gf-ctrl-border-color);
	--gf-local-outline-color: var(--gf-ctrl-outline-color);
	--gf-local-outline-width: var(--gf-ctrl-outline-width);
	border: var(--gf-ctrl-border-width) var(--gf-ctrl-border-style) var(--gf-local-border-color);
	border-radius: var(--gf-ctrl-textarea-radius);
	background-color: var(--gf-local-bg-color);
	outline: var(--gf-local-outline-width) var(--gf-ctrl-outline-style) var(--gf-local-outline-color);
	outline-offset: var(--gf-ctrl-outline-offset);
}
.gform-theme--orbital .ginput_container_textarea:has(> .gp-word-count-label):focus-within {
	--gf-local-border-color: var(--gf-ctrl-border-color-focus);
	--gf-local-outline-color: var(--gf-ctrl-outline-color-focus);
	--gf-local-outline-width: var(--gf-ctrl-outline-width-focus);
}
.gform-theme--orbital .gfield_error .ginput_container_textarea:has(> .gp-word-count-label) {
	--gf-local-bg-color: var(--gf-ctrl-bg-color-error);
	--gf-local-border-color: var(--gf-ctrl-border-color-error);
}
.gform-theme--orbital .ginput_container_textarea:has(> .gp-word-count-label) > textarea {
	border: 0;
	border-radius: 0;
	background-color: transparent;
	outline: none;
}
.gform-theme--orbital .ginput_container_textarea > .gp-word-count-label {
	margin: 0;
	padding: calc(var(--gf-ctrl-textarea-padding-y) / 2) var(--gf-ctrl-padding-x);
	border-block-start: var(--gf-ctrl-border-width) var(--gf-ctrl-border-style) var(--gf-ctrl-border-color);
	font-size: var(--gf-font-size-secondary);
	line-height: var(--gf-line-height-secondary);
	color: var(--muted-text);
}
/* Limit states the perk flags (it keeps its own bold) in the site's status colours */
.gform-theme--orbital .gp-word-count-label .gwwc-max-exceeded {
	color: var(--error-text, var(--error));
}
.gform-theme--orbital .gp-word-count-label .gwwc-min-reached {
	color: var(--success-text, var(--success));
}

/* Validation summary: GF numbers the items itself, so no list bullets, and the
   error links keep a plain underline instead of the body-link highlight bar */
.gform-theme--orbital .gform_validation_errors li {
	list-style: none !important;
}
.gform-theme--orbital .gform_validation_error_link {
	background-image: none !important;
}

/* Back and "Save and continue later" sit flat, as the site's Ghost button */
.gform-theme--orbital .gform-theme-button--secondary {
	--gf-ctrl-btn-shadow: none;
}

/* Button lift on hover, as site buttons */
.gform-theme--orbital .gform-theme-button:is(:hover, :focus-visible) {
	transform: translate3d(0, -2px, 0);
}

/* Confirmation message (GF leaves it unstyled) */
.gform_confirmation_message {
	padding: var(--button-input-padding-vertical) var(--button-input-padding-horizontal);
	border: var(--border-m) solid var(--success);
	border-radius: var(--radius-m);
	color: var(--success-text);
	background-color: var(--success-wash);
}

/* Inline submit: GF zeroes every field's min-inline-size, so a quarter-width
   submit cell shrinks under its button in narrow columns (footers, 768-960px)
   and the button clips. Let the cell grow to the button instead. */
.gform-theme--foundation .gfield--type-submit {
	min-inline-size: max-content;
}

/* Centred form contents: opt in with "sc-centred" in the form's CSS Class Name
   setting (GF adds "sc-centred_wrapper" to the wrapper) */
.sc-centred_wrapper {
	text-align: center;
}
.sc-centred_wrapper :is(input, textarea, select) {
	text-align: center;
}
.sc-centred_wrapper :is(.gfield_label, .gchoice, .ginput_container_date, .gform_footer, .gform_page_footer) {
	justify-content: center;
}
.sc-centred_wrapper legend.gfield_label {
	width: 100%;
}
/* Inline submit button when GF stacks the row on phones: field-to-button gap
   = the side-by-side column gap, not the row gap between questions */
@media (max-width: 640px) {
	.gform-theme--foundation .gfield--type-submit:not(.gfield--width-full) {
		margin-block-start: calc(var(--gf-form-gap-x) - var(--gf-form-gap-y));
	}
	.sc-centred_wrapper .gfield--type-submit {
		justify-content: center;
	}
}

/* Links in labels, descriptions and confirmations (e.g. the privacy link):
   same highlight bar as body text links in the site CSS */
.gform_wrapper :is(label, .gfield_description, .gform_confirmation_message) a:not(.no-link-decoration, .no-link-decoration *) {
	--link-bar: var(--link-highlight);
	color: inherit;
	background-image: linear-gradient(var(--link-bar), var(--link-bar));
	background-repeat: no-repeat;
	background-size: 100% 0.35rem;
	background-position: 0 calc(100% - 0.1rem);
	transition: background-size var(--transitions) ease-in-out, background-position var(--transitions) ease-in-out;
}
.gform_wrapper :is(label, .gfield_description, .gform_confirmation_message) a:not(.no-link-decoration, .no-link-decoration *):hover {
	background-size: 100% 100%;
	background-position: 0 100%;
}