/**
 * Contact Form 7: Precisis-Styling für alle CF7-Formulare (`.wpcf7-form`).
 *
 * Standard: weiße Labels/Beschriftung (Seitenhintergrund); helle Eingabefelder mit dunklem Text.
 *
 * Dunkle Oberfläche (weiße Typo, Glas-Inputs): Zusätzliche CSS-Klasse auf dem Formular:
 *   precisis-wpcf7--on-dark
 * Der Modal-Shortcode setzt diese Klasse automatisch per `html_class`.
 */

/* --- Gemeinsame Typo: Labels ~20 px --------------------------------------- */

.wpcf7-form label,
.wpcf7-form .wpcf7-list-item-label,
.wpcf7-form legend {
	font-size: 1.25rem; /* ~20 px */
	line-height: 1.4;
	font-weight: 300;
}

/* Checkbox & Radio: größere Klickfläche, Brand-Akzent */
.wpcf7-form input[type='checkbox'],
.wpcf7-form input[type='radio'] {
	width: 1.375rem;
	height: 1.375rem;
	min-width: 1.375rem;
	min-height: 1.375rem;
	margin: 0;
	margin-inline-end: var(--wp--preset--spacing--30, 0.75rem);
	vertical-align: top;
	accent-color: var(--wp--preset--color--primary, #95bc5f);
	cursor: pointer;
	flex-shrink: 0;
}
.wpcf7-form input[type='checkbox']{
	margin-top: 4px;
}

.wpcf7-form .wpcf7-list-item {
	display: flex;
	align-items: flex-start;
	gap: 0;
}

.wpcf7-form .wpcf7-list-item label {
	display: inline-flex;
	align-items: flex-start;
	gap: 0;
	cursor: pointer;
}

/* 10 px Abstand Label → Eingabefeld (typische CF7-Struktur in <p>) */
.wpcf7-form p > label:first-child ~ .wpcf7-form-control-wrap {
	margin-block-start: 10px;
}

.wpcf7-form p > label .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-block-start: 10px;
}

.wpcf7-form fieldset > legend {
	margin-block-end: 10px;
}

/* --- Standard (ohne precisis-wpcf7--on-dark): weiße Typo auf blauem Seitenhintergrund ----- */

