/**
 * Gravity Forms — client overrides.
 *
 * Base chrome lives in the parent theme. Rules below are Anfrage-specific or
 * brand tweaks that should not wait for a parent release.
 *
 * GF prints --gf-* on #gform_wrapper_N with high specificity; parent then maps
 * button radius from --gf-radius (field radius). So inputs + submit are restyled
 * here on the actual properties, not only via tokens.
 */

/* —— Site-wide: inputs match design (16px, white, 18% ink border) —— */

.gform_wrapper :where(
	input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="image"]),
	textarea,
	select
) {
	height: auto;
	min-height: 0;
	padding: 14px 18px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 18%, transparent);
	border-radius: 16px;
	background-color: #ffffff;
	box-shadow: none;
	font-size: 15px;
	line-height: 1.25;
	color: var(--wp--preset--color--contrast);
}

.gform_wrapper textarea {
	line-height: 1.55;
	min-height: 8.5rem;
}

/* Parent uses --gf-radius for the button too — force the pill. */
.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"],
.gform_wrapper input[type="button"].gform_button,
.gform_wrapper .gform-theme-button {
	height: auto;
	min-height: 0;
	padding: 16px 34px;
	border: none;
	border-radius: var(--wp--custom--radius--full);
	font-size: 15px;
	font-weight: var(--wp--custom--font-weight--semibold);
	letter-spacing: 0.02em;
	box-shadow: none;
}

/* —— Anfrage form: two-column fields, disclaimer next to submit —— */

.manufakt-anfrage .gform_fields {
	row-gap: 20px;
	column-gap: 20px;
}

/* Design has no “required” markers — the copy already makes that clear. */
.manufakt-anfrage .gfield_required,
.manufakt-anfrage .gform_required_legend {
	display: none;
}

.manufakt-anfrage .gform_wrapper .gfield_label,
.manufakt-anfrage .gform_wrapper .gform-field-label {
	display: inline;
	font-size: var(--wp--custom--font-size--caption);
	font-weight: var(--wp--custom--font-weight--semibold);
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--primary-dark);
}

/* “Firma (optional)” — description sits in the label row, muted. */
.manufakt-anfrage .gform_wrapper .gfield_description {
	display: inline;
	margin: 0 0 0 0.35em;
	font-size: inherit;
	font-weight: var(--wp--custom--font-weight--medium);
	color: var(--wp--preset--color--secondary);
}

.manufakt-anfrage .gform_wrapper .gfield_label + .gfield_description + .ginput_container,
.manufakt-anfrage .gform_wrapper .gfield_label + .ginput_container {
	display: block;
	margin-block-start: 8px;
}

.manufakt-anfrage .gform_footer,
.manufakt-anfrage .gform_page_footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	margin-block-start: 28px;
}

.manufakt-anfrage__note {
	font-size: var(--wp--custom--font-size--caption);
	line-height: 1.4;
	color: var(--wp--preset--color--secondary);
}

/* Auto-width — parent defaults stretch the button full-bleed. */
.manufakt-anfrage .gform_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: auto;
}

.manufakt-anfrage .gform_button::after {
	content: "→";
	font-size: 17px;
	line-height: 1;
}

/* —— Kontakt form (sand band) —— */

.manufakt-kontakt__form-band .gform_fields {
	row-gap: 20px;
	column-gap: 20px;
}

/* Design: 24px between interest pills block and the field grid. */
.manufakt-kontakt__form-band .gfield--type-checkbox {
	margin-block-end: 4px;
}

.manufakt-kontakt__form-band .gfield_required,
.manufakt-kontakt__form-band .gform_required_legend {
	display: none;
}

/*
 * Design: label→input gap = 8px.
 * Parent sets --wp--custom--form--label-gap to spacing-3 (12px) on .gfield_label.
 * Match the Anfrage pattern: inline label (kills vertical margin) + 8px before input.
 */
.manufakt-kontakt__form-band .gform_wrapper {
	--wp--custom--form--label-gap: 8px;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield_label,
.manufakt-kontakt__form-band .gform_wrapper .gform-field-label:not(.gform-field-label--type-inline) {
	display: inline !important;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--primary-dark) !important;
	line-height: 1.25 !important;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield_description {
	display: inline !important;
	margin: 0 0 0 0.35em !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: var(--wp--preset--color--secondary) !important;
	line-height: 1.25 !important;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield_label + .ginput_container,
.manufakt-kontakt__form-band .gform_wrapper .gfield_label + .gfield_description + .ginput_container {
	display: block;
	margin-block-start: 8px !important;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield:not(.gfield--has-description):not(.gfield--type-checkbox) > .ginput_container {
	margin-block-start: 8px !important;
}

/* Description lives after the input in the DOM — pull it up beside the label.
 * Must come after the + .ginput_container rule so margin stays 0 (gap handles it). */
.manufakt-kontakt__form-band .gform_wrapper .gfield--has-description:not(.gfield--type-checkbox) {
	display: grid !important;
	grid-template-columns: auto 1fr;
	column-gap: 0.35em;
	row-gap: 8px;
	align-items: baseline;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield--has-description:not(.gfield--type-checkbox) > .gfield_label {
	grid-column: 1;
	grid-row: 1;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield--has-description:not(.gfield--type-checkbox) > .gfield_description {
	grid-column: 2;
	grid-row: 1;
	margin: 0 !important;
}

.manufakt-kontakt__form-band .gform_wrapper .gfield--has-description:not(.gfield--type-checkbox) > .ginput_container {
	grid-column: 1 / -1;
	grid-row: 2;
	margin: 0 !important;
}

/* Design uses 22% ink border on this page. */
.manufakt-kontakt__form-band .gform_wrapper :where(
	input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="image"]),
	textarea,
	select
) {
	border-color: color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
}

/*
 * Interesse-an pills — hide the native checkbox, paint the label.
 * Structure: .gchoice > input + label
 */
.manufakt-kontakt__form-band .gfield--type-checkbox .ginput_container_checkbox {
	margin-block-start: 12px;
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gfield_checkbox {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice {
	margin: 0;
	padding: 0;
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice label {
	display: inline-flex;
	align-items: center;
	padding: 10px 20px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
	border-radius: var(--wp--custom--radius--full);
	background: transparent;
	font-size: 14px;
	font-weight: var(--wp--custom--font-weight--semibold);
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	transition: background-color 0.4s var(--wp--custom--motion--ease-brand, ease),
		color 0.4s var(--wp--custom--motion--ease-brand, ease),
		border-color 0.4s var(--wp--custom--motion--ease-brand, ease);
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice input:checked + label,
.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice input:checked ~ label {
	background: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.manufakt-kontakt__form-band .gfield--type-checkbox .gchoice input:focus-visible + label {
	outline: 2px solid var(--wp--preset--color--contrast);
	outline-offset: 2px;
}

.manufakt-kontakt__form-band .gform_footer,
.manufakt-kontakt__form-band .gform_page_footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	margin-block-start: 24px;
}

.manufakt-kontakt__note {
	font-size: var(--wp--custom--font-size--caption);
	line-height: 1.4;
	color: var(--wp--preset--color--secondary);
}

.manufakt-kontakt__form-band .gform_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: auto;
}

.manufakt-kontakt__form-band .gform_button::after {
	content: "→";
	font-size: 17px;
	line-height: 1;
}