/* A reading guide and printable family worksheet within the clinical site. */
.parent-guide {
  --guide-blue: #16324a;
  --guide-teal: #096b72;
  --guide-line: #d7e4ea;
  --guide-sage: #edf5ee;
  --guide-sand: #fbf3e3;
  --guide-rose: #fbefef;
  color: var(--guide-blue);
}
.parent-guide .guide-header { padding-block: clamp(2rem, 5vw, 4.5rem) 2.75rem; }
.parent-guide .guide-back { margin-bottom: 1.25rem; font-size: .9rem; }
.parent-guide .guide-header h1 { max-width: 20ch; font-size: clamp(2.15rem, 4.6vw, 4rem); }
.parent-guide .guide-lead { max-width: 71ch; font-size: clamp(1.1rem, 1.6vw, 1.22rem); line-height: 1.7; }
.parent-guide .guide-byline { display: flex; flex-wrap: wrap; gap: .6rem 2.5rem; margin-block: 1.75rem; font-size: .88rem; color: #476071; }
.parent-guide .guide-byline p { margin: 0; }
.parent-guide .guide-byline strong { display: block; color: var(--guide-blue); }
.parent-guide .guide-downloads { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.parent-guide .guide-record-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.parent-guide .guide-scope-note { max-width: 83ch; margin-top: 1.75rem; padding: 1rem 1.25rem; border-inline-start: 3px solid var(--guide-teal); background: #f2f7fa; font-size: .92rem; }
.parent-guide .guide-layout { display: grid; grid-template-columns: minmax(13rem, 17rem) minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); align-items: start; padding-bottom: 4rem; }
.parent-guide .guide-navigation { position: sticky; top: 1.5rem; padding-block: 1rem; font-size: .86rem; }
.parent-guide .guide-navigation details { border-block: 1px solid var(--guide-line); padding-block: .9rem; }
.parent-guide .guide-navigation summary { min-height: 44px; cursor: pointer; font-weight: 700; font-size: 1rem; }
.parent-guide .guide-navigation ol { padding: 0; list-style: none; margin-block: .55rem 0; }
.parent-guide .guide-navigation li + li { margin-top: .25rem; }
.parent-guide .guide-navigation a { display: block; min-height: 44px; padding: .5rem .15rem; color: var(--guide-blue); text-decoration: none; line-height: 1.45; }
.parent-guide .guide-navigation a:hover { color: var(--guide-teal); text-decoration: underline; }
.parent-guide .guide-content { min-width: 0; }
.parent-guide .guide-section { padding-block: 2.25rem; border-top: 1px solid var(--guide-line); }
.parent-guide .guide-section h2, .parent-guide .guide-contact h2 { font-size: clamp(1.65rem, 2.6vw, 2.25rem); scroll-margin-top: 2rem; }
.parent-guide .guide-section h3 { margin-top: 1.5rem; font-size: clamp(1.23rem, 1.65vw, 1.5rem); }
.parent-guide .guide-section p, .parent-guide .guide-section ul { max-width: 75ch; }
.parent-guide .guide-section li + li { margin-top: .65rem; }
.parent-guide .guide-section-intro { font-size: 1.03rem; }
.parent-guide .guide-source-links { margin-block: 1rem 0; font-size: .81rem; color: #476071; }
.parent-guide .guide-source-links a { display: inline-block; padding: .2rem .15rem; }
.parent-guide .guide-priority-group { margin-block: 1.5rem; padding: 0 0 0 1.1rem; border-inline-start: 3px solid #bdd8da; }
.parent-guide .guide-priority-group h3 { margin-top: 0; }
.parent-guide .guide-priority-group:last-of-type { margin-bottom: 0; }

/* Each variable is compared side by side; the written labels carry the meaning. */
.parent-guide .guide-traffic-row { padding-block: 1.1rem 1.4rem; border-bottom: 1px solid var(--guide-line); }
.parent-guide .guide-traffic-row h3 { margin-top: 0; margin-bottom: 1rem; }
.parent-guide .guide-traffic-states { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; }
.parent-guide .guide-traffic-state { padding: 1rem; }
.parent-guide .guide-traffic-state h4 { display: flex; gap: .45rem; align-items: flex-start; margin-bottom: .65rem; font-family: var(--font-body, sans-serif); font-size: .85rem; font-weight: 700; letter-spacing: 0; line-height: 1.5; }
.parent-guide .guide-traffic-state p { font-size: .88rem; line-height: 1.65; }
.parent-guide .guide-traffic-green { background: var(--guide-sage); }
.parent-guide .guide-traffic-amber { background: var(--guide-sand); }
.parent-guide .guide-traffic-red { background: var(--guide-rose); }
.parent-guide .guide-state-dot { flex: 0 0 .5rem; width: .5rem; height: .5rem; margin-top: .42rem; border-radius: 50%; background: #366d46; }
.parent-guide .guide-traffic-amber .guide-state-dot { background: #946310; }
.parent-guide .guide-traffic-red .guide-state-dot { background: #a03f43; }
.parent-guide .guide-traffic-action { padding: 1rem 0 0; }
.parent-guide .guide-traffic-action p { font-size: .92rem; }
.parent-guide .guide-traffic-action .guide-evidence-label { color: #476071; font-size: .83rem; }
.parent-guide .guide-traffic-action .guide-source-links { font-size: .81rem; margin-top: .5rem; }
.parent-guide .guide-traffic-notes { margin-top: 1.5rem; padding: 1rem 1.2rem; background: #f2f7fa; font-size: .86rem; }
.parent-guide .guide-traffic-notes ul { margin-bottom: 0; }

.parent-guide .guide-example { background: #f4f9fa; padding: 1.5rem; margin-block: 1.5rem; border: 1px solid var(--guide-line); }
.parent-guide .guide-example-context { font-size: .9rem; color: #476071; }
.parent-guide .guide-calculations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin-block: 1.5rem; gap: .75rem; }
.parent-guide .guide-calculations li { margin: 0; padding: 1rem .75rem; background: #fff; border-bottom: 2px solid #82b4b7; font-weight: 700; font-size: 1.04rem; line-height: 1.5; text-align: center; }
.parent-guide .guide-calculations li + li { margin-top: 0; }

.parent-guide .guide-child-fields, .parent-guide .guide-summary-fields { margin-block: 1.5rem; }
.parent-guide .guide-child-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.5rem; }
.parent-guide .guide-child-fields div, .parent-guide .guide-summary-fields div { min-width: 0; }
.parent-guide .guide-child-fields dt, .parent-guide .guide-summary-fields dt { font-weight: 600; font-size: .88rem; }
.parent-guide .guide-child-fields dd, .parent-guide .guide-summary-fields dd { margin: .2rem 0 0; }
.parent-guide .guide-write-line { display: block; min-height: 1.9rem; border-bottom: 1px solid #8198a5; }
.parent-guide .guide-summary-fields div + div { margin-top: .9rem; }
.parent-guide .guide-table-hint { font-size: .83rem; color: #476071; }
.parent-guide .guide-table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--guide-line); margin-bottom: 1.5rem; }
.parent-guide .guide-week-table { width: 100%; min-width: 930px; table-layout: fixed; border-collapse: collapse; color: var(--guide-blue); }
.parent-guide .guide-week-table caption { padding: .8rem; text-align: left; font-weight: 700; background: #f2f7fa; }
.parent-guide .guide-week-table th, .parent-guide .guide-week-table td { border: 1px solid var(--guide-line); padding: .6rem .45rem; vertical-align: top; overflow-wrap: anywhere; }
.parent-guide .guide-week-table thead th { background: #edf7f6; font-size: .77rem; line-height: 1.5; text-align: left; }
.parent-guide .guide-week-table thead th:nth-child(1) { width: 10%; }
.parent-guide .guide-week-table thead th:nth-child(2) { width: 15%; }
.parent-guide .guide-week-table thead th:nth-child(3) { width: 11%; }
.parent-guide .guide-week-table thead th:nth-child(4) { width: 12%; }
.parent-guide .guide-week-table thead th:nth-child(5) { width: 18%; }
.parent-guide .guide-week-table thead th:nth-child(6) { width: 12%; }
.parent-guide .guide-week-table thead th:nth-child(7) { width: 9%; }
.parent-guide .guide-week-table thead th:nth-child(8) { width: 13%; }
.parent-guide .guide-week-table tbody th { font-size: .82rem; text-align: left; background: #f9fbfc; }
.parent-guide .guide-blank-cell { display: block; min-height: 3.1rem; }
.parent-guide .guide-record-note { padding: 1rem 1.15rem; border-inline-start: 3px solid var(--guide-teal); background: #edf7f6; font-size: .93rem; }
.parent-guide .guide-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.parent-guide .guide-scenarios { margin-block: 1.5rem; }
.parent-guide .guide-scenario { padding: 1.1rem 0 1.1rem 1.15rem; border-inline-start: 3px solid #9bbfc9; }
.parent-guide .guide-scenario + .guide-scenario { margin-top: 1rem; }
.parent-guide .guide-scenario h3 { margin-top: 0; }
.parent-guide .guide-coach-list { list-style: none; padding: 0; }
.parent-guide .guide-coach-list li { border-bottom: 1px solid var(--guide-line); }
.parent-guide .guide-coach-list label { display: flex; align-items: flex-start; gap: .8rem; padding-block: .65rem; min-height: 44px; cursor: pointer; }
.parent-guide .guide-coach-list input { flex: 0 0 1.15rem; width: 1.15rem; height: 1.15rem; margin: .3rem 0 0; accent-color: var(--guide-teal); }
.parent-guide .guide-checklist-hint { font-size: .87rem; color: #476071; }
.parent-guide .guide-references ol { padding-inline-start: 1.5rem; }
.parent-guide .guide-references li { padding: .8rem 0 .8rem .35rem; border-bottom: 1px solid var(--guide-line); scroll-margin-top: 2rem; }
.parent-guide .guide-references h3 { margin-top: 0; font-family: var(--font-body, sans-serif); font-size: 1rem; font-weight: 600; letter-spacing: 0; line-height: 1.5; }
.parent-guide .guide-references li p { margin-bottom: .5rem; font-size: .84rem; overflow-wrap: anywhere; }
.parent-guide .guide-reference-role { color: #476071; }
.parent-guide .guide-doi { display: block; margin-top: .2rem; }
.parent-guide .guide-contact { margin-block: 2rem; padding: 1.5rem; border: 1px solid #bdd8da; background: #edf7f6; }
.parent-guide .guide-contact-email { margin-top: 1rem; font-size: .9rem; overflow-wrap: anywhere; }
.parent-guide .guide-provenance { padding-top: 1.25rem; border-top: 1px solid var(--guide-line); color: #476071; font-size: .79rem; }
.parent-guide .guide-provenance p { margin-bottom: .65rem; }
.parent-guide .guide-source-filename { overflow-wrap: anywhere; }
.parent-guide .guide-print-footer { display: none; }
.parent-guide a:focus-visible, .parent-guide summary:focus-visible, .parent-guide input:focus-visible, .parent-guide .guide-table-scroll:focus-visible { outline: 3px solid #a74d00; outline-offset: 4px; }

@media (max-width: 1050px) {
  .parent-guide .guide-layout { grid-template-columns: minmax(0, 1fr); max-width: 850px; gap: 1rem; }
  .parent-guide .guide-navigation { position: static; padding-top: 0; }
  .parent-guide .guide-navigation ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .15rem 1.5rem; }
}
@media (max-width: 650px) {
  .parent-guide .guide-header { padding-bottom: 1.5rem; }
  .parent-guide .guide-header h1 { font-size: clamp(2rem, 7vw, 2.7rem); }
  .parent-guide .guide-navigation ol, .parent-guide .guide-traffic-states { grid-template-columns: minmax(0, 1fr); }
  .parent-guide .guide-traffic-states { gap: .4rem; }
  .parent-guide .guide-traffic-state { padding: .9rem 1rem; }
  .parent-guide .guide-traffic-state p { font-size: .94rem; }
  .parent-guide .guide-calculations { grid-template-columns: minmax(0, 1fr); gap: .45rem; }
  .parent-guide .guide-calculations li { padding: .8rem; }
  .parent-guide .guide-child-fields { grid-template-columns: minmax(0, 1fr); }
  .parent-guide .guide-example, .parent-guide .guide-contact { padding: 1.1rem; }
  .parent-guide .guide-section { padding-block: 1.75rem; }
}

@media print {
  .parent-guide { font-size: 10pt; line-height: 1.45; }
  .parent-guide .container { width: 100%; max-width: none; margin: 0; }
  .parent-guide .guide-header { padding: 0 0 1rem; }
  .parent-guide .guide-header h1 { max-width: none; font-size: 24pt; }
  .parent-guide .guide-lead { font-size: 11pt; }
  .parent-guide .guide-back, .parent-guide .guide-downloads, .parent-guide .guide-navigation, .parent-guide .guide-table-hint, .parent-guide .guide-contact { display: none; }
  .parent-guide .guide-layout { display: block; padding: 0; }
  .parent-guide .guide-section { padding-block: 1rem; }
  .parent-guide .guide-section h2 { font-size: 17pt; break-after: avoid; }
  .parent-guide .guide-section h3 { font-size: 12pt; break-after: avoid; }
  .parent-guide .guide-traffic-states { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; }
  .parent-guide .guide-traffic-state { border: 1px solid #aaa; padding: .5rem; }
  .parent-guide .guide-traffic-state p { font-size: 8.5pt; }
  .parent-guide .guide-traffic-state h4 { font-size: 8.5pt; }
  .parent-guide .guide-traffic-row, .parent-guide .guide-scenario, .parent-guide .guide-priority-group { break-inside: avoid; }
  .parent-guide .guide-calculations { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .parent-guide .guide-weekly-record { break-before: page; }
  .parent-guide .guide-child-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .parent-guide .guide-table-scroll { overflow: visible; border: 0; }
  .parent-guide .guide-week-table { min-width: 0; width: 100%; font-size: 7pt; }
  .parent-guide .guide-week-table thead th, .parent-guide .guide-week-table tbody th { font-size: 7pt; }
  .parent-guide .guide-week-table th, .parent-guide .guide-week-table td { border-color: #888; padding: .3rem .2rem; }
  .parent-guide .guide-week-table thead { display: table-header-group; }
  .parent-guide .guide-week-table tr { break-inside: avoid; }
  .parent-guide .guide-blank-cell { min-height: 2.8rem; }
  .parent-guide .guide-summary-fields { font-size: 9pt; }
  .parent-guide .guide-write-line { min-height: 1.5rem; }
  .parent-guide .guide-references li { break-inside: avoid; }
  .parent-guide .guide-references h3 { font-size: 9.5pt; }
  .parent-guide .guide-references li p { font-size: 8.5pt; }
  .parent-guide .guide-print-footer { display: block; margin-top: 1rem; }
  .parent-guide a { color: inherit; }
}
