/* ============================================================
   confirm.css · styles for window.confirmAction (confirm.js).
   Reuses the shipped .scrim/.sheet; adds the button row + a danger button.
   Token-bound (supply.tokens.css) — no new colour/radius minted.
   ============================================================ */
/* ⛔ STACKING — load-bearing, do not remove.
   The confirm is an alertdialog that GATES a destructive action, so it must sit
   above every surface that can invoke it. It reuses the generic `.scrim`
   (z-index:80), but `.drawer` is z-index:81 — so a confirm opened from inside an
   open drawer (cancel RFQ, accept/reject an offer, cancel a listing…) rendered
   BEHIND the drawer and was invisible: the user had to close the drawer to find
   it, i.e. the destructive gate silently vanished. Scoped to the confirm's own id
   so every other `.scrim` user is untouched. Below the skip-link (99). */
#confirmscrim { z-index: 95; }

.confirmsheet { max-width: 380px; }
.confirmsheet h3 { margin: 0 0 .35rem; font-size: var(--fs-lg); font-weight: var(--fw-bold); }
.confirmsheet .sub { margin: 0 0 var(--s4); color: var(--muted); font-size: var(--fs-sm); line-height: 1.5; }
.confirmbtns { display: flex; gap: .5rem; justify-content: flex-end; }
.confirmbtns .btn { min-width: 96px; }
/* danger button — destructive confirm (red), still AA on white text */
.btn.danger { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn.danger:hover { filter: brightness(.95); }
@media (max-width: 480px) {
  .confirmbtns { flex-direction: column-reverse; }
  .confirmbtns .btn { width: 100%; }
}