/* confirm-modal.css — Modal-Footer-Umbruch fuer Confirm-Dialoge. */

/* ──────────────────────────────────────────────────────────────────────
 * Confirm-Modal — Footer-Umbruch
 *
 * Footer erbt display:flex/gap/justify-content aus modal.css. Hier nur die
 * Confirm-Spezifik: Buttons behalten ihre natuerliche Breite (flex:0 0 auto,
 * kein Text-Umbruch IM Button) und der Footer UMBRICHT bei Platznot in eine
 * neue Zeile. Sonst wuerden mehrere Buttons unter ihre Textbreite gequetscht
 * und liefen links aus dem schmalen size-sm-Modal (Clipping bei Mehr-Options-
 * Dialogen wie dem Lead-Disqualifikationsgrund).
 * ────────────────────────────────────────────────────────────────────── */

.app-scope .modal-foot {
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
  justify-content: flex-end;
}
.app-scope .modal-foot button {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Options-Picker (4+ Buttons, z.B. Disqualifikationsgrund): ein rechtsbuendiger
   Umbruch franst bei mehreren verschieden breiten Buttons optisch aus. Ab 4
   Optionen daher als klare vertikale Liste (Action-Sheet-Muster) — jede Option
   volle Breite, die Abbrechen-Option unten. Klasse setzt confirm-modal.js. */
.app-scope .modal-foot.modal-foot--stacked {
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
}
.app-scope .modal-foot.modal-foot--stacked button {
  width: 100%;
  justify-content: center;
}

/* aus components.css extrahiert (.confirm-dlg-*-Klassen
 gehoeren semantisch zum Confirm-Modal). */
.confirm-dlg-body { padding: var(--space-5); }
.confirm-dlg-text { margin: 0; color: var(--color-text); font-size: var(--fs-body); }
.confirm-dlg-footer { justify-content: flex-end; }

/* Prompt-Dialog-Eingabefeld (notifications.js promptDialog) — volle Breite
   der Dialog-Body-Spalte, statt Inline-width am Input. */
.confirm-dlg-body .zeit-input { width: 100%; }