/* Terms of Service / Privacy Notice: the document itself, its dialog, and
   the version history. Used by the sign-up pages, terms.html, privacy.html
   and legal-update.html (js/legal.js). */

.legal-doc { line-height: 1.6; color: #1f2933; }
.legal-doc h2 { font-size: 1.12rem; margin: 1.6rem 0 .5rem; }
.legal-doc h3 { font-size: 1rem; margin: 1.2rem 0 .4rem; }
.legal-doc ul, .legal-doc ol { padding-left: 1.3rem; }
.legal-doc li { margin-bottom: .3rem; }
.legal-doc a { text-decoration: underline; }
.legal-table { overflow-x: auto; margin: .8rem 0 1rem; }
.legal-table table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.legal-table th, .legal-table td { border: 1px solid #d6dde3; padding: .45rem .6rem; text-align: left; vertical-align: top; }
.legal-table th { background: #f3f6f8; }

.legal-history-h { font-size: 1.05rem; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid #d6dde3; }
.legal-history { padding-left: 1.3rem; font-size: .92rem; }
.legal-history > li { margin-bottom: .7rem; }
.legal-history ul { margin: .2rem 0 0; padding-left: 1.1rem; color: #4a5560; }

/* Links that agree to something: body size, underlined, clearly links. */
.legal-agree { font-size: 1rem; }
.legal-agree a { text-decoration: underline; font-weight: 600; }

/* ── dialog ── */
html.legal-dialog-open { overflow: hidden; }
.legal-dialog {
  width: min(760px, calc(100vw - 32px)); max-height: min(86vh, 900px);
  /* styles.css resets every margin to 0; a modal dialog centres on margin:auto. */
  margin: auto; padding: 0; border: 0; border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
  display: none; flex-direction: column; overscroll-behavior: contain;
}
.legal-dialog[open] { display: flex; }
.legal-dialog::backdrop { background: rgba(15, 23, 30, .55); }
.legal-dialog-head { display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px 12px; border-bottom: 1px solid #e3e8ec; }
.legal-dialog-head > div { flex: 1; }
.legal-dialog-head h2 { font-size: 1.25rem; margin: 0; outline: none; }
.legal-dialog-meta { margin: .2rem 0 0; font-size: .85rem; color: #5b6770; }
.legal-dialog-x {
  border: 0; background: transparent; font-size: 1.9rem; line-height: 1; width: 44px; height: 44px;
  border-radius: 8px; color: #33404a; flex: none; margin: -6px -8px 0 0;
}
.legal-dialog-x:hover, .legal-dialog-x:focus-visible { background: #eef2f5; }
.legal-dialog-body { padding: 8px 20px 16px; overflow-y: auto; flex: 1; overscroll-behavior: contain; }
.legal-dialog-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 20px; border-top: 1px solid #e3e8ec; background: #fafbfc; border-radius: 0 0 12px 12px;
}
.legal-dialog-foot .btn { min-width: 110px; min-height: 44px; }

@media (max-width: 600px) {
  .legal-dialog {
    width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh;
    margin: 0; border-radius: 0;
  }
  .legal-dialog-foot { border-radius: 0; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
}