/* Legal pages (Terms, Refunds, Privacy, index). Loaded AFTER billing.css, which supplies the tokens, card, skip link,
   focus ring and footer. Same-origin CSS only. Honours the editor's accessibility settings (data-text / data-contrast /
   data-motion, set on <html> by /static/js/a11y-early.js), prefers-reduced-motion, forced-colors and print. */
html[data-text="125"] { font-size: 125%; }
html[data-text="150"] { font-size: 150%; }
html[data-text="200"] { font-size: 200%; }

/* High contrast: same palette idea as the editor's high-contrast theme; every pair is >= 7:1. */
html[data-contrast="high"] {
  --bg: #000;
  --card: #000;
  --text: #fff;
  --muted: #f2f2f2;
  --link: #7fe0ff;
  --border: #fff;
  --btn-bg: #fff;
  --btn-text: #000;
  --focus: #ffff00;
}
html[data-contrast="high"] .summary { background: #000; }
html[data-contrast="high"] th { background: #000; }

.legal-page header.site, .legal-page footer.site { max-width: 48rem; }
main.card.legal { max-width: 48rem; }
.legal h1 { font-size: 1.75rem; }
.legal h2 { font-size: 1.25rem; margin-top: 2rem; scroll-margin-top: 1rem; }
.legal h3 { font-size: 1rem; margin: 1.25rem 0 0.25rem; }
.legal section[aria-labelledby] { margin: 0; }
.updated { color: var(--muted); font-weight: 600; margin-bottom: 1.25rem; }
.legal ul, .legal ol { margin: 0 0 1rem; padding-left: 1.5rem; }
.legal li { margin-bottom: 0.375rem; }
.legal code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.9em; }

/* Numbered clauses: the number hangs in the margin, the text wraps cleanly under itself. */
.clause { position: relative; padding-left: 3em; margin: 0 0 0.75rem; }
.clause .num { position: absolute; left: 0; top: 0; font-weight: 700; color: var(--muted); }

.defs { margin: 0 0 1rem 3em; }
.defs dt { font-weight: 700; margin-top: 0.5rem; }
.defs dd { margin: 0 0 0.25rem; }

.operator { border: 1px solid var(--border); border-radius: 0.5rem; padding: 0.25rem 1rem 0.5rem; margin: 1.25rem 0; }
.operator h2 { margin-top: 0.75rem; }
.operator .facts { margin-bottom: 0.75rem; }
.operator p:last-child { margin-bottom: 0.5rem; }

.summary { background: var(--bg); border: 2px solid var(--text); border-radius: 0.5rem; padding: 0.25rem 1rem 0.5rem; margin: 1.25rem 0; }
.summary h2 { margin-top: 0.75rem; }

.toc { margin: 1.25rem 0; }
.toc h2 { margin-top: 0; }
.toc ol { padding-left: 2rem; }
.toc ul.doc-list { list-style: none; padding-left: 0; }
.toc a, .operator a { display: inline-block; padding: 0.25rem 0; }
.toc ul.doc-list a { padding-right: 0.25rem; }

.table-wrap { overflow-x: auto; margin: 0 0 1rem; border: 1px solid var(--border); border-radius: 0.375rem; }
.table-wrap:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
table { border-collapse: collapse; width: 100%; min-width: 34rem; font-size: 0.9375rem; }
caption { text-align: left; font-weight: 700; padding: 0.5rem 0.75rem; }
th, td { text-align: left; vertical-align: top; padding: 0.5rem 0.75rem; border-top: 1px solid var(--border); overflow-wrap: break-word; }
thead th { color: var(--muted); }

@media (max-width: 30rem) {
  main.card.legal { padding: 1rem; }
  .legal h1 { font-size: 1.5rem; }
}

html[data-motion="reduce"] * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }

@media (forced-colors: active) {
  .operator, .summary, .table-wrap { border: 2px solid CanvasText; }
  th, td { border-top: 1px solid CanvasText; }
  .table-wrap:focus-visible { outline: 3px solid Highlight; }
}

@media print {
  :root { --bg: #fff; --card: #fff; --text: #000; --muted: #000; --link: #000; --border: #000; }
  body { display: block; min-height: 0; background: #fff; color: #000; font-size: 11pt; line-height: 1.4; }
  .skip, .legal-links { display: none; }
  header.site, footer.site { max-width: none; padding: 0; }
  main.card, main.card.legal { width: auto; max-width: none; margin: 0.5rem 0; padding: 0; border: 0; border-radius: 0; }
  .legal a { text-decoration: underline; }
  .legal a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.85em; }
  .legal h2, .legal h3, caption { break-after: avoid; }
  .clause, tr, .summary, .operator { break-inside: avoid; }
  .table-wrap { overflow: visible; border: 0; }
  table { min-width: 0; font-size: 10pt; }
  th, td { border: 1px solid #000; }
}
