/*
 * Contact Form 7 im Smartartist-Design.
 *
 * Bewusst über die theme.json-Variablen gebaut: damit folgen die Formulare
 * automatisch der Style-Variation der jeweiligen Künstlerseite, statt Farben
 * ein zweites Mal festzuschreiben.
 *
 * Wird nur geladen, wenn CF7 auf der Seite auch wirklich ein Formular ausgibt.
 */

.wpcf7-form {
	--sa-feld-rahmen: var(--wp--preset--color--light-3, #ddd);
	--sa-feld-grund: var(--wp--preset--color--white, #fff);
	--sa-feld-text: var(--wp--preset--color--dark-1, #101213);
	--sa-fehler: #b32d2e;

	box-sizing: border-box;
	margin-block: var(--wp--preset--spacing--40, 1.5rem);
	/* Eingabefelder über die volle Breite eines Hero-Abschnitts sind unbrauchbar
	   weit — die Zeilenlänge begrenzen wir wie beim Fließtext. */
	max-inline-size: 34rem;
	text-align: left;
}

.wpcf7-form p {
	margin-block: 0 var(--wp--preset--spacing--30, 1rem);
}

/* Beschriftungen erben die Textfarbe des Umfelds — wichtig, weil Formulare
   auch in abgedunkelten Cover-Abschnitten stehen. */
.wpcf7-form label {
	display: block;
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.5;
}

.wpcf7-form label br {
	display: none;
}

.wpcf7-form-control-wrap {
	display: block;
	margin-top: 0.4em;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="date"],
.wpcf7-form input[type="number"],
.wpcf7-form select,
.wpcf7-form textarea {
	/* Ohne border-box ragen Felder um Innenabstand und Rahmen aus dem Container. */
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: 100%;
	padding: 0.75em 0.9em;
	border: 1px solid var(--sa-feld-rahmen);
	border-radius: 0;
	background: var(--sa-feld-grund);
	color: var(--sa-feld-text);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium, 1rem);
	line-height: 1.4;
	transition: border-color 0.15s ease-in-out;
}

.wpcf7-form textarea {
	min-block-size: 8em;
	resize: vertical;
}

.wpcf7-form :is(input, select, textarea):focus-visible {
	border-color: var(--wp--preset--color--primary, #000);
	outline: 2px solid var(--wp--preset--color--primary, #000);
	outline-offset: 1px;
}

/* Der Absendeknopf übernimmt das Aussehen der Theme-Buttons, damit im Layout
   nicht zwei verschiedene Knopfsprachen nebeneinander stehen. */
.wpcf7-form input[type="submit"] {
	padding: 0.9em 2em;
	border: 0;
	border-radius: 0;
	background: var(--wp--preset--color--primary, #000);
	color: var(--wp--preset--color--white, #fff);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.15s ease-in-out;
}

.wpcf7-form input[type="submit"]:hover,
.wpcf7-form input[type="submit"]:focus-visible {
	background: var(--wp--preset--color--accent, #333);
}

/* Rückmeldungen */
.wpcf7-not-valid {
	border-color: var(--sa-fehler) !important;
}

.wpcf7-not-valid-tip {
	margin-top: 0.35em;
	color: var(--sa-fehler);
	font-size: var(--wp--preset--font-size--small, 0.875rem);
}

.wpcf7-response-output {
	margin: var(--wp--preset--spacing--30, 1rem) 0 0;
	padding: 0.75em 1em;
	border: 1px solid currentColor;
	font-size: var(--wp--preset--font-size--small, 0.875rem);
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
	color: var(--sa-fehler);
}

.wpcf7-spinner {
	margin-inline-start: 0.75em;
}

/* Honeypot-Felder dürfen nie sichtbar werden. */
.wpcf7-form .hidden-fields-container,
.wpcf7-form input[type="hidden"] {
	display: none;
}