/**
 * Gravity Forms (orbital theme) in the site colours, for every form on the site
 * (kontakt: Form 1 in the media-text block; blog newsletter: Form 4 in single.php).
 * Oracle: universal.css overrides of the --gf-* variables for #gform_wrapper_1…4,
 * hidden "(Required)" markers, full-width wrapper. Tokens only.
 * Enqueued by functions.php when Gravity Forms is active.
 */

.gform_wrapper,
.gform_wrapper form,
.gform-body,
.gform_fields {
	width: 100% !important;
	max-width: none !important;
}

.gform-theme--framework * {
	--gf-ctrl-label-color-primary: var(--lvl-color-text) !important;
	--gf-ctrl-label-color-secondary: var(--lvl-color-text) !important;
}

.gform_wrapper.gform-theme {
	--gf-color-primary: var(--lvl-color-text) !important;
	--gf-ctrl-label-color-primary: var(--lvl-color-text) !important;
	--gf-ctrl-desc-color: var(--lvl-color-text) !important;
	--gf-ctrl-label-color-tertiary: var(--lvl-color-text) !important;
	--gf-ctrl-btn-bg-color-hover-primary: var(--lvl-color-text) !important;
	--gf-ctrl-btn-color-primary: var(--lvl-color-bg) !important;
	--gf-ctrl-btn-radius: var(--lvl-radius-btn) !important;
	--gf-ctrl-btn-text-transform: uppercase !important;
	--gf-ctrl-btn-letter-spacing: var(--lvl-ls-label) !important;
	--gf-ctrl-btn-font-size: var(--lvl-fs-body) !important;
	--gf-ctrl-btn-border-color-primary: var(--lvl-color-violet) !important;
	--gf-ctrl-btn-shadow-hover: var(--lvl-shadow-glow) !important;
	--gf-form-validation-color: var(--lvl-color-orange) !important;
	--gf-form-validation-border-color: var(--lvl-color-orange) !important;
	--gf-form-validation-border-color-focus: var(--lvl-color-orange) !important;
	--gf-ctrl-desc-color-error: var(--lvl-color-pink) !important;
}

.gfield_required,
.gform_required_legend {
	display: none !important;
}

/* ---------- Blog newsletter (single.php, Form 4; same card in the acf/lvl-signup block) ----------
 * The oracle shows this form unstyled; reference = live levels.dev (2026-10-02), where
 * the wrapper carries the card look of the plugin levels-feedback-form (.lvl-theme):
 * white card 760px max, padding 48/56/40 (32/24 below 600px), radius 12px, inputs on
 * a light fill, consent text 16px, description 14px/1.5 italic in a 16px box, dark pill
 * button (30px radius: the site --gf-ctrl-btn-radius wins over .lvl-theme on live). Live hard-codes the colours, so the --lvl-color-form-* tokens are the same in
 * both schemes. Local GF renders the consent
 * description without the inner .gfield_consent_description_text box, so the box
 * styles sit on the description. */
:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper.gform-theme {
	box-sizing: border-box;
	max-width: 47.5rem !important;
	margin-inline: auto;
	padding: 3rem 3.5rem 2.5rem;
	border-radius: 0.75rem;
	background: var(--lvl-color-form-card);
	color: var(--lvl-color-form-text);
	--gf-ctrl-label-color-primary: var(--lvl-color-form-text) !important;
	--gf-ctrl-label-color-secondary: var(--lvl-color-form-text) !important;
	--gf-ctrl-desc-color: var(--lvl-color-form-muted) !important;
	--gf-color-primary: var(--lvl-color-brand-orange) !important;
}

:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper .gform_heading {
	margin-bottom: 2rem !important;
}

:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper input[type="email"] {
	padding: 0.875rem 1rem !important;
	border: 1.5px solid var(--lvl-color-form-border) !important;
	border-radius: 0.625rem !important;
	background: var(--lvl-color-form-field) !important;
	color: var(--lvl-color-form-text) !important;
	font-size: 1rem !important;
	box-shadow: none !important;
}

/* Live (GF 3.1) shows the framework default placeholder (colour from the GF variable,
   14px); local GF 2.10 inherits the input colour and size, so both are set here. */
:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper input[type="email"]::placeholder {
	color: var(--gf-ctrl-placeholder-color);
	font-size: 0.875rem;
	opacity: 1;
}

:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper .gfield_consent_label {
	margin-bottom: 0.4rem !important;
	color: var(--lvl-color-form-text) !important;
	font-size: 1rem !important;
	line-height: 1.43 !important;
}

:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper .gfield_consent_description {
	margin: 0 0 0.5rem !important;
	color: var(--lvl-color-form-muted) !important;
	font-size: 0.875rem !important;
	font-style: italic;
	line-height: 1.5 !important;
}

:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper .gform_button {
	border: 0 !important;
	/* Not --lvl-radius-btn: levels-feedback-form redefines that name as 8px on .lvl-theme.
	   Any radius above half the 38px height draws the same pill as live's 30px. */
	border-radius: var(--lvl-radius-pill) !important;
	background: var(--lvl-color-form-text) !important;
	color: var(--lvl-color-form-on-button) !important;
	box-shadow: none !important;
}

@media (max-width: 600px) {
	:is(.lvl-article__newsletter, .lvl-signup__form) .gform_wrapper.gform-theme {
		padding: 2rem 1.5rem;
	}
}
