/* User guide page. Uses only the tokens defined in styles.css, so light, dark and high-contrast modes apply automatically. */

.guide .lead { font-size: 1.125rem; color: var(--text-muted); max-width: 40rem; margin-bottom: 0; }

/* Keep anchored headings clear of the sticky header */
.guide h2[id], .guide h3[id] { scroll-margin-top: 5rem; }

.guide h2 { padding-top: 0.5rem; }
.guide h3 { font-size: 1.125rem; color: var(--brand-navy); margin: 1.5rem 0 0.5rem; }
.guide p, .guide li { color: var(--text); }
.guide li strong { color: var(--brand-navy); }

/* Table of contents */
.toc {
  margin-block: 1.5rem 0.5rem;
  padding: 1.25rem;
  border-radius: var(--radius);
  background: var(--surface);
  border: 1px solid var(--glass-ring);
  box-shadow: var(--shadow-2);
}
.toc h2 { margin: 0 0 0.75rem; font-size: 1.125rem; padding-top: 0; }
.toc ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
@media (min-width: 640px) { .toc ul { grid-template-columns: 1fr 1fr; column-gap: 1.5rem; } }
.toc a { display: inline-block; padding-block: 0.25rem; font-weight: 600; color: var(--brand-dark); }

/* Notes and warnings */
.guide-note {
  margin: 1rem 0;
  padding: 1rem 1.25rem;
  border-radius: 16px;
  background: var(--brand-soft);
  border: 1px solid var(--brand-dark);
}
.guide-note p { margin: 0; color: var(--text); }

/* Tables */
.table-wrap {
  overflow-x: auto;
  margin-block: 1rem;
  border-radius: 16px;
  background: var(--surface);
  border: 1px solid var(--glass-ring);
}
.guide table { width: 100%; border-collapse: collapse; font-size: 0.975rem; }
.guide th, .guide td {
  padding: 0.75rem 1rem;
  text-align: start;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}
.guide thead th { background: var(--brand-soft); color: var(--brand-navy); font-weight: 700; }
.guide tbody th { color: var(--brand-navy); font-weight: 700; }
.guide tbody tr:last-child th, .guide tbody tr:last-child td { border-bottom: 0; }
.guide td { color: var(--text); }

/* Closing call to action */
.guide-cta { margin-top: 2.5rem; }

/* Numbered steps inside the page keep the default ol numbering, with room between items */
.guide ol li { margin-block: 0.5rem; }