/* ════════════════════════════════════════════════════════════════════════
   DS Confirm primitive (DS sub-step 2b)
   Tight modal variant for binary confirmations. Built on top of Modal:
   reuses .ds-modal-overlay frame + dsModal controller (focus trap, scroll
   lock, Esc per backdrop policy, return-focus-on-close). Consumes
   tokens.css. Pairs with ds-confirm.js.

   API: ds.confirm({title, message, destructive, confirmLabel, cancelLabel})
        → Promise<boolean>

   Backdrop policy:
     destructive: false → backdrop="dismiss"  (Esc + overlay-click resolve(false))
     destructive: true  → backdrop="static"   (only buttons close, Esc no-op)

   Auto-focus:
     destructive: false → Confirm (Enter-to-confirm convention)
     destructive: true  → Cancel  (safer, Enter won't accidentally destruct)

   Single instance, sequential FIFO queue if called while another open.
   ════════════════════════════════════════════════════════════════════════ */

/* Tight confirm dialog — smaller than ds-modal--sm (380px → 360px max) */
.ds-confirm {
  max-width: 360px;
}

.ds-confirm .ds-modal-body {
  padding: var(--sp-5) var(--sp-6) var(--sp-4);
}

.ds-confirm-title {
  font-size: var(--text-md);
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 var(--sp-2);
  line-height: 1.3;
}

.ds-confirm-message {
  font-size: var(--text-base);
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  white-space: pre-wrap;        /* preserve consumer-passed \n for multi-line */
}

/* Prompt-mode field (ds.prompt): input or select shown under the message */
.ds-confirm-field {
  margin-top: var(--sp-3);
}

.ds-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--sp-2);
  padding: var(--sp-3) var(--sp-6) var(--sp-5);
}

/* Hide the standard ds-modal close (X) — confirm primitive uses only Cancel/Confirm buttons */
.ds-confirm-overlay .ds-modal-close { display: none; }

/* Mobile sheet OPT-OUT: ds-modal.css turns every ds-modal into a full-screen
   sheet at <=767px, but a two-button confirm/prompt must stay a compact
   centered dialog ("Archive this lead?" as a full page would be absurd).
   Re-assert the desktop geometry; dsKbSync still pins the overlay to the
   visual viewport, so a ds.prompt input stays visible above the keyboard.
   Destructive mode is backdrop="static" (buttons are the only exit), so the
   dialog itself must always fit: 85dvh tracks the dynamic viewport. */
@media (max-width: 767px) {
  .ds-confirm-overlay { padding: 16px; align-items: center; }
  .ds-confirm-overlay .ds-modal {
    width: auto;
    min-width: 280px;
    max-width: 360px !important;
    height: auto;
    max-height: 85vh;                 /* pre-dvh WebKit fallback */
    max-height: min(85dvh, 100%);     /* 100% = the (keyboard-pinned) overlay box, so the buttons always fit above the keyboard */
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
  }
}