/* =======================================================================
   Formular-Baukasten-Erweiterung ([form slug="..."]) - eigenstaendiges
   Basis-CSS, wird unabhaengig vom aktiven Theme automatisch geladen
   (siehe Nexis\Template\ExtensionAssets).
   ======================================================================= */

.nx-form-builder { max-width: 520px; margin: var(--nx-space-6) 0; display: flex; flex-direction: column; gap: var(--nx-space-4); }
.nx-form-builder-field { display: flex; flex-direction: column; gap: var(--nx-space-1); }
.nx-form-builder-field label { font-weight: 600; color: var(--nx-text); font-size: var(--nx-fs-sm); }
.nx-form-builder-required { color: var(--nx-danger, #d92d20); }
.nx-form-builder-field input,
.nx-form-builder-field textarea {
  padding: 0.6em 0.8em;
  border: 1px solid var(--nx-border, #d0d5dd);
  border-radius: var(--nx-radius);
  font: inherit;
  color: var(--nx-text);
  background: var(--nx-surface);
}
.nx-form-builder-field input:focus,
.nx-form-builder-field textarea:focus { outline: 2px solid var(--nx-primary); outline-offset: 1px; }
.nx-form-builder-submit { align-self: flex-start; }
.nx-form-builder-message { padding: var(--nx-space-3) var(--nx-space-4); border-radius: var(--nx-radius); font-size: var(--nx-fs-sm); }
.nx-form-builder-message--ok { background: color-mix(in srgb, var(--nx-success, #12b76a) 12%, white); color: var(--nx-success, #067647); }
.nx-form-builder-message--error { background: color-mix(in srgb, var(--nx-danger, #d92d20) 10%, white); color: var(--nx-danger, #d92d20); }