/* TAR-243: the Terms of Service and the Privacy Notice. They load the field guide's stylesheet
   (/help/help.css) first; this file adds the light theme, the version line and the tables.
   Dark is the default, as in the studio. The studio's own choice (the sun/moon button, kept in
   localStorage) wins through legal.js; without one, the system preference decides. */
body.legal {
  --bg: #101312;
  --text: #e3e8dd;
  --body: #b2bca9;
  --strong: #dce5d2;
  --faint: #6f8064;
  --eyebrow: #8f9f83;
  --navtext: #a4b29a;
  --line: #2c342e;
  --link: #c2d1a7;
  --panel: #182019;
  --panelline: #3b4636;
  --mark: #80996c;
  background: var(--bg);
  color: var(--text);
}
:root[data-theme="light"] body.legal {
  --bg: #f4f3ee;
  --text: #1c201b;
  --body: #3f453c;
  --strong: #161a15;
  --faint: #7a8174;
  --eyebrow: #5f6b56;
  --navtext: #4d5747;
  --line: #dcdcd2;
  --link: #3f5a2c;
  --panel: #eaeee2;
  --panelline: #cfd6c4;
  --mark: #6d8a55;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) body.legal {
    --bg: #f4f3ee;
    --text: #1c201b;
    --body: #3f453c;
    --strong: #161a15;
    --faint: #7a8174;
    --eyebrow: #5f6b56;
    --navtext: #4d5747;
    --line: #dcdcd2;
    --link: #3f5a2c;
    --panel: #eaeee2;
    --panelline: #cfd6c4;
    --mark: #6d8a55;
    color-scheme: light;
  }
}
body.legal a { color: var(--link); }
body.legal header,
body.legal section,
body.legal td,
body.legal th { border-color: var(--line); }
body.legal nav { border-color: var(--line); }
body.legal header > a:first-child { color: var(--text); }
body.legal header span { color: var(--eyebrow); }
body.legal nav a { color: var(--navtext); }
body.legal p,
body.legal li,
body.legal td { color: var(--body); }
body.legal strong,
body.legal dt { color: var(--strong); }
body.legal .eyebrow,
body.legal .number,
body.legal th { color: var(--eyebrow); }
body.legal footer p { color: var(--faint); }
body.legal h1 em { color: var(--link); }
/* The design system: no serif except the logo mark. */
body.legal h1 {
  font-family: "DM Sans", Arial, sans-serif;
  font-weight: 500;
  font-size: 48px;
  letter-spacing: -0.03em;
}
body.legal main { max-width: 860px; }
.legal-version {
  display: inline-block;
  margin: 0 0 22px;
  padding: 4px 10px;
  border: 1px solid var(--panelline);
  border-radius: 4px;
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--strong) !important;
}
.legal-summary {
  margin: 10px 0 25px;
  padding: 20px 24px;
  background: var(--panel);
  border-left: 2px solid var(--mark);
  border-radius: 0 8px 8px 0;
  font-size: 13px;
}
.legal-summary ul { margin: 6px 0 10px; padding-left: 18px; }
.legal-summary li { padding: 4px 0; }
.legal-summary p:last-child { margin: 0; font-size: 12px; }
body.legal main ul,
body.legal main ol { padding-left: 20px; }
body.legal main li { padding: 5px 0; }
body.legal h3 { color: var(--strong); }
.legal-table td:first-child { color: var(--strong); width: 32%; }
.legal-table td { vertical-align: top; }
nav a.legal-switch {
  margin: 0 0 18px;
  padding: 10px 12px;
  border: 1px solid var(--panelline);
  border-radius: 8px;
  color: var(--strong) !important;
  font-weight: 500;
}
@media (max-width: 650px) {
  body.legal h1 { font-size: 38px; }
  nav a.legal-switch { grid-column: span 2; }
  .legal-table td:first-child { width: auto; }
}
@media print {
  body.legal nav,
  body.legal header > a:last-child { display: none; }
  body.legal .layout { display: block; }
}
