/* Handout document: the preview in the plan dialog, the print sheet, and shared button state. Layout of the rail, bar, and dialogs lives in app-shell.css. */
.care-eyebrow { margin: 0; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--c-526047, #526047); }
:is(#combined-sheet, #print-sheet) { overflow-wrap: anywhere; color: var(--ink); }
#combined-sheet { padding: 20px; border: 1px solid var(--control-border); border-radius: 12px; background: var(--c-ffffff, #fff); }
:is(#combined-sheet, #print-sheet) :is(p, dl) { margin: 6px 0; }
:is(#combined-sheet, #print-sheet) h2 { margin: 0 0 4px; font-size: 1.75rem; line-height: 1.15; }
:is(#combined-sheet, #print-sheet) h3 { margin: 22px 0 0; padding-bottom: 4px; border-bottom: 2px solid var(--ink); font-size: 1.25rem; }
:is(#combined-sheet, #print-sheet) h4 { margin: 4px 0 6px; font-size: 1.1875rem; line-height: 1.25; }
:is(#combined-sheet, #print-sheet) h5 { margin: 12px 0 4px; font-size: .9375rem; }
:is(#combined-sheet, #print-sheet) :is(ol, ul) { margin: 4px 0; padding-left: 22px; }
:is(#combined-sheet, #print-sheet) li { margin: 4px 0; }
.handout-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.handout-title { flex: 1 1 auto; min-width: 0; }
.handout-title p { margin: 0 0 2px; }
.handout-prepared { font-weight: 700; }
.handout-qr { flex: none; margin: 0; width: 120px; font-size: .75rem; line-height: 1.25; text-align: center; }
.handout-qr img { display: block; width: 120px; height: 120px; image-rendering: pixelated; }
.plan-resource { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--c-ccd3c8, #ccd3c8); }
.plan-group > h3 + .plan-resource { margin-top: 8px; padding-top: 0; border-top: 0; }
.plan-contact { display: flex; flex-wrap: wrap; gap: 0 24px; margin: 6px 0; }
.plan-contact p { margin: 2px 0; }
.plan-contact a { font-weight: 700; }
/* Document checklist: a drawn box (not a font glyph) so it prints the same everywhere */
ul.checklist { margin: 4px 0; padding: 0; list-style: none; }
ul.checklist li { position: relative; margin: 4px 0; padding-left: 26px; }
ul.checklist li::before { content: ""; position: absolute; left: 0; top: .22em; box-sizing: border-box; width: 1em; height: 1em; border: 1.5px solid currentColor; border-radius: 2px; }
.kit-notice { margin: 6px 0; padding: 8px 10px; border-left: 4px solid var(--c-b26a00, #b26a00); background: var(--c-fff4d6, #fff4d6); color: var(--c-5a3b00, #5a3b00); }
.handout-footer { margin-top: 18px; }
:is(#combined-sheet, #print-sheet) .review { margin: 8px 0 0; font-size: .875rem; color: var(--c-42546a, #42546a); }
button:disabled { opacity: .5; cursor: default; }
@media (max-width: 620px) { #combined-sheet { padding: 14px; } .handout-qr, .handout-qr img { width: 96px; } .handout-qr img { height: 96px; } }

/* Language toggle in the plan dialog header: two separate buttons, the active one filled */
.lang-toggle { flex: none; display: inline-flex; gap: 6px; margin-top: 2px; }
.lang-toggle button { min-width: 44px; min-height: 44px; margin: 0; padding: 0 12px; border: 1px solid var(--control-border); border-radius: var(--control-radius); background: var(--c-ffffff, #fff); color: var(--ink); font-size: .875rem; font-weight: 700; }
.lang-toggle button[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--paper); }
@media (max-width: 400px) { .lang-toggle { gap: 4px; } .lang-toggle button { padding: 0 9px; } }

/* Printing goes through #print-sheet (built by care-tools.js), so the rail and bar can print without opening the dialog.
   One column at 11 pt on Letter with .5in margins: title, clinic and the short instructions at the left, QR code at the top right, resources grouped by need.
   Body text stays at 11 pt. Space is won by tight margins and by letting a resource and its lists continue on the next page between items. */
#print-sheet { display: none; }
@page { margin: .5in; }
@media print {
  body.printing-handout { background: var(--c-ffffff, #fff); }
  body.printing-handout > *:not(#print-sheet) { display: none !important; }
  body.printing-handout #print-sheet { display: block; background: var(--c-ffffff, #fff); color: var(--c-000000, #000); font: 11pt/1.2 Arial, Helvetica, sans-serif; }
  #print-sheet :is(p, dl) { margin: 2pt 0; }
  #print-sheet h2 { margin: 0 0 1pt; font-size: 20pt; line-height: 1.15; }
  #print-sheet h3 { margin: 6pt 0 0; padding-bottom: 1pt; border-bottom: 1.5pt solid var(--c-000000, #000); font-size: 13pt; line-height: 1.25; break-after: avoid; }
  #print-sheet h4 { margin: 1pt 0 2pt; font-size: 12pt; line-height: 1.2; break-after: avoid; }
  #print-sheet h5 { margin: 3pt 0 1pt; font-size: 10.5pt; line-height: 1.25; break-after: avoid; }
  #print-sheet :is(ol, ul) { margin: 1pt 0; padding-left: 18pt; }
  #print-sheet li { margin: .5pt 0; }
  #print-sheet .handout-head { gap: .25in; }
  #print-sheet .handout-qr { width: 1.45in; font-size: 8pt; break-inside: avoid; }
  #print-sheet .handout-qr img { width: 1.45in; height: 1.45in; }
  #print-sheet .care-eyebrow { font-size: 8.5pt; line-height: 1.2; color: var(--c-000000, #000); }
  /* A resource continues on the next page rather than leaving the rest of a sheet empty. Only single lines and small blocks (a description, one list item, a
     contact row, a note) stay whole, and a heading always stays with what follows it. Lists break between items, never inside one. */
  #print-sheet .plan-resource { margin-top: 4pt; padding-top: 2pt; border-top: .5pt solid var(--c-777777, #777); }
  #print-sheet :is(.plan-desc, .plan-who, .plan-meds, .plan-contact, .access-facts, .kit-notice, .care-note, .review, li) { break-inside: avoid; }
  #print-sheet :is(.care-eyebrow, h3, h4, h5) { break-after: avoid; }
  #print-sheet p { orphans: 2; widows: 2; }
  #print-sheet .plan-group > h3 + .plan-resource { margin-top: 4pt; padding-top: 0; border-top: 0; }
  #print-sheet .plan-contact { margin: 2pt 0; }
  #print-sheet .plan-contact p { margin: 0; }
  #print-sheet ul.checklist li { padding-left: 17pt; }
  #print-sheet ul.checklist li::before { top: .18em; width: 9pt; height: 9pt; border: 1pt solid var(--c-000000, #000); }
  #print-sheet .kit-notice { border-left: 3pt solid var(--c-000000, #000); background: none; color: var(--c-000000, #000); }
  #print-sheet .care-note { font-size: 9.5pt; }
  #print-sheet .access-facts { margin: 2pt 0; font-size: 10pt; }
  #print-sheet .review { margin: 2pt 0 0; font-size: 9pt; color: var(--c-000000, #000); break-before: avoid; }
  /* Kit sheet ("Print checklist") and the detail sections' lists, as they read on paper */
  #print-sheet .fact-list { margin: 3pt 0; font-size: 10pt; break-inside: avoid; }
  #print-sheet :is(.access-facts, .fact-list) dd::after { height: 2pt; }
  #print-sheet ul.detail-ways { display: block; margin: 3pt 0; padding: 0; }
  #print-sheet ul.detail-ways li { margin: 1.5pt 0; }
  #print-sheet .source-list { margin: 2pt 0; padding-left: 14pt; font-size: 9pt; line-height: 1.25; break-inside: avoid; } /* a sources list moves to the next page whole, never split */
  #print-sheet .source-list li { margin: 0; }
  #print-sheet .kit-print { font-size: 10.5pt; line-height: 1.3; } /* a little tighter than the handout so a typical kit stays on one page */
  #print-sheet .kit-print .handout-title p { margin: 0 0 2pt; }
  #print-sheet .kit-print .handout-footer { margin-top: 6pt; }
  #print-sheet .handout-footer { margin-top: 6pt; }
  #print-sheet a { color: var(--c-000000, #000); text-decoration: none; }
  #print-sheet a::after { content: none; }
}

/* Detail sections (T-019): Application kit, Hospital financial assistance, Income & coverage rules. Built by care-tools.js into the slots app.js leaves in each detail. */
.detail-section h4 { margin: 16px 0 4px; font-size: 1rem; }
.detail-section .kit-notice { margin: 10px 0; padding: 12px 14px; border-radius: 0 8px 8px 0; font-size: .9375rem; }
.detail-section ul.checklist { margin: 6px 0 10px; padding: 0; }
.detail-section ul.checklist li { margin: 8px 0; padding-left: 28px; }
.detail-section ul.detail-ways, ul.detail-ways { display: flex; flex-wrap: wrap; gap: 0 20px; margin: 6px 0; padding: 0; list-style: none; }
ul.detail-ways li { margin: 0; }
.detail-ways a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.detail-sources { margin: 10px 0 4px; }
.detail-sources summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; cursor: pointer; }
.coverage-table { width: 100%; max-width: 28rem; margin: 10px 0; border-collapse: collapse; font-size: .9375rem; }
.coverage-table caption { margin-bottom: 4px; text-align: left; font-weight: 700; }
.coverage-table :is(th, td) { padding: 8px 10px; border: 1px solid var(--c-b9c4cf, #b9c4cf); text-align: left; }
.coverage-table thead th { background: var(--c-eef3f7, #eef3f7); }
.coverage-table tbody th { font-weight: 400; }
.kit-status:empty { margin: 0; }
@media print { .kit-actions, .kit-status { display: none !important; } }

/* Link options (T-019): what the link and the QR code carry */
.plan-link-options { margin: 10px 0; padding: 4px 12px 8px; border: 1px solid var(--c-c9d3d0, #c9d3d0); border-radius: 8px; }
.plan-link-options[hidden], .plan-link-options [hidden] { display: none; }
.plan-link-options legend { padding: 0 6px; font-size: .875rem; font-weight: 700; }
.plan-link-options label { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding: 8px 0; font-size: .9375rem; font-weight: 400; line-height: 1.35; }
.plan-link-options input[type="checkbox"] { flex: none; width: 24px; height: 24px; margin: 0; }
.plan-long-link { padding: 8px 10px; border-left: 4px solid var(--c-b26a00, #b26a00); background: var(--c-fff4d6, #fff4d6); color: var(--c-5a3b00, #5a3b00); }

/* Clinic setup and setup-link sheets (T-019): small centered sheets at every width, like feedback */
dialog.sheet:is(.setup-sheet, .kit-sheet) { width: min(560px, calc(100vw - 24px)); height: fit-content; max-height: 90dvh; margin: auto; border: var(--line); border-radius: 14px; box-shadow: 0 20px 64px var(--s-14263b4d, #14263b4d); }
.setup-sheet label { display: block; font-size: .875rem; font-weight: 700; }
.setup-sheet label.check-label { display: flex; font-size: 1rem; font-weight: 400; }
.setup-sheet input:is([type="text"], [type="tel"]) { display: block; width: 100%; min-height: 48px; margin: 6px 0 0; padding: 10px 14px; border: 1px solid var(--control-border); border-radius: var(--control-radius); background: var(--c-ffffff, #fff); color: var(--ink); font: inherit; font-size: 1rem; font-weight: 400; }
.setup-sheet input[aria-invalid="true"] { border-color: var(--c-b3261e, #b3261e); box-shadow: 0 0 0 2px var(--s-b3261e55, #b3261e55); }
.setup-sheet fieldset { margin: 14px 0; padding: 4px 12px 8px; border: 1px solid var(--c-c9d3d0, #c9d3d0); border-radius: 8px; }
.setup-sheet fieldset[hidden] { display: none; }
.setup-sheet legend { padding: 0 6px; font-size: .875rem; font-weight: 700; }
.setup-sheet .care-actions button { min-height: 48px; }
.setup-sheet #setup-phone-hint { margin: 4px 0 12px; }
.setup-sheet .field-grid + .field-grid { margin-top: 12px; }
.kit-summary { margin: 8px 0; padding-left: 20px; }
.kit-summary ul { margin: 4px 0 8px; padding-left: 20px; }
.kit-summary li { margin: 6px 0; }