/* Webcraft Forms – Frontend */
.wcf-form {
	width:100%;
	--wcf-radius:8px;
	--wcf-btn-bg:#2271b1;
	--wcf-btn-fg:#ffffff;
}
.wcf-row { display:flex; flex-wrap:wrap; gap:8px; align-items:flex-start; }
.wcf-field { margin:0 0 22px; box-sizing:border-box; flex:0 1 calc(100% - 6px); min-width:0; }
.wcf-w-full { flex-basis:calc(100% - 6px); max-width:calc(100% - 6px); }
.wcf-w-threequarter { flex-basis:calc(75% - 6px); max-width:calc(75% - 6px); }
.wcf-w-twothird { flex-basis:calc(66.667% - 6px); max-width:calc(66.667% - 6px); }
.wcf-w-half { flex-basis:calc(50% - 6px); max-width:calc(50% - 6px); }
.wcf-w-third { flex-basis:calc(33.333% - 6px); max-width:calc(33.333% - 6px); }
.wcf-w-quarter { flex-basis:calc(25% - 6px); max-width:calc(25% - 6px); }

/* Geräte-Breiten (WYSIWYG mit dem Editor-Umschalter).
   Vererbung durch Kaskade: Ein Feld ohne Override behält die Desktop-Breite.
   Die Tablet-Regeln greifen ab ≤1024px (also auch auf dem Smartphone) – dadurch
   erbt das Smartphone die Tablet-Breite, sofern es keinen eigenen Override hat.
   Die Smartphone-Regeln stehen danach und ≤767px und gewinnen per Quellreihenfolge. */
