/* ---------------------------------------------------------------------------
   WE MANAGE — dialogs.

   Matches the console: dark surface, gold accent, the same radius and shadow
   tokens as every panel. Sits above the page but below the cursor layer —
   the pointer has to stay visible over a modal, not vanish behind it.
--------------------------------------------------------------------------- */

.wm-dialog-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483000;               /* above the page, below the cursor */
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(3, 3, 3, 0.72);
  backdrop-filter: blur(6px);
  opacity: 0;
  transition: opacity 0.18s ease;
}

.wm-dialog-overlay.is-open { opacity: 1; }
.wm-dialog-overlay[hidden] { display: none; }

.wm-dialog {
  width: min(420px, 100%);
  padding: 24px 26px 20px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(201, 155, 66, 0.10), transparent 46%),
    linear-gradient(180deg, #131210, #0b0a09);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
  transform: translateY(8px) scale(0.98);
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.wm-dialog-overlay.is-open .wm-dialog { transform: translateY(0) scale(1); }

.wm-dialog-eyebrow {
  margin: 0 0 8px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--gold2, #d6b36a);
}

.wm-dialog.is-danger .wm-dialog-eyebrow { color: #ff8f8f; }

.wm-dialog-title {
  margin: 0 0 10px;
  font-family: "Playfair Display", serif;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
  color: #fff;
}

.wm-dialog-body {
  margin: 0 0 20px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.6);
}

.wm-dialog-actions {
  display: flex;
  gap: 9px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.wm-dialog-btn {
  padding: 10px 18px;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.wm-dialog-cancel {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: transparent;
  color: rgba(255, 255, 255, 0.62);
}
.wm-dialog-cancel:hover { border-color: rgba(255, 255, 255, 0.3); color: #fff; }
.wm-dialog-cancel[hidden] { display: none; }

.wm-dialog-ok {
  border: 1px solid rgba(201, 155, 66, 0.5);
  background: rgba(201, 155, 66, 0.16);
  color: var(--gold2, #d6b36a);
}
.wm-dialog-ok:hover { background: rgba(201, 155, 66, 0.28); border-color: rgba(201, 155, 66, 0.8); }

.wm-dialog.is-danger .wm-dialog-ok {
  border-color: rgba(255, 100, 100, 0.5);
  background: rgba(255, 100, 100, 0.14);
  color: #ff8f8f;
}
.wm-dialog.is-danger .wm-dialog-ok:hover {
  background: rgba(255, 100, 100, 0.24);
  border-color: rgba(255, 100, 100, 0.8);
}

/* Keyboard users must be able to see what is focused. */
.wm-dialog-btn:focus-visible {
  outline: 2px solid var(--gold2, #d6b36a);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .wm-dialog-overlay,
  .wm-dialog { transition: none; }
  .wm-dialog { transform: none; }
}

@media (max-width: 480px) {
  .wm-dialog { padding: 20px; }
  .wm-dialog-actions { flex-direction: column-reverse; }
  .wm-dialog-btn { width: 100%; }
}
