/* ==========================================================================
   Kontaktformular (Contact Form 7)
   Wrapper-Klassen "formular_feld" / "formular_zeile" kommen aus dem Formular-Markup
   selbst, CF7 ergänzt zusätzlich seine eigenen "wpcf7-*"-Klassen an den Feldern.
   ========================================================================== */

.formular_headline {
	font-family: var(--font-body);
	font-weight: var(--weight-semibold);
	font-size: 18px;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	color: var(--color-surface);
	margin: 0 0 12px;
}

.wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.formular_zeile {
	display: flex;
	gap: 12px;
}

.formular_zeile .formular_feld {
	flex: 1 1 0;
}

.formular_zeile .formular_feld--schmal {
	flex: 0 0 140px;
}

.formular_feld {
	background-color: var(--color-surface);
	border-radius: 0px;
	padding: 12px 16px;
	/* Neutralisiert eine "Phantom-Zeile" durch Whitespace/Text-Knoten direkt im div (z. B.
	   Zeilenumbruch zwischen <div> und <label> im Markup), die sonst mit Divis geerbter
	   16px/1.7em-Body-Schrift eine unsichtbare ~27px hohe Extra-Zeile erzeugt. */
	font-size: 0;
	line-height: 0;
}

.formular_feld label {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	font-family: var(--font-body);
	font-weight: var(--weight-semibold);
	font-size: 18px;
	color: var(--color-primary);
	line-height: 1.3;
}

/* CF7 wickelt jedes Feld in einen eigenen Wrapper-Span — der ist standardmäßig
   "display:inline-block" mit eigener Zeilenhöhe und addiert unbemerkt Extra-Höhe,
   wenn man ihn nicht zurücksetzt. */
.formular_feld .wpcf7-form-control-wrap {
	display: block;
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

/* CF7 reserviert für die Validierungs-Fehlermeldung (.wpcf7-not-valid-tip) auch dann Platz,
   wenn gerade kein Fehler aktiv ist — das erzeugt die überschüssige Leerfläche unten in der Box.
   CF7s eigenes JS blendet den Tip bei einem echten Validierungsfehler selbst wieder ein. */
.formular_feld .wpcf7-not-valid-tip {
	display: none;
	margin-top: 4px;
	font-size: 12px;
}

.formular_feld .wpcf7-form-control {
	font-family: var(--font-body);
	font-size: 18px;
	line-height: 1.2;
	color: #000000;
	background: transparent;
	border: none;
	border-radius: 2px;
	padding: 0;
	margin: 0;
	outline: none;
	box-shadow: none;
	width: 100%;
}

/* Nur bei Text-/E-Mail-/Tel-Feldern die Browser-Chrome entfernen — beim <select>
   appearance NICHT entfernen, sonst verschwindet der Dropdown-Pfeil komplett. */
.formular_feld input.wpcf7-form-control,
.formular_feld textarea.wpcf7-form-control {
	appearance: none;
	-webkit-appearance: none;
}

.formular_feld .wpcf7-textarea {
	min-height: 48px;
	resize: vertical;
}

.wpcf7-acceptance,
.wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}

/* Der Abstand zwischen dem letzten Feld und der Datenschutz-Zeile kam im Kontaktformular (Footer)
   bisher zufällig aus Divis eigenem Standard-Absatzabstand auf dem umschließenden, automatisch
   generierten "<p>" (abhängig vom jeweiligen Divi-Modultyp, der das Formular umgibt — Footer nutzt
   ein "Code"-Modul, andere Platzierungen ggf. ein anderes) und war dadurch nicht überall gleich
   groß (live nachgemessen: Footer 24px, Widerrufsformular auf einer eigenen Seite dagegen nur
   12px, obwohl derselbe "gap" der Formular-Flexbox — vom Nutzer gemeldet). Hier deshalb explizit
   und unabhängig vom umgebenden Divi-Modul gesetzt, damit der Abstand überall wie im
   Kontaktformular aussieht. */
.wpcf7-form p:has(> .wpcf7-form-control-wrap > .wpcf7-acceptance) {
	margin-top: var(--space-3);
}

/* Keine eigene Schrift-/Farbregel mehr hier — der Datenschutz-Text soll überall wie normaler
   Fließtext aussehen (globale "p, span"-Regel in style.css: var(--font-body), var(--weight-light),
   var(--color-text)). Nur im Footer (dunkler Hintergrund) wird das explizit auf Weiß
   zurückgesetzt, siehe "footer.et-l--footer .wpcf7-acceptance .wpcf7-list-item-label" in
   footer.css. */

.wpcf7-submit {
	align-self: flex-start;
	background-color: var(--color-accent);
	color: var(--color-surface);
	font-family: var(--font-body);
	font-size: 18px;
	font-weight: var(--weight-semibold);
	text-transform: uppercase;
	padding: 12px 28px;
	border: none;
	border-radius: 0;
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

.wpcf7-submit:hover {
	background-color: var(--color-accent-hover);
}

/* Für Verlinkungen innerhalb von Formulartext (z. B. Datenschutzerklärung) — übernimmt per
   "inherit" automatisch Farbe/Schrift des umgebenden Texts, damit sie nicht separat gepflegt
   werden müssen und immer synchron bleiben, egal in welchem Textkontext der Link steht. */
.formular_link {
	color: inherit;
	font: inherit;
	text-decoration: underline;
}

/* Auf den Immobilien-Seiten (ImmoMakler-Archiv und -Einzelobjekt) liefert Divi über den Theme-Builder-Stil die
   globale Schrift "Open Sans" (--et_global_body_font) und setzt sie mit ".et-db #et-boc .et-l input" (ID-Selektor)
   auf alle Formularfelder. Das schlug die Regel oben, und weil "Open Sans" dort nicht geladen ist, fiel das
   Kontaktformular im Footer auf eine Serifenschrift zurück. Hier mit demselben Präfix und mehr Klassen
   zurück auf die Seitenschrift gesetzt. */
.et-db #et-boc .et-l .formular_feld .wpcf7-form-control,
.et-db #et-boc .et-l .formular_feld .wpcf7-form-control::placeholder,
.et-db #et-boc .et-l form.wpcf7-form .wpcf7-form-control,
.et-db #et-boc .et-l form.wpcf7-form .wpcf7-form-control::placeholder {
	font-family: var(--font-body);
}