/* Visit Prep — styles. PAPER FIRST: the print sheet is the product; screen
   styles come second. A provider glances at this for fifteen seconds in an
   exam room — one page, generous type, top concerns unmissable. */

/* ---------- PRINT: the prep sheet ---------- */
@media print {
  @page { margin: 14mm; }
  * { animation: none !important; transition: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .med-bar, .site-foot, [data-screen]:not([data-screen="sheet"]),
  .vp-actions, .vp-route, .vp-nav, .no-print { display: none !important; }
  [data-screen="sheet"] { display: block !important; }

  .sheet { max-width: none; padding: 0; }
  .sheet-title { font: 700 20pt/1.15 Georgia, 'Times New Roman', serif; margin: 0 0 2pt; }
  .sheet-sub { font-size: 9pt; color: #333; margin: 0 0 10pt; }
  .sheet h2 { font: 700 11pt/1.2 Georgia, serif; border-bottom: 1pt solid #000;
              padding-bottom: 2pt; margin: 10pt 0 5pt; }
  .concern { margin: 0 0 6pt; page-break-inside: avoid; }
  .concern-clinical { font-weight: 700; font-size: 11pt; }
  .concern-words { font-style: italic; font-size: 9.5pt; color: #222; }
  .concern-meta { font-size: 8.5pt; color: #333; }
  .sheet-primary .concern { padding-left: 14pt; text-indent: -14pt; }
  .sheet ul, .sheet ol { margin: 0 0 6pt; padding-left: 14pt; }
  .sheet li { font-size: 9.5pt; margin: 0 0 2.5pt; }
  .sheet-questions li { font-size: 10.5pt; margin: 0 0 4pt; }
  .sheet-disclaimer { font-size: 7.5pt; color: #222; border-top: .5pt solid #000;
                      margin-top: 10pt; padding-top: 5pt; }
}

/* ---------- SCREEN ---------- */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; }
.vp { max-width: 42rem; margin-inline: auto; padding: 2.5rem var(--gutter) 4rem; }
[data-screen] { display: none; }
[data-screen].is-active { display: block; }

.vp h1 { font: 700 var(--step-3)/1.1 var(--font-warm); margin: 0 0 1rem; }
.vp .lede { font-size: var(--step-0); line-height: 1.55; margin: 0 0 1.5rem; }

.vp-nav { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1.5rem; }
.btn-quiet { appearance: none; border: 1px solid var(--rule); border-radius: .4rem;
  background: transparent; color: var(--ink); padding: .8rem 1.2rem; font: 600 1rem var(--font-body);
  cursor: pointer; }
.btn-quiet:hover { border-color: var(--ink); }

/* Brain dump */
.vp-dump textarea { width: 100%; min-height: 46vh; resize: vertical; border: 1px solid var(--rule);
  border-radius: .5rem; background: #fff; color: var(--ink); padding: 1rem;
  font: 400 1.05rem/1.6 var(--font-body); }
.vp-dump textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.vp-hints { margin: .75rem 0 0; }
.vp-hints summary { cursor: pointer; font-size: .9rem; color: #5c5550; }
.vp-hints ul { margin: .5rem 0 0; padding-left: 1.2rem; font-size: .9rem; color: #5c5550; }
.vp-count { font-size: .78rem; color: #5c5550; margin-top: .5rem; }
.btn-voice[aria-pressed="true"] { background: var(--ink); }

/* Consent + processing */
.consent-card { background: #fff; border: 1px solid var(--rule); border-radius: .5rem;
  padding: 1.25rem; margin: 1.25rem 0; }
.consent-card label { display: flex; gap: .7rem; align-items: flex-start; font-size: .95rem; line-height: 1.5; }
.consent-card input { margin-top: .25rem; width: 1.05rem; height: 1.05rem; accent-color: var(--accent); }
.vp-processing { text-align: center; padding: 3rem 0; }
.vp-spinner { width: 2.2rem; height: 2.2rem; margin: 0 auto 1.25rem; border-radius: 50%;
  border: 3px solid var(--rule); border-top-color: var(--accent); animation: vpspin .9s linear infinite; }
@keyframes vpspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .vp-spinner { animation: none; } }

/* Sheet on screen — mirrors the paper hierarchy */
.sheet { background: #fff; border: 1px solid var(--rule); border-radius: .5rem; padding: 1.75rem; }
.sheet-title { font: 700 var(--step-2)/1.15 var(--font-warm); margin: 0 0 .25rem; }
.sheet-sub { font-size: .82rem; color: #5c5550; margin: 0 0 1.25rem; }
.sheet h2 { font: 600 1rem var(--font-body); border-bottom: 1px solid var(--rule);
  padding-bottom: .3rem; margin: 1.4rem 0 .7rem; }
.concern { margin: 0 0 .85rem; }
.concern-clinical { font-weight: 700; }
.concern-words { font-style: italic; font-size: .92rem; color: #4a443f; }
.concern-meta { font-size: .82rem; color: #5c5550; }
.sheet ul, .sheet ol { margin: 0 0 .75rem; padding-left: 1.25rem; }
.sheet li { margin: 0 0 .4rem; }
.sheet-disclaimer { font-size: .78rem; color: #5c5550; border-top: 1px solid var(--rule);
  margin-top: 1.25rem; padding-top: .8rem; line-height: 1.5; }
.vp-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin: 1.25rem 0; }

/* Routing */
.vp-route { margin-top: 2rem; }
.offer-card { background: #fff; border: 1px solid var(--rule); border-radius: .5rem;
  padding: 1.25rem; margin: 1rem 0; }
.offer-card h3 { margin: 0 0 .5rem; font: 700 var(--step-1) var(--font-warm); }
.aff-disclosure { display: block; font-size: .78rem; color: #5c5550; margin-top: .6rem; line-height: 1.45; }

.vp-error { background: #fff; border: 1px solid var(--accent-deep); border-radius: .5rem;
  padding: 1rem 1.25rem; margin: 1rem 0; font-size: .95rem; }

@media (max-width: 480px) {
  .vp { padding-top: 1.5rem; }
  .vp-actions .btn, .vp-actions .btn-quiet, .vp-nav .btn, .vp-nav .btn-quiet { width: 100%; text-align: center; }
  .sheet { padding: 1.25rem; }
}

/* Optional signup — visually separate from the sheet on purpose. */
.vp-signup { margin: 2rem 0 0; padding: 1.25rem; background: #fff;
  border: 1px solid var(--rule); border-radius: .5rem; }
.vp-signup h2 { margin: 0 0 .5rem; font: 700 var(--step-1) var(--font-warm); }
.vp-signup-sep { margin: 0 0 .75rem; }
.vp-signup form { display: grid; gap: .8rem; margin-top: 1rem; }
.vp-signup label[for="vp-email"] { font-weight: 600; font-size: .9rem; }
.vp-signup input[type=email] { width: 100%; padding: .8rem; border: 1px solid var(--rule);
  border-radius: .4rem; font: inherit; background: #fff; color: var(--ink); }
.vp-signup input[type=email]:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.vp-signup .consent { display: flex; gap: .7rem; align-items: flex-start;
  font-size: .88rem; line-height: 1.5; }
.vp-signup .consent input { margin-top: .25rem; width: 1.05rem; height: 1.05rem;
  accent-color: var(--accent); }
.vp-signup-done { margin: 1rem 0 0; font-weight: 600; }
