/* Leemen legal pages (privacy, terms, delete-account, imprint).
   Long-form document styles. Tokens, header, footer & primitives live in theme.css. */

/* ---- document shell ---- */
main.doc { max-width: 760px; margin: 0 auto; padding: 18px 24px 96px; }

.doc-title {
  color: var(--ink);
  font-size: clamp(30px, 6vw, 46px);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.06;
  margin: 22px 0 12px;
}
.updated {
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--accent); font-weight: 700; margin: 0;
}
.lede { font-size: 19px; color: var(--ink); margin: 20px 0 6px; line-height: 1.6; }

main.doc h2 {
  color: var(--ink);
  font-size: clamp(21px, 3.4vw, 27px);
  font-weight: 700; letter-spacing: -.02em;
  margin: 50px 0 12px; padding-top: 20px;
  border-top: 1px solid var(--border);
}
main.doc h3 { color: var(--ink); font-size: 18px; font-weight: 700; margin: 28px 0 6px; }

main.doc p, main.doc li { font-size: 16.5px; color: var(--body); }
main.doc ul, main.doc ol { padding-left: 22px; }
main.doc li { margin: 7px 0; }
main.doc a { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: .6px; font-weight: 500; }
main.doc a:hover { text-decoration-thickness: 1.6px; }

/* ---- tables ---- */
.table-wrap { overflow-x: auto; margin: 16px 0; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; vertical-align: top; padding: 11px 14px; border-bottom: 1px solid var(--border); }
thead th {
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); font-weight: 700; white-space: nowrap;
}
td { font-size: 15px; line-height: 1.55; color: var(--body); }

/* ---- inline bits ---- */
code, .mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .9em; background: var(--accent-tint); color: var(--ink);
  padding: 1px 6px; border-radius: 5px;
}
.fill {
  font-size: .82em; font-style: normal; letter-spacing: .02em;
  background: var(--accent-tint); color: var(--accent);
  padding: 1px 7px; border-radius: 5px; white-space: nowrap;
}

.callout {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 10px;
  padding: 4px 20px;
  margin: 22px 0;
}

.toc {
  font-size: 14px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px 22px;
  margin: 26px 0;
}
.toc strong {
  display: block; font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 8px; font-weight: 700;
}
.toc ol { columns: 2; column-gap: 28px; margin: 0; }
.toc a { text-decoration: none; color: var(--body); }
.toc a:hover { color: var(--accent); }

hr { border: 0; border-top: 1px solid var(--border); margin: 44px 0; }

/* ---- web account-deletion flow (Telegram login) ---- */
#tg-login, #tg-confirm, #tg-result { margin: 16px 0; }
button.danger {
  font: inherit; font-size: 14px; font-weight: 600; letter-spacing: .01em; cursor: pointer;
  background: #c0271f; color: #fff; border: 0; border-radius: 10px; padding: 12px 20px;
  transition: background-color .15s ease;
}
button.danger:hover { background: #a51f18; }
button.danger:disabled { opacity: .55; cursor: default; }
.result {
  font-size: 15px; padding: 12px 16px; border-radius: 10px; border: 1px solid var(--border);
}
.result.ok  { background: color-mix(in srgb, #1e7a34 14%, var(--surface)); color: #1e7a34; border-color: color-mix(in srgb, #1e7a34 32%, var(--border)); }
.result.err { background: color-mix(in srgb, #c0271f 12%, var(--surface)); color: #c0271f; border-color: color-mix(in srgb, #c0271f 32%, var(--border)); }
.hint { font-size: 14px; color: var(--muted); }

@media (max-width: 540px) {
  .toc ol { columns: 1; }
}