/* ==========================================================================
   /accessibility — page-specific styles (01-prd-accessibility-statement.md
   FRs 13–14, 22). Reuses site.css composition (.section*, .visually-hidden)
   and the role tokens; everything here is checklist/record-specific — no
   second page renders conformance tables, so nothing below belongs in
   site.css yet. The page renders in the warm theme (.section--light), whose
   text pairs are already gate-verified; the one new non-text pair introduced
   here (the Met cue's --color-success-dark on the warm surfaces) is verified
   with tools/scripts/contrast.js --palette (task 5.2).
   ========================================================================== */

/* ==========================================================================
   Conformance tables — the page's centre (§ 6(d))
   ========================================================================== */

.accessibility-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.5rem;
  line-height: 1.5;
}

.accessibility-table thead th {
  text-align: left;
  padding: 1rem 1.2rem;
  border-bottom: 2px solid var(--text-muted);
  white-space: nowrap;
}

.accessibility-table tbody th,
.accessibility-table tbody td {
  text-align: left;
  vertical-align: top;
  padding: 1rem 1.2rem;
  /* Decorative row separator — ink at low alpha, exempt from the non-text
     contrast floor (accessibility-standards.md § Friction lists decorative
     separators; the row structure is carried by the table semantics). */
  border-bottom: 1px solid rgba(31, 26, 21, 0.18);
}

.accessibility-table tbody th[scope='row'] {
  font-weight: 600;
  min-width: 18rem;
}

.accessibility-table__level,
.accessibility-table__date {
  white-space: nowrap;
}

/* The evidence column carries prose — give it the room the others don't need. */
.accessibility-table__evidence {
  min-width: 38rem;
}

/* ==========================================================================
   Status treatment — four statuses, each a text label plus a non-color cue
   (FR 13; 1.4.1). The cue shapes differ (filled / half-filled / hollow /
   dotted) so the distinction survives grayscale and screenshots.
   ========================================================================== */

.status-mark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.45em;
  white-space: nowrap;
}

.status-mark::before {
  content: '';
  flex: none;
  align-self: center;
  width: 0.7em;
  height: 0.7em;
  border-radius: 50%;
}

/* Met — filled green disc. The green on the warm surfaces is a non-text cue
   (3:1 floor), gate-verified via contrast.js --palette (task 5.2). The LABEL
   stays body ink — the green clears the non-text floor but not the 4.5:1
   text floor on this canvas, so it is deliberately never used as text. */
.status-mark--met::before {
  background: var(--color-success-dark);
}

/* Partially met — half-filled dark-orange disc (the gate-verified
   --color-primary-dark text ink, comfortably above the non-text floor). */
.status-mark--partial::before {
  border: 2px solid var(--color-primary-dark);
  background: linear-gradient(90deg, var(--color-primary-dark) 50%, transparent 50%);
}

/* Not applicable — hollow muted ring. */
.status-mark--na::before {
  border: 2px solid var(--text-muted);
}

/* Not yet assessed — dotted muted ring. */
.status-mark--unassessed::before {
  border: 2px dotted var(--text-muted);
}

/* Recessive Not-applicable rows (FR 13): quieter than Met/Partially met but
   fully present in the DOM and accessibility tree — muted ink only, which
   still clears the 4.5:1 text floor on every light surface (gate-verified
   in the shipped contrast matrix). No hidden, no disclosure. */
.accessibility-table__row--na {
  color: var(--text-muted);
}

/* ==========================================================================
   Overflow + anchors (FR 14; § 6(d)) — wide content scrolls inside its own
   container, never the page body; anchored rows land clear of the viewport
   top (the marketing header is currently static — verified in the task 2.4
   census — so the margin is landing comfort today and sticky-header
   insurance for the restyle).
   ========================================================================== */

.accessibility-table-wrap {
  overflow-x: auto;
}

.accessibility-table__row {
  scroll-margin-top: 8rem;
}

/* Section headings own their vertical rhythm (the privacy.css heading
   pattern): without explicit margins the reset zeroes them and the gap above
   each h2 becomes whatever the preceding element's bottom margin happens to
   be — 20px after a paragraph, 0 after a list or table wrapper (found at the
   7.6 operator review). scroll-margin gives the in-page "reach out" link the
   same landing comfort as the row anchors. */
.accessibility-content__heading {
  margin-top: var(--space-xl);
  margin-bottom: var(--space-sm);
  scroll-margin-top: 8rem;
}

.accessibility-content__heading:first-child {
  margin-top: 0;
}

.accessibility-content__subheading {
  margin-top: var(--space-lg);
  margin-bottom: var(--space-sm);
}

/* ==========================================================================
   Case-study transcripts (§ 6(f)) — captured output, visibly quoted,
   distinct from the page's own voice. Long NVDA lines scroll inside the
   block rather than widening the page.
   ========================================================================== */

.accessibility-transcript {
  margin: 1.6rem 0 2.4rem;
  padding: 1.6rem 2rem;
  background: var(--surface-recessed, rgba(31, 26, 21, 0.06));
  border-left: 4px solid var(--text-muted);
  font-family: Consolas, 'Courier New', monospace;
  font-size: 1.4rem;
  line-height: 1.6;
  overflow-x: auto;
}

/* ==========================================================================
   Statements of record (§ 6(a), FR 12) — the header status block and the
   summary strip read as scannable record lines, set apart from body prose.
   ========================================================================== */

.accessibility-status {
  margin: 2.4rem 0;
  border-left: 4px solid var(--text-accent);
  padding-left: 2rem;
  display: grid;
  gap: 0.8rem;
}

.accessibility-status__item {
  display: flex;
  gap: 0.8rem;
}

.accessibility-status__label {
  font-weight: 700;
  flex: none;
}

.accessibility-status__value {
  margin: 0;
}

/* The scope line runs long — let it wrap as a block under its label. */
.accessibility-status__item--scope {
  display: block;
}

.accessibility-status__item--scope .accessibility-status__label {
  display: inline;
  margin-right: 0.8rem;
}

.accessibility-status__item--scope .accessibility-status__value {
  display: inline;
}

.accessibility-strip {
  font-size: 2rem;
  font-weight: 600;
  margin: 1.6rem 0 2.4rem;
}

/* ==========================================================================
   Definition lists — the § 6(a) status block and § 6(c) methods
   ========================================================================== */

.accessibility-methods__item {
  margin-block-end: 1.6rem;
}

.accessibility-methods__method {
  font-weight: 700;
}

.accessibility-methods__detail {
  margin: 0.4rem 0 0;
}