@media (max-width:1024px) {
	.wcf-field.wcf-w-t-full { flex-basis:calc(100% - 6px); max-width:calc(100% - 6px); }
	.wcf-field.wcf-w-t-threequarter { flex-basis:calc(75% - 6px); max-width:calc(75% - 6px); }
	.wcf-field.wcf-w-t-twothird { flex-basis:calc(66.667% - 6px); max-width:calc(66.667% - 6px); }
	.wcf-field.wcf-w-t-half { flex-basis:calc(50% - 6px); max-width:calc(50% - 6px); }
	.wcf-field.wcf-w-t-third { flex-basis:calc(33.333% - 6px); max-width:calc(33.333% - 6px); }
	.wcf-field.wcf-w-t-quarter { flex-basis:calc(25% - 6px); max-width:calc(25% - 6px); }
}
@media (max-width:767px) {
	.wcf-field.wcf-w-m-full { flex-basis:calc(100% - 6px); max-width:calc(100% - 6px); }
	.wcf-field.wcf-w-m-threequarter { flex-basis:calc(75% - 6px); max-width:calc(75% - 6px); }
	.wcf-field.wcf-w-m-twothird { flex-basis:calc(66.667% - 6px); max-width:calc(66.667% - 6px); }
	.wcf-field.wcf-w-m-half { flex-basis:calc(50% - 6px); max-width:calc(50% - 6px); }
	.wcf-field.wcf-w-m-third { flex-basis:calc(33.333% - 6px); max-width:calc(33.333% - 6px); }
	.wcf-field.wcf-w-m-quarter { flex-basis:calc(25% - 6px); max-width:calc(25% - 6px); }
}
.wcf-field > label { display:block; font-weight:600; margin-bottom:6px; }
.wcf-field input[type="text"],
.wcf-field input[type="email"],
.wcf-field input[type="tel"],
.wcf-field input[type="url"],
.wcf-field input[type="number"],
.wcf-field input[type="date"],
.wcf-field input[type="time"],
.wcf-field textarea,
.wcf-field select {
	width:100%; min-width:0; font:inherit; box-sizing:border-box;
}
.wcf-form:not(.wcf-theme) .wcf-field input[type="text"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="email"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="tel"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="url"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="number"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="date"],
.wcf-form:not(.wcf-theme) .wcf-field input[type="time"],
.wcf-form:not(.wcf-theme) .wcf-field textarea,
.wcf-form:not(.wcf-theme) .wcf-field select {
	padding:10px 12px; border:1px solid #c7ccd4; border-radius:var(--wcf-radius); background:#fff;
}
.wcf-field input[type="file"] { width:100%; box-sizing:border-box; font:inherit; }
.wcf-file-hint { display:block; margin-top:5px; font-size:.85em; color:#646970; }
.wcf-field textarea { min-height:150px; resize:vertical; }
.wcf-form:not(.wcf-theme) .wcf-field input:focus,
.wcf-form:not(.wcf-theme) .wcf-field textarea:focus,
.wcf-form:not(.wcf-theme) .wcf-field select:focus {
	outline:none; border-color:#2271b1; box-shadow:0 0 0 2px rgba(34,113,177,.18);
}
.wcf-checkbox { display:flex; align-items:flex-start; gap:8px; font-weight:400; }
/* Zustimmungstext normal statt fett – nur die Schriftstaerke, kein Layout. */
.wcf-field > label.wcf-checkbox { font-weight:400; }
.wcf-req { color:#d63638; }

/* Radiobuttons / Mehrfachauswahl */
.wcf-choice { border:0; padding:0; margin:0; }
.wcf-choice legend { display:block; font-weight:600; margin-bottom:6px; padding:0; }
.wcf-choice-opt { display:flex; align-items:center; gap:8px; font-weight:400; margin-bottom:6px; }
.wcf-choice-opt input { width:auto; }

/* Überschrift / Sektionstrenner */
.wcf-field-heading { margin-top:8px; margin-bottom:20px; }
.wcf-row:first-child .wcf-field-heading { margin-top:0; }
.wcf-heading { margin:0; line-height:1.3; }
.wcf-divider { margin:12px 0 0; border:0; border-top:1px solid #d9dde3; }

/* Name mehrteilig */
.wcf-name { border:0; padding:0; margin:0; min-width:0; }
.wcf-name legend { display:block; font-weight:600; margin-bottom:6px; padding:0; }
.wcf-name-parts { display:flex; flex-wrap:wrap; gap:10px; }
.wcf-name-part { flex:1 1 160px; min-width:0; display:flex; flex-direction:column; }
.wcf-name-part.wcf-name-salutation { flex:0 1 130px; }
.wcf-name-part label { font-size:.85em; font-weight:400; color:#646970; margin-bottom:4px; }

.wcf-submit-wrap { flex:0 0 100%; }
.wcf-submit {
	background:var(--wcf-btn-bg); color:var(--wcf-btn-fg); border:0; border-radius:var(--wcf-radius);
	padding:12px 22px; font:inherit; font-weight:600; cursor:pointer;
}
.wcf-submit:hover { filter:brightness(.92); }

/* Theme-Styling übernehmen: im Theme-Modus gibt das Plugin für Eingabefelder
   keine Optik vor (die Rahmen-/Padding-/Hintergrund-Regeln oben greifen nur bei
   :not(.wcf-theme)) – das aktive Theme bzw. der Browser-Standard stylt sie.
   Struktur (Breite/box-sizing) und Button-Farbe/-Radius bleiben aktiv. */

.wcf-success {
	background:#edfaef; border:1px solid #b7e4c0; color:#14672a;
	padding:14px 16px; border-radius:8px; margin-bottom:18px;
}

/* Verstecktes Feld: nie sichtbar, belegt auch keinen Platz in der Zeile.
   Die bedingte Anzeige setzt style="display:none" bzw. entfernt es wieder –
   dann greift diese Regel und das Feld bleibt unsichtbar. */
.wcf-field-hidden { display:none; margin:0; }

/* Freitext (reine Anzeige, kein Eingabefeld) */
.wcf-freitext { line-height:1.5; margin:2px 0 4px; }
/* Verlinkter Textabschnitt in Checkbox-Zustimmung und Freitext */
.wcf-checkbox a, .wcf-freitext a { text-decoration:underline; }

/* Formatierter Inhalt in Freitext / Checkbox-Zustimmung */
.wcf-freitext p { margin:0 0 10px; }
.wcf-freitext p:last-child { margin-bottom:0; }
.wcf-freitext ul, .wcf-freitext ol { margin:0 0 10px 1.4em; }
.wcf-checkbox strong { font-weight:700; }

/* Validierung: Fehlermeldungen pro Feld */
.wcf-form-errors {
	background:#fcf0f1; border:1px solid #d63638; color:#8a1f21;
	padding:10px 14px; border-radius:var(--wcf-radius, 8px); margin:0 0 16px;
}
.wcf-error { display:block; color:#d63638; font-size:.9em; margin-top:5px; }
.wcf-field.has-error input,
.wcf-field.has-error textarea,
.wcf-field.has-error select {
	border-color:#d63638;
}
.wcf-field.has-error input:focus,
.wcf-field.has-error textarea:focus,
.wcf-field.has-error select:focus {
	outline:none; box-shadow:0 0 0 1px #d63638;
}
.wcf-field.has-error > label,
.wcf-field.has-error legend { color:#d63638; }

/* ALTCHA-Status (lokales Proof-of-Work) */
.wcf-altcha { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid #d5d7db; border-radius:var(--wcf-radius); background:#f6f7f8; max-width:340px; }
.wcf-altcha-status { font-size:13px; color:#646970; }
.wcf-altcha.is-solved { border-color:#a5d6b7; background:#f0f9f3; }
.wcf-altcha.is-solved .wcf-altcha-status { color:#1a7f37; }

/* Wiederholbare Feldgruppe */
.wcf-group { border:1px solid #c7ccd4; border-radius:var(--wcf-radius); padding:14px 16px 12px; margin:0; }
.wcf-group legend { font-weight:600; padding:0 6px; }
.wcf-group-item { border:1px solid #e0e4e9; border-radius:var(--wcf-radius); background:#fafbfc; padding:16px 16px 8px; margin:0 0 14px; }
.wcf-form.wcf-theme .wcf-group-item { background:transparent; }
.wcf-group-item-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 8px; }
.wcf-group-item-title { font-weight:600; }
.wcf-group-remove { background:none; border:0; color:#d63638; font-size:18px; line-height:1; padding:2px 6px; cursor:pointer; }
.wcf-group-remove:hover { color:#8a1f21; }
.wcf-group-sub { margin:0 0 16px; }
.wcf-group-sub > label { display:block; font-weight:600; margin-bottom:6px; }
.wcf-group-sub textarea { min-height:110px; }
.wcf-group-add {
	display:inline-block; background:none; border:1px dashed #8c8f94; color:#2271b1;
	border-radius:var(--wcf-radius); padding:8px 14px; font:inherit; cursor:pointer;
}
.wcf-group-add:hover { border-color:#2271b1; background:#f0f6fb; }
/* Fehler: nur die betroffenen Unterfelder rot, nicht die ganze Gruppe. */
.wcf-form:not(.wcf-theme) .wcf-field-group.has-error input,
.wcf-form:not(.wcf-theme) .wcf-field-group.has-error textarea,
.wcf-form:not(.wcf-theme) .wcf-field-group.has-error select { border-color:#c7ccd4; }
.wcf-form .wcf-field-group .wcf-group-sub.has-error input,
.wcf-form .wcf-field-group .wcf-group-sub.has-error textarea,
.wcf-form .wcf-field-group .wcf-group-sub.has-error select { border-color:#d63638; }
.wcf-form .wcf-field-group .wcf-group-sub.has-error > label { color:#d63638; }