/* ============================================================
   Oh Darling - Formulare (WordPress-Ergänzung, Paket U3)
   Wird nur auf Seiten mit Formular geladen. Das Kernel-CSS
   (style.css) bleibt unverändert; hier stehen nur die Bausteine
   des Versands: Fehlerbanner, Serverfehler am Feld, Sende-Zustand.
   Nur Kernel-Tokens, keine festen Radien oder Schriftgrößen.
   ============================================================ */

/* Fehlerbanner: weißer Grund, Rahmen 1 px --error, Radius Karte,
   Innenabstand 14px 16px, Icon links (20 px), Text --fs-body-sm Navy. */
.form-banner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: var(--gap-sm);
  padding: 14px 16px;
  background: var(--surface-card);
  border: 1px solid var(--error);
  border-radius: var(--radius-card);
  color: var(--navy);
}
.form-banner[hidden] { display: none; }
.form-banner-icon {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  color: var(--error);
}
.form-banner-text { min-width: 0; }
.form-banner-text p {
  margin: 0;
  font-size: var(--fs-body-sm);
  line-height: var(--lh-body);
  color: var(--navy);
}
.form-banner-text p[hidden] { display: none; }
.form-banner-text p + p { margin-top: 6px; }
.form-banner a {
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--navy-35);
}

/* Fehler des Servers an einem Feld: ist am Feld ein bestimmter Fehlercode gesetzt
   (`data-server-error`), zeigt nur der passende Text (`.is-server-error`), nicht die
   über :has() gesteuerten Texte des Kernels. Gibt es nur einen Fehlertext, zeigt ihn
   die Kernel-Regel `.has-error .field-error`. */
.form-field[data-server-error] .field-error[data-error-typ] { display: none !important; }
.form-field[data-server-error] .field-error[data-error-typ].is-server-error { display: block !important; }

/* Senden läuft */
form[data-od-formular][aria-busy="true"] .btn[type="submit"] {
  cursor: progress;
  opacity: .72;
}
form[data-od-formular][hidden] { display: none; }

/* Honeypot-Zeile: sicherheitshalber aus dem Layout, falls .visually-hidden einmal fehlt */
form[data-od-formular] .visually-hidden input[name="website"] { pointer-events: none; }