/* Account deletion confirmation. Everything is scoped to .account-delete.
 * Light: the app theme tokens, with the same values as fallbacks.
 * Dark: body.tg-dark (Telegram) or body.vk-dark (VK) set by the host; the dark
 * palette is spelled out here, so it does not depend on the host stylesheet.
 * data-theme="light|dark" on the form root overrides both. */
.account-delete {
  --ad-bg: var(--bg, #FBF9F6);
  --ad-card: var(--card, #F2ECE4);
  --ad-ink: var(--ink, #2B2A28);
  --ad-muted: var(--muted, #6E655C);
  --ad-line: var(--line, #E2D9CE);
  --ad-accent: var(--terra, #8A6F5C);
  --ad-danger: #A6462B;
  --ad-danger-deep: #8C3A24;
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 36rem;
  min-width: 0;
  margin: 0 auto;
  padding: 18px;
  background: var(--ad-card);
  color: var(--ad-ink);
  border: 1px solid var(--ad-line);
  border-radius: var(--r-md, 16px);
  font: inherit;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
body.tg-dark .account-delete,
body.vk-dark .account-delete,
body .account-delete[data-theme="dark"] {
  --ad-bg: #1C1B18; --ad-card: #2A2924; --ad-ink: #F0EDE8; --ad-muted: #9E9487; --ad-line: #3A3830;
  --ad-accent: #8A6F5C; --ad-danger: #E7A08A; --ad-danger-deep: #D98B70; color-scheme: dark;
}
/* After the dark rule on purpose: an explicit light theme wins over the host dark class. */
body .account-delete[data-theme="light"] {
  --ad-bg: #FBF9F6; --ad-card: #F2ECE4; --ad-ink: #2B2A28; --ad-muted: #6E655C; --ad-line: #E2D9CE;
  --ad-accent: #8A6F5C; --ad-danger: #A6462B; --ad-danger-deep: #8C3A24; color-scheme: light;
}

.account-delete section { display: flex; flex-direction: column; gap: 12px; margin: 0; min-width: 0; }
.account-delete p { margin: 0; }
.account-delete .account-delete-title { margin: 0; font-size: 18px; line-height: 1.3; font-weight: 700; }
.account-delete .account-delete-lead { font-size: 16px; }
.account-delete .account-delete-note { font-size: 13px; color: var(--ad-muted); }

.account-delete .btn {
  display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 48px;
  margin: 0; padding: 13px 22px; font: inherit; font-size: 16px; font-weight: 600; border-radius: 999px; cursor: pointer;
}
.account-delete .btn:focus-visible { outline: 2px solid var(--ad-ink); outline-offset: 2px; }
.account-delete .btn:disabled { opacity: .55; cursor: not-allowed; }
.account-delete .account-delete-open,
.account-delete .account-delete-recover { color: var(--ad-ink); background: var(--ad-bg); border: 1.5px solid var(--ad-line); }
.account-delete .account-delete-open:hover,
.account-delete .account-delete-recover:hover { border-color: var(--ad-ink); }

.account-delete .account-delete-confirm {
  box-sizing: border-box; min-width: 0; padding: 14px; border: 1.5px solid var(--ad-danger); border-radius: var(--r-sm, 12px);
  background: var(--ad-bg);
}
.account-delete .account-delete-question { margin: 0 0 12px; font-weight: 600; }
.account-delete .account-delete-question:focus-visible { outline: 2px solid var(--ad-ink); outline-offset: 4px; }
.account-delete .account-delete-actions { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.account-delete .account-delete-actions .btn { flex: 1 1 10rem; width: auto; min-width: 0; }
.account-delete .account-delete-cancel { color: var(--ad-ink); background: var(--ad-card); border: 1.5px solid var(--ad-line); }
.account-delete .account-delete-confirm-button { color: #fff; background: var(--ad-danger); border: 1.5px solid var(--ad-danger); }
.account-delete .account-delete-confirm-button:hover { background: var(--ad-danger-deep); border-color: var(--ad-danger-deep); }
body.tg-dark .account-delete .account-delete-confirm-button,
body.vk-dark .account-delete .account-delete-confirm-button,
body .account-delete[data-theme="dark"] .account-delete-confirm-button { color: #1C1B18; }
body .account-delete[data-theme="light"] .account-delete-confirm-button { color: #fff; }

.account-delete .account-delete-status { font-size: 14px; color: var(--ad-ink); }
.account-delete .account-delete-result { font-size: 16px; font-weight: 600; color: var(--ad-ink); }
.account-delete .account-delete-result:focus-visible { outline: 2px solid var(--ad-ink); outline-offset: 4px; }
.account-delete .account-delete-result[data-outcome="deleted"] { color: var(--ad-ink); }
.account-delete .account-delete-result[data-outcome="refused"],
.account-delete .account-delete-result[data-outcome="unknown"],
.account-delete .account-delete-result[data-outcome="unauthenticated"] { color: var(--ad-danger); }
.account-delete [hidden] { display: none; }
.account-delete[aria-busy="true"] .account-delete-confirm-button { cursor: progress; }