.wpcf7-form:not(.precisis-wpcf7--on-dark),
.wpcf7-form:not(.precisis-wpcf7--on-dark) .wpcf7-form,
.wpcf7-form:not(.precisis-wpcf7--on-dark) label,
.wpcf7-form:not(.precisis-wpcf7--on-dark) .wpcf7-list-item-label,
.wpcf7-form:not(.precisis-wpcf7--on-dark) legend {
	color: var(--wp--preset--color--base, #fff);
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) .wpcf7-spinner {
	opacity: 0.9;
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) .wpcf7-response-output {
	color: var(--wp--preset--color--main, #1f3b4c);
	border-color: var(--wp--preset--color--border-dark, #5c7a8a);
	background-color: rgba(255, 255, 255, 0.85);
	padding: var(--wp--preset--spacing--30, 0.75rem);
	border-radius: 0.375rem;
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='text'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='email'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='url'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='tel'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='number'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='search'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='date'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='time'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) input[type='password'],
.wpcf7-form:not(.precisis-wpcf7--on-dark) select {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background-color: rgb(255 255 255 / 72%);
	border-radius: 0;
	border: 0;
	border-bottom: 2px solid var(--wp--preset--color--border-dark, #5c7a8a);
	box-shadow: none;
	outline: none;
	padding: var(--wp--preset--spacing--40, 1.25rem) var(--wp--preset--spacing--50, 1.5rem)
		var(--wp--preset--spacing--30, 0.75rem) var(--wp--preset--spacing--50, 1.5rem);
	color: var(--wp--preset--color--main, #1f3b4c);
	caret-color: var(--wp--preset--color--main, #1f3b4c);
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background-color: rgb(255 255 255 / 72%);
	border-radius: 0;
	border: 0;
	border-bottom: 2px solid var(--wp--preset--color--border-dark, #5c7a8a);
	box-shadow: none;
	outline: none;
	min-block-size: 6rem;
	padding: var(--wp--preset--spacing--40, 1.25rem) var(--wp--preset--spacing--50, 1.5rem);
	vertical-align: top;
	color: var(--wp--preset--color--main, #1f3b4c);
	caret-color: var(--wp--preset--color--main, #1f3b4c);
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) input:is(:focus, :focus-visible),
.wpcf7-form:not(.precisis-wpcf7--on-dark) select:is(:focus, :focus-visible),
.wpcf7-form:not(.precisis-wpcf7--on-dark) textarea:is(:focus, :focus-visible) {
	border-bottom-color: var(--wp--preset--color--main, #1f3b4c);
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) input::placeholder,
.wpcf7-form:not(.precisis-wpcf7--on-dark) textarea::placeholder {
	color: rgb(31 59 76 / 55%);
	opacity: 1;
}

.wpcf7-form:not(.precisis-wpcf7--on-dark) select option {
	color: inherit;
	background-color: var(--wp--preset--color--base, #fff);
}

/* Submit: immer Marken-Pill (hell + dunkel) */
.wpcf7-form .wpcf7-submit,
.wpcf7-form input[type='submit'] {
	width: auto;
	margin-top: var(--wp--preset--spacing--40, 1.25rem);
	cursor: pointer;
	background-color: var(--wp--preset--color--primary, #95bc5f);
	color: var(--wp--preset--color--primary-alt-accent, #1f3b4c);
	border: none;
	border-radius: 100px;
	padding: 0.625rem 1.875rem;
	font-weight: 500;
	font-size: inherit;
	line-height: 1.35;
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
	box-shadow: none;
}

.wpcf7-form .wpcf7-submit:hover,
.wpcf7-form .wpcf7-submit:focus-visible,
.wpcf7-form input[type='submit']:hover,
.wpcf7-form input[type='submit']:focus-visible {
	background-color: var(--wp--preset--color--primary-alt, #b1d500);
	color: var(--wp--preset--color--primary-alt-accent, #1f3b4c);
}

/* --- Dunkel („precisis-wpcf7--on-dark“): wie Overlay / Header-Suche -------- */

.wpcf7-form.precisis-wpcf7--on-dark label,
.wpcf7-form.precisis-wpcf7--on-dark .wpcf7-form,
.wpcf7-form.precisis-wpcf7--on-dark .wpcf7-list-item-label,
.wpcf7-form.precisis-wpcf7--on-dark legend {
	color: var(--wp--preset--color--base, #fff);
}

.wpcf7-form.precisis-wpcf7--on-dark .wpcf7-spinner {
	opacity: 0.85;
}

.wpcf7-form.precisis-wpcf7--on-dark .wpcf7-response-output {
	color: rgba(255, 255, 255, 0.95);
	border-color: rgba(255, 255, 255, 0.5);
	background-color: rgba(0, 0, 0, 0.2);
	padding: var(--wp--preset--spacing--30, 0.75rem);
	border-radius: 0.375rem;
}

.wpcf7-form.precisis-wpcf7--on-dark input[type='text'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='email'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='url'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='tel'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='number'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='search'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='date'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='time'],
.wpcf7-form.precisis-wpcf7--on-dark input[type='password'],
.wpcf7-form.precisis-wpcf7--on-dark select {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(7.5px);
	-webkit-backdrop-filter: blur(7.5px);
	border-radius: 0;
	border: 0;
	border-bottom: 2px solid rgba(255, 255, 255, 0.9);
	box-shadow: none;
	outline: none;
	padding: var(--wp--preset--spacing--40, 1.25rem) var(--wp--preset--spacing--50, 1.5rem)
		var(--wp--preset--spacing--30, 0.75rem) var(--wp--preset--spacing--50, 1.5rem);
	color: var(--wp--preset--color--base, #fff);
	caret-color: var(--wp--preset--color--base, #fff);
}

.wpcf7-form.precisis-wpcf7--on-dark textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(7.5px);
	-webkit-backdrop-filter: blur(7.5px);
	border-radius: 0;
	border: 0;
	border-bottom: 2px solid rgba(255, 255, 255, 0.9);
	box-shadow: none;
	outline: none;
	min-block-size: 6rem;
	padding: var(--wp--preset--spacing--40, 1.25rem) var(--wp--preset--spacing--50, 1.5rem);
	vertical-align: top;
	color: var(--wp--preset--color--base, #fff);
	caret-color: var(--wp--preset--color--base, #fff);
}

.wpcf7-form.precisis-wpcf7--on-dark input:is(:focus, :focus-visible),
.wpcf7-form.precisis-wpcf7--on-dark select:is(:focus, :focus-visible),
.wpcf7-form.precisis-wpcf7--on-dark textarea:is(:focus, :focus-visible) {
	background: rgba(255, 255, 255, 0.5);
	color: var(--wp--preset--color--base, #fff);
	border-bottom-color: rgba(255, 255, 255, 0.95);
	box-shadow: none;
	outline: none;
}

.wpcf7-form.precisis-wpcf7--on-dark input::placeholder,
.wpcf7-form.precisis-wpcf7--on-dark textarea::placeholder {
	color: rgba(255, 255, 255, 0.75);
	opacity: 1;
}

.wpcf7-form.precisis-wpcf7--on-dark select {
	color-scheme: dark;
	cursor: pointer;
}

.wpcf7-form.precisis-wpcf7--on-dark select option {
	color: var(--wp--preset--color--foreground, #1f2933);
	background-color: var(--wp--preset--color--base, #fff);
}

.wpcf7-form textarea{
	height: 100px;
}