/* M-CHAT and ATEC: forms, result card, print layout */

.identity {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-4);
  background: var(--sunken);
  border-radius: var(--r-lg);
}
.identity legend { padding: 0; margin-bottom: var(--sp-2); }
.field { display: flex; flex-direction: column; gap: var(--sp-1); }
.field input,
.field select { width: 100%; }

.question {
  padding-block: var(--sp-4);
  border-bottom: 1px solid var(--border);
}
.question legend {
  padding: 0;
  margin-bottom: var(--sp-3);
  line-height: var(--lh-base);
}
.q-num { margin-inline-end: var(--sp-1); font-variant-numeric: tabular-nums; }

.segmented {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.seg-option { position: relative; cursor: pointer; }
.seg-face {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 5.5rem;
  min-height: var(--tap);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--control);
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--text);
  text-align: center;
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.seg-option:hover .seg-face { background: var(--accent-soft); }
.seg-option input:checked + .seg-face {
  background: var(--accent-soft);
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--accent);
  font-weight: 600;
}
.seg-option input:focus-visible + .seg-face {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}
.seg-label { font-size: var(--fs-xs); line-height: var(--lh-xs); color: var(--text-2); }
.seg-option input:checked + .seg-face .seg-label { color: var(--text); }

.result { margin-top: var(--sp-6); }
.result .outcome { font-size: var(--fs-lg); line-height: var(--lh-lg); }
.result .table-wrap + .meta { margin-top: var(--sp-3); }
.result h3 { margin-top: var(--sp-5); }
.scale-table caption { font-weight: 600; color: var(--text-2); }
.scale-table td.is-match {
  background: var(--accent-soft);
  color: var(--text);
  font-weight: 700;
}

.print-only { display: none; }
.print-head p { margin: 0; }
.print-value { font-weight: 600; }

@media print {
  .print-only { display: block; }
  .print-head { margin-bottom: var(--sp-4); }
  .print-answers {
    columns: 2;
    column-gap: var(--sp-5);
    font-size: var(--fs-sm);
  }
  .print-answers li { break-inside: avoid; margin-bottom: var(--sp-1); }
  .print-only h2 { font-size: var(--fs-lg); margin-top: var(--sp-4); }
  .result { break-inside: avoid; }
}