/* The legal pages (docs/website/legal/page.mjs, V5): /privacy, /terms and
   /representative-terms. Loads after /resources/site.css; every value is a
   token from tokens.css (--az-res-*) or the mirrored site (--hx-*).
   VA's policy-review rules are measured by scripts/legal-audit.mjs: body
   text 16px at line height 1.6 in the ink colour (never a muted token),
   headings in the text's own case (no text-transform), one column of at
   most 70ch, the table stacked on phones, nothing wider than the screen. */

.az-legal-skip { position: absolute; left: var(--az-res-gap); top: var(--az-res-gap-s); z-index: 100; transform: translateY(-200%);
  padding: var(--az-res-gap-s) var(--az-res-gap); border-radius: var(--az-res-radius-sm); background: var(--hx-white);
  color: var(--az-res-ink); font-family: var(--az-res-font); font-size: 1rem; font-weight: var(--az-res-strong-weight); }
.az-legal-skip:focus { transform: none; }

/* The banner title in one colour: the site's lime accent word is 4.46:1 over
   the banner's lighter blue on a phone, under VA's 4.5:1 (this stylesheet
   loads on the legal pages only). */
section[data-canvas="cinematic"] .az-banner-title .az-title-accent { color: inherit; }

/* One column at every width (VA: no narrow columns): the header block, the
   contents, then the text. The section is one solid colour behind it. */
.hx-canvas.az-legal-section { background: var(--az-res-surface); }
.az-legal { max-width: 70ch; font-family: var(--az-res-font); font-size: 1rem; line-height: 1.6; color: var(--az-res-ink); }
.az-legal > * + * { margin-top: var(--az-res-gap-xl); }
.az-legal-text { min-width: 0; overflow-wrap: break-word; }
.az-legal-text:focus { outline: none; }
.az-legal :where(p, li, td, th) { font-size: 1rem; line-height: 1.6; color: var(--az-res-ink); text-transform: none; letter-spacing: normal; }

.az-legal-head p { margin: 0; }
.az-legal-head .az-legal-heading { font-weight: var(--az-res-strong-weight); }
.az-legal-head .az-legal-summary { margin-top: var(--az-res-gap-s); }
.az-legal-head .az-legal-meta, .az-legal-head .az-legal-note { margin-top: var(--az-res-gap-s); }
/* Each line stays whole where it fits; at 400% zoom (320 CSS px) it wraps (WCAG 1.4.10). */
@media (min-width: 30em) { .az-legal-meta > span { white-space: nowrap; } }
.az-legal-print { margin-top: var(--az-res-gap); }
.az-legal-print-button { min-height: 44px; padding: 0 var(--az-res-gap); border: var(--az-res-hairline) solid var(--az-res-ink);
  border-radius: var(--az-res-radius-pill); background: var(--hx-white); color: var(--az-res-ink); font: inherit;
  font-weight: var(--az-res-strong-weight); cursor: pointer; }
.az-legal-print-button:hover { background: var(--az-res-brand-tint); }
.az-legal .az-legal-print-hint { margin-top: var(--az-res-gap-xs); }

/* Headings: the document's own words, never transformed. */
.az-legal-text :where(h2, h3, h4) { margin: var(--az-res-gap-xl) 0 0; scroll-margin-top: var(--az-res-anchor); font-family: var(--az-res-font-display);
  font-weight: var(--az-res-heading-weight); line-height: 1.3; color: var(--az-res-ink); text-transform: none; letter-spacing: normal; }
.az-legal-text h2 { font-size: 1.5rem; }
.az-legal-text h3 { font-size: 1.25rem; }
.az-legal-text h4 { font-size: 1.125rem; }
.az-legal-text > h2:first-child { margin-top: 0; }
.az-legal-text p { margin: var(--az-res-gap) 0 0; }
.az-legal-text :is(h2, h3, h4) + p { margin-top: var(--az-res-gap-s); }
.az-legal-text :where(ul, ol) { margin: var(--az-res-gap) 0 0; padding-left: var(--az-res-gap-l); }
.az-legal-text ul { list-style: disc; }
.az-legal-text ol { list-style: decimal; }
.az-legal-text li + li { margin-top: var(--az-res-gap-s); }
.az-legal strong { font-weight: var(--az-res-strong-weight); color: var(--az-res-ink); }
.az-legal a { color: var(--az-res-link); text-decoration: underline; text-decoration-thickness: var(--az-res-hairline); text-underline-offset: 0.15em; overflow-wrap: anywhere; }
.az-legal a:visited { color: var(--az-res-link-visited); }
.az-legal a:hover { color: var(--az-res-link-hover); text-decoration-thickness: var(--az-res-stroke); }

/* The table: columns from 640px, one card per row below. */
.az-legal-table { margin-top: var(--az-res-gap); }
.az-legal-table table { width: 100%; border-collapse: collapse; }
.az-legal-table :where(th, td) { padding: var(--az-res-gap-s) var(--az-res-gap-m); border: var(--az-res-hairline) solid var(--az-res-border-strong);
  text-align: left; vertical-align: top; }
.az-legal-table th { background: var(--az-res-surface-sunken); font-weight: var(--az-res-strong-weight); }
.az-legal-table td:first-child { font-weight: var(--az-res-strong-weight); }
@media (max-width: 639.98px) {
  .az-legal-table :where(table, thead, tbody, tr, th, td) { display: block; }
  .az-legal-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .az-legal-table tr { border: var(--az-res-hairline) solid var(--az-res-border-strong); border-radius: var(--az-res-radius-sm); }
  .az-legal-table tr + tr { margin-top: var(--az-res-gap-m); }
  .az-legal-table td { border: 0; padding: var(--az-res-gap-s) var(--az-res-gap-m); }
  .az-legal-table td + td { border-top: var(--az-res-hairline) solid var(--az-res-border); }
  .az-legal-table td::before { content: attr(data-label); display: block; font-weight: var(--az-res-strong-weight); }
  .az-legal-table td:first-child { background: var(--az-res-surface-sunken); }
}

/* Contents and the other documents. */
.az-legal-toc, .az-legal-others { padding: var(--az-res-gap-l); border: var(--az-res-hairline) solid var(--az-res-border-strong);
  border-radius: var(--az-res-radius); background: var(--az-res-surface); }
.az-legal :is(.az-legal-toc-title, .az-legal-others-title) { margin: 0; font-weight: var(--az-res-strong-weight); }
.az-legal-toc ol, .az-legal-others ul { margin: var(--az-res-gap-s) 0 0; padding: 0; list-style: none; }
.az-legal-toc li + li, .az-legal-others li + li { margin-top: var(--az-res-gap-xs); }
.az-legal-others { margin-top: var(--az-res-gap-2xl); }

/* Download as PDF: the browser's print window prints the document alone. */
@media print {
  header, footer, aside[aria-label="Contact shortcuts"], #az-consent, .az-legal-skip, [data-legal-print-hide] { display: none !important; }
  section[data-canvas="cinematic"] { padding: 0 !important; background: none !important; }
  section[data-canvas="cinematic"] > :not(.hx-shell) { display: none !important; }
  section[data-canvas="cinematic"] :is(h1, h1 *) { color: var(--hx-ink) !important; }
  .az-legal-section { padding: 0 !important; background: none !important; }
  .az-legal { max-width: none; color: var(--hx-ink); }
  .az-legal :where(p, li, td, th) { font-size: 11pt; }
  .az-legal-text :where(h2, h3, h4) { break-after: avoid; }
  .az-legal-table tr { break-inside: avoid; }
  .az-legal a { color: var(--hx-ink); }
}