/* @overa/ui-kit 0.20.0 · EL DIÁLOGO DE LA SUITE (js/dialog.js, U8; SUITE-CONSOLAS.md §7 «Diálogo»). Con los tokens de
   Atlas (`--color-*`) y, donde la app no los tiene, los de app.css o un valor por defecto: se ve igual en todas. Va por
   encima de la barra y del menú de la suite (`--capa-modal`). */
.ov-dlg-backdrop {
  position: fixed; inset: 0; z-index: var(--capa-modal, 1200);
  display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(16, 24, 40, .45);
}
.ov-dlg {
  --dl-bg: var(--color-surface, var(--bg2, #ffffff));
  --dl-ink: var(--color-text, var(--tx, #1f1f1f));
  --dl-ink2: var(--color-text-secondary, var(--dim, #474747));
  --dl-border: var(--color-border, var(--bd, #e0e0e0));
  --dl-sunken: var(--color-surface-sunken, var(--bg, #f5f5f5));
  --dl-primary: var(--color-primary, var(--a, #4a8bd4));
  --dl-danger: var(--color-danger, var(--danger, #c0392b));
  --dl-r: var(--radius-lg, 10px);
  width: min(520px, 100%); max-height: calc(100vh - 32px); overflow: auto; box-sizing: border-box;
  padding: 20px 20px 16px; border-radius: var(--dl-r); border: 1px solid var(--dl-border);
  background: var(--dl-bg); color: var(--dl-ink); box-shadow: 0 18px 50px rgba(16, 24, 40, .25);
  font-size: 14px; line-height: 1.5;
}
.ov-dlg-title { margin: 0 0 10px; font-size: 17px; font-weight: 700; line-height: 1.35; }
.ov-dlg-body p { margin: 0 0 8px; color: var(--dl-ink2); overflow-wrap: anywhere; }
.ov-dlg-code {
  margin: 0 0 10px; padding: 10px 12px; max-height: 220px; overflow: auto; border-radius: 6px;
  background: #0f1218; color: #d7dde8; font: 12.5px/1.45 var(--ov-font-mono, ui-monospace, Consolas, monospace);
  white-space: pre-wrap; word-break: break-word;
}
.ov-dlg-label { display: block; margin: 10px 0 4px; font-size: 12.5px; font-weight: 600; color: var(--dl-ink2); }
.ov-dlg-reason {
  display: block; width: 100%; box-sizing: border-box; min-height: 72px; padding: 8px 10px; resize: vertical;
  border: 1px solid var(--dl-border); border-radius: 6px; background: var(--dl-sunken); color: var(--dl-ink); font: inherit;
}
.ov-dlg-reason:focus { outline: none; border-color: var(--dl-primary); background: var(--dl-bg); box-shadow: 0 0 0 3px rgba(74, 139, 212, .25); }
.ov-dlg-reason[aria-invalid="true"] { border-color: var(--dl-danger); }
.ov-dlg-error { margin: 6px 0 0; color: var(--dl-danger); font-size: 12.5px; font-weight: 600; }
.ov-dlg-error[hidden] { display: none; }
/* Cancelar a la izquierda, la acción a la derecha */
.ov-dlg-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 16px; }
.ov-dlg-btn {
  height: 36px; padding: 0 16px; border-radius: 6px; border: 1px solid var(--dl-border);
  background: var(--dl-bg); color: var(--dl-ink); font: inherit; font-weight: 600; cursor: pointer;
}
.ov-dlg-btn:hover { filter: brightness(.97); }
.ov-dlg-ok { background: var(--dl-primary); border-color: var(--dl-primary); color: #fff; }
.ov-dlg-ok-danger { background: var(--dl-bg); border-color: var(--dl-danger); color: var(--dl-danger); }
@media (max-width: 420px) { .ov-dlg-actions { flex-direction: column-reverse; } .ov-dlg-btn { width: 100%; } }
