/* css/encounter-paper.css — Clinical Paper re-skin for the encounter view.
 *
 * All rules in this file are scoped under `body.encounter-active` so they
 * apply only when an encounter is open. No DOM is touched; no JS is touched;
 * no existing CSS file is edited. The cascade order in OphthoScribe.html
 * places this file last, so these rules win specificity ties against the
 * legacy widget/layout CSS where the selectors are equally specific.
 *
 * Historical spec/plan lived under docs/superpowers before archival.
 */

/* ── 1. Encounter body + base typography ─────────────────────────────── */
body.encounter-active #content-appt{
  background:var(--paper);
  font-family:var(--sans-paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
}
body.encounter-active #content-appt *{
  font-variant-numeric:tabular-nums;
}

/* ── 2. Patient banner ───────────────────────────────────────────────── */
body.encounter-active #main-banner{
  background:transparent;
  border:none;
  padding:0 24px 14px;
  margin:14px 0 18px;
  border-bottom:0;
}
body.encounter-active #main-banner .banner-name{
  font-family:var(--serif);
  font-weight:600;
  font-size:28px;
  letter-spacing:-0.022em;
  line-height:1.05;
  color:var(--ink);
  font-optical-sizing:auto;
}
body.encounter-active #main-banner .banner-sub{
  font-family:var(--sans-paper);
  font-weight:400;
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:0.01em;
}
body.encounter-active #main-banner .banner-name.empty{
  color:var(--ink-faint);
  font-style:normal;
}
body.encounter-active #main-banner .bchip-appt{
  background:var(--ink-link-soft);
  color:var(--ink-link);
  border:none;
  font-size:11.5px;
  font-weight:600;
  padding:5px 13px;
  border-radius:999px;
}
body.encounter-active #main-banner .bchip-edit{
  background:transparent;
  color:var(--ink-mute);
  border:1px solid var(--hairline-mid);
}
body.encounter-active #main-banner .bchip-edit:hover{
  color:var(--ink);
  border-color:var(--ink);
}

/* ── 3. General-consult-grid container (4×2 grid, fixed-height rows) ─ */
body.encounter-active .appt-layout{
  overflow:hidden auto;
  padding:0 var(--os-safe-page-pad-x,76px) 28px;
}
body.encounter-active #exam-grid-dev{
  height:auto;
  min-height:0;
}
body.encounter-active .exam-grid.general-consult-grid{
  height:auto;
  min-height:0;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:380px 380px;
  gap:14px;
}

/* ── 4. Card chrome — surface, header, body, footer ─────────────────── */
body.encounter-active .exam-grid.general-consult-grid > .card{
  --widget-chrome:var(--paper-2);
  --widget-border:var(--hairline-mid);
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:10px;
  box-shadow:var(--shadow-paper);
  overflow:hidden;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child{
  background:var(--paper-2);
  border-bottom:1px solid var(--hairline-mid);
  padding:12px 16px;
  min-height:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child > .card-pip{
  display:none;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child > .card-title{
  font-family:var(--serif);
  font-weight:600;
  font-size:16px;
  color:var(--ink);
  letter-spacing:-0.01em;
  flex:1;
  font-optical-sizing:auto;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child button{
  font-family:var(--sans-paper);
  font-size:10.5px;
  font-weight:600;
  padding:3px 9px;
  border-radius:4px;
  cursor:pointer;
  color:var(--ink-mute);
  background:transparent;
  border:1px solid var(--hairline-mid);
  transition:color .15s,border-color .15s;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child button:hover{
  color:var(--ink);
  border-color:var(--ink);
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll{
  flex:1;
  min-height:0;
  overflow-y:auto;
  background:var(--surface,#fff);
}
body.encounter-active .exam-grid.general-consult-grid > .card .card-body{
  padding:14px 16px;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll::-webkit-scrollbar{
  width:8px;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll::-webkit-scrollbar-thumb{
  background:var(--hairline-mid);
  border-radius:4px;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll::-webkit-scrollbar-thumb:hover{
  background:var(--ink-faint);
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll::-webkit-scrollbar-track{
  background:transparent;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer{
  background:var(--paper-2);
  border-top:1px solid var(--hairline-mid);
  min-height:0;
  padding:10px 14px;
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer .footer-active-chip,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer button[data-footer-active]{
  font-family:var(--sans-paper);
  font-size:11px;
  font-weight:600;
  padding:4px 11px;
  border-radius:999px;
  background:var(--surface,#fff);
  color:var(--ink);
  border:1px solid var(--ink);
  cursor:pointer;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer input[type="search"],
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer input.card-search-input,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer input[placeholder*="Search" i]{
  flex:1;
  min-width:0;
  font-family:var(--sans-paper);
  font-size:12px;
  color:var(--ink);
  padding:6px 10px;
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:999px;
  outline:none;
  transition:border-color .15s;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer input[placeholder*="Search" i]:focus{
  border-color:var(--ink);
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer input[placeholder*="Search" i]::placeholder{
  color:var(--ink-faint);
}

/* ── 5. Sub-section subheaders (vitals-subhdr, history-domain-hdr) ─── */
body.encounter-active .card .vitals-subhdr,
body.encounter-active .card .history-domain-hdr{
  font-family:var(--sans-paper);
  font-size:14px;
  font-weight:800;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:#5f5b52;
  padding:10px 0 6px;
  border-bottom:1px solid var(--hairline-faint);
  margin-bottom:10px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:0;
  justify-content:stretch;
  align-items:baseline;
  background:transparent;
  min-height:0;
}
body.encounter-active .card .card-body > .vitals-subhdr:first-child,
body.encounter-active .card .card-body > .history-domain-body > .history-domain-hdr:first-child{
  padding-top:0;
}
body.encounter-active .card .vitals-subhdr > span:first-child{
  font-size:inherit;
  font-weight:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  color:inherit;
}

/* ── 5b. Nested addon-widget subheaders (tone down) ──────────────────
 * Add-on widgets that mount inside #other-exam-addon-host (orthoptics,
 * motility, lids-orbit, gonio, neuro, cycloplegic-refraction, etc.) and
 * inside #ocular-vitals-addon-grid (colour vision, pachymetry) have
 * their own internal .vitals-subhdr labels. Section 5 styles those as
 * card-like headers which makes orthoptics read as "5 sub-widgets" —
 * here we make them lightweight inline labels instead. */
body.encounter-active .card #other-exam-addon-host .vitals-subhdr,
body.encounter-active .card #ocular-vitals-addon-grid .vitals-subhdr{
  font-size:9.5px;
  letter-spacing:0.1em;
  padding:6px 0 2px;
  border-bottom:none;
  margin-bottom:4px;
  color:var(--ink-faint);
}
/* And the addon-detail card wrapper around each add-on widget — strip
 * its card chrome so it lays out as inline content, not a nested card. */
body.encounter-active .card #other-exam-addon-host > .card,
body.encounter-active .card #other-exam-addon-host #addon-detail > .card{
  background:transparent;
  border:none;
  box-shadow:none;
  border-radius:0;
}
body.encounter-active .card #other-exam-addon-host > .card > .card-hdr,
body.encounter-active .card #other-exam-addon-host #addon-detail > .card > .card-hdr{
  background:transparent;
  border-bottom:1px solid var(--hairline-faint);
  padding:6px 0;
}
body.encounter-active .card #other-exam-addon-host .card-body,
body.encounter-active .card #ocular-vitals-addon-grid .card-body{
  padding:6px 0;
}
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.open,
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.compact.open{
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:0!important;
}
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.open::before,
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.compact.open::before{
  content:none!important;
  display:none!important;
}
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.open > .card-hdr{
  border:0!important;
  background:transparent!important;
  padding:0 0 8px!important;
}
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.open > .card-hdr::after{
  content:none!important;
  display:none!important;
}
body.encounter-active .card #other-exam-addon-host #addon-detail .refr-body.open > div:not(.card-hdr){
  padding:0!important;
}

/* ── 6. Sb-block list rows ──────────────────────────────────────────── */
body.encounter-active .card .sb-block{
  border:0;
  padding:0 0 12px;
}
body.encounter-active .card .sb-item{
  font-family:var(--sans-paper);
  font-size:13.5px;
  color:var(--ink);
  padding:4px 0;
  line-height:1.5;
  display:flex;
  gap:10px;
  align-items:baseline;
}
body.encounter-active .card .sb-item > span:nth-child(2){
  min-width:0;
  flex:1;
}
body.encounter-active .card .sb-item-num{
  font-family:var(--mono,'Geist Mono',ui-monospace,monospace);
  font-size:10px;
  color:var(--ink-faint);
  flex:0 0 18px;
}
body.encounter-active .card .sb-item-remove{
  appearance:none;
  background:transparent!important;
  border:0!important;
  color:var(--ink-faint);
  cursor:pointer;
  flex:0 0 auto;
  font-family:var(--sans-paper);
  font-size:14px;
  line-height:1;
  min-height:22px;
  min-width:22px;
  padding:2px;
}
body.encounter-active .card .sb-item-remove:hover,
body.encounter-active .card .sb-item-remove:focus-visible{
  color:var(--accent);
  outline:none;
}
body.encounter-active .card .sb-none{
  font-size:12.5px;
  color:var(--ink-faint);
  font-style:italic;
  padding:6px 0;
}
body.encounter-active .card .sb-none.confirmed{
  color:var(--ink);
  font-style:normal;
}

/* ── 7. Eye-pair rows (anterior/posterior/exam-hdr-row) ─────────────── */
body.encounter-active .card .exam-hdr-row{
  display:grid;
  grid-template-columns:1fr 100px 1fr;
  gap:10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--hairline-faint);
  margin-bottom:6px;
}
/* OD/OS affordances are styled globally as compact inline text. */
body.encounter-active .card #ant-rows > *,
body.encounter-active .card #post-rows > *{
  display:grid;
  grid-template-columns:1fr 100px 1fr;
  align-items:center;
  padding:7px 0;
  border-bottom:1px solid var(--hairline-faint);
  gap:10px;
  min-height:32px;
}
body.encounter-active .card #ant-rows > *:last-child,
body.encounter-active .card #post-rows > *:last-child{
  border-bottom:none;
}

/* ── 8. Method pills (tog-val, tog-pill) + big numerics ─────────────── */
body.encounter-active .card .tog-val,
body.encounter-active .card .tog-pill{
  font-family:var(--sans-paper);
  font-size:10px;
  letter-spacing:0.06em;
  color:var(--ink-mute);
  font-weight:600;
  padding:2px 8px;
  border:1px solid var(--hairline-mid);
  border-radius:4px;
  background:var(--surface,#fff);
  cursor:pointer;
  transition:color .15s,border-color .15s;
}
body.encounter-active .card .tog-val:hover,
body.encounter-active .card .tog-pill:hover{
  color:var(--ink);
  border-color:var(--ink);
}
body.encounter-active .card .stored-input{
  font-family:var(--sans-paper);
  font-size:14px;
  font-weight:600;
  color:var(--ink);
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:4px;
  outline:none;
  padding:3px 6px;
  text-align:center;
  transition:border-color .15s;
}
body.encounter-active .card .stored-input:focus{
  border-color:var(--ink);
  background:#fff;
  box-shadow:none;
}
body.encounter-active .card .stored-input::placeholder{
  color:var(--ink-line);
  font-weight:400;
}
body.encounter-active .card .input-unit{
  font-family:var(--sans-paper);
  font-size:10.5px;
  color:var(--ink-faint);
  font-weight:500;
  letter-spacing:0;
}

/* ── 9. Empty-state placeholders ────────────────────────────────────── */
body.encounter-active .card .empty-state,
body.encounter-active .card .sb-none{
  padding:14px 16px;
  font-family:var(--sans-paper);
  font-size:12.5px;
  color:var(--ink-faint);
  font-style:italic;
  line-height:1.5;
  text-align:center;
  background:var(--paper);
  border:1px dashed var(--hairline-mid);
  border-radius:6px;
  margin:8px 0;
  display:block;
}
body.encounter-active .card .sb-block .sb-none{
  background:transparent;
  border:none;
  padding:6px 0;
  margin:0;
  text-align:left;
}

/* ── 10. HPI textarea + Forms inline-form ───────────────────────────── */
body.encounter-active .card #hpi{
  width:100%;
  min-height:100px;
  resize:vertical;
  font-family:var(--sans-paper);
  font-size:13.5px;
  line-height:1.55;
  color:var(--ink);
  border:1px solid var(--hairline-faint);
  background:var(--paper);
  border-radius:6px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s,background .15s;
}
body.encounter-active .card #hpi:focus{
  border-color:var(--ink);
  background:var(--surface,#fff);
}
body.encounter-active .card #hpi::placeholder{
  color:var(--ink-faint);
  font-style:italic;
}
body.encounter-active .card .hpi-inline-form{
  margin-top:12px;
  border:1px solid var(--hairline-mid);
  background:var(--paper);
  border-radius:6px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
body.encounter-active .card .hpi-form-title-row{
  display:flex;
  align-items:center;
  gap:8px;
}
body.encounter-active .card .hpi-form-title{
  font-family:var(--sans-paper);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink-mute);
  flex:1;
}
body.encounter-active .card .hpi-form-close{
  width:20px;
  height:20px;
  border:1px solid var(--hairline-mid);
  border-radius:999px;
  background:var(--surface,#fff);
  color:var(--ink-faint);
  font-size:11px;
  font-weight:700;
  cursor:pointer;
}
body.encounter-active .card .hpi-form-close:hover{
  border-color:var(--ink);
  color:var(--ink);
}
body.encounter-active .card .hpi-form-check{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11.5px;
  font-weight:500;
  color:var(--ink);
}
body.encounter-active .card .hpi-inline-form input[type="text"],
body.encounter-active .card .hpi-inline-form select{
  height:auto;
  font-size:11.5px !important;
  background:var(--surface,#fff) !important;
  padding:4px 8px !important;
  border:1px solid var(--hairline-mid);
  border-radius:4px;
}

/* ── 11. Refraction history block ───────────────────────────────────── */
body.encounter-active .card .refraction-history-empty{
  background:transparent;
  border:none;
  padding:0;
  margin-bottom:12px;
}
body.encounter-active .card .refraction-history-head,
body.encounter-active .card .refraction-history-row{
  grid-template-columns:48px minmax(74px,1fr) 12px minmax(74px,1fr) 14px minmax(56px,0.8fr);
}
body.encounter-active .card .refraction-history-head span{
  font-family:var(--sans-paper);
  font-size:9px;
  font-weight:600;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-faint);
  text-align:center;
}
body.encounter-active .card .refraction-history-plus,
body.encounter-active .card .refraction-history-axis-prefix{
  font-family:var(--sans-paper);
  font-size:11px;
  color:var(--ink-mute);
  font-weight:500;
}
body.encounter-active .card .refraction-history-field{
  font-family:var(--sans-paper);
  font-size:11.5px;
  font-weight:500;
  color:var(--ink);
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:4px;
  text-align:center;
  outline:none;
  height:26px;
  min-height:26px;
  box-sizing:border-box;
  transition:border-color .15s;
}
body.encounter-active .card .refraction-history-field:focus{
  background:var(--surface,#fff) !important;
  border-color:var(--ink) !important;
  box-shadow:none !important;
  color:var(--ink) !important;
}

/* ── 12. Tools & Calculators tool buttons ───────────────────────────── */
body.encounter-active .card .tools-widget-menu.open{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:0;
  padding:8px;
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:8px;
  box-shadow:var(--shadow-paper);
  position:sticky;
  top:0;
  z-index:4;
}
body.encounter-active .card .tools-widget-menu .addon-btn{
  font-family:var(--sans-paper);
  font-size:11.5px;
  font-weight:500;
  color:var(--ink);
  padding:8px 12px;
  background:var(--paper);
  border:1px solid var(--hairline-mid);
  border-radius:6px;
  cursor:pointer;
  text-align:left;
  transition:border-color .15s,color .15s;
}
body.encounter-active .card .tools-widget-menu .addon-btn:hover{
  border-color:var(--ink);
}
body.encounter-active .card .widget-tool-grid{
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* ── 13. Vitals add-on chips (Ocular Vitals dropdown popover) ────────── */
body.encounter-active .card .ocular-vitals-addon-menu.open{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:8px;
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:8px;
  box-shadow:var(--shadow-paper);
}
body.encounter-active .card .ocular-vitals-addon-menu.open .addon-btn{
  font-family:var(--sans-paper);
  font-size:11px;
  font-weight:500;
  color:var(--ink-mute);
  padding:4px 10px;
  background:var(--paper);
  border:1px solid var(--hairline-mid);
  border-radius:4px;
  cursor:pointer;
  transition:border-color .15s,color .15s,background .15s;
}
body.encounter-active .card .ocular-vitals-addon-menu.open .addon-btn:hover{
  color:var(--ink);
  border-color:var(--ink);
}
body.encounter-active .card .ocular-vitals-addon-menu.open .addon-btn.active{
  color:var(--ink);
  border-color:var(--ink);
  background:var(--paper-2);
}

/* ── 13b. Aniso panel ───────────────────────────────────────────────── */
body.encounter-active .card .ocular-vitals-aniso-panel{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--hairline-faint);
}
body.encounter-active .card .ocular-vitals-aniso-panel .field-label{
  font-family:var(--sans-paper);
  font-size:9.5px;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:3px;
}
body.encounter-active .card .ocular-vitals-mm-input{
  width:56px;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section{
  width:100%;
  min-width:0;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-control-strip{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 8px;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-inline-title{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:10px;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-inline-title > span:first-child{
  flex:0 0 auto;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-inline-actions{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  flex:0 1 auto;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-field-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-eye-row{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-height:30px;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section-iop .ocular-vitals-eye-row{
  grid-template-columns:48px minmax(0,1fr);
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-field,
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-time-field{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:6px;
  min-width:0;
  margin:0;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-field > span,
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-time-field > span{
  font-family:var(--sans-paper,var(--font));
  font-size:10px;
  font-weight:800;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-faint,var(--text-faint));
  white-space:nowrap;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .input-row{
  margin:0!important;
  min-width:0;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] input.stored-input{
  width:100%!important;
  min-width:0!important;
  height:26px!important;
  flex:1 1 auto!important;
  text-align:center;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .tog-val{
  min-height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px!important;
  border-radius:4px!important;
  background:transparent!important;
  border:1px solid var(--hairline-mid)!important;
  color:var(--ink,var(--text))!important;
  box-shadow:none!important;
  font-family:var(--sans-paper,var(--font));
  font-size:11px!important;
  font-weight:700!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-inline-title .tog-val,
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-inline-title .vital-na-btn{
  min-height:24px;
  height:24px!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .vital-na-btn{
  height:26px!important;
  border-radius:4px!important;
  border:1px solid var(--ink-link,var(--blue,#d97757))!important;
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
  color:var(--ink-link,var(--blue,#d97757))!important;
  font-size:10px!important;
  font-weight:800!important;
  padding:0 8px!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .vital-na-btn.active{
  background:var(--ink-link,var(--blue,#d97757))!important;
  color:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body{
  padding:0 var(--widget-section-pad-x,16px) 14px!important;
  margin:0 0 18px!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body > .vitals-subhdr{
  margin-bottom:10px!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body > .ocular-vitals-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  padding:0!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section{
  position:relative;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  width:100%;
  min-width:0;
  margin:0!important;
  padding:0 12px!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section + .ocular-vitals-section{
  border-left:1px solid var(--hairline-faint)!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:1px;
  background:var(--hairline-faint);
  pointer-events:none;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-addon-region{
  position:absolute!important;
  inset:0 auto auto 0;
  width:0!important;
  height:0!important;
  overflow:visible!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-addon-grid{
  grid-column:1 / -1;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-pupils{
  grid-column:auto!important;
  justify-self:stretch!important;
  align-items:stretch!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-pupils.vitals-subhdr,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-pupils .vitals-subhdr.ocular-vitals-measure-title{
  grid-template-columns:minmax(0,1fr)!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-pupils .ocular-vitals-eye-spacer{
  display:none!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .vitals-subhdr.ocular-vitals-inline-title{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap;
  gap:8px!important;
  margin:0 0 6px!important;
  padding:0!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .vitals-subhdr.ocular-vitals-measure-title{
  display:flex!important;
  align-items:start!important;
  justify-content:center!important;
  width:min(100%,230px);
  margin:0 0 5px!important;
  padding:0!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .vitals-subhdr.ocular-vitals-measure-title > .ocular-vitals-eye-spacer{
  display:none!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-eye-spacer{
  display:block;
  width:28px;
  min-width:28px;
  height:1px;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-title-stack{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-width:0;
  text-align:center;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-title-text{
  font-family:var(--sans-paper,var(--font));
  font-size:12px;
  font-weight:800;
  line-height:1.15;
  letter-spacing:0.07em;
  text-transform:inherit;
  color:inherit;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-title-actions{
  justify-content:center;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-inline-actions{
  display:inline-flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-column-head{
  display:grid;
  grid-template-columns:28px minmax(0,1fr) minmax(0,1fr);
  gap:3px;
  align-items:center;
  width:min(100%,230px);
  margin:0 0 2px;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-column-head > span:not(.ocular-vitals-eye-spacer){
  justify-self:center;
  font-family:var(--sans-paper,var(--font));
  font-size:10.5px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-faint,var(--text-faint));
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-pupil-controls{
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  justify-content:center!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-field-list{
  display:flex;
  flex-direction:column;
  gap:4px;
  width:min(100%,230px);
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-eye-row{
  display:grid;
  grid-template-columns:28px minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:3px;
  min-height:26px;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-eye-row{
  position:relative;
  display:flex;
  justify-content:center;
  width:min(100%,230px);
  grid-template-columns:none;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-eye-row .eye-tag{
  position:absolute;
  right:calc(50% + 34px);
  top:50%;
  transform:translateY(-50%);
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-pressure-field{
  width:54px;
  flex:0 0 54px;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-pressure-field .input-row{
  position:relative;
  width:54px;
  flex:0 0 54px;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-pressure-field input.stored-input{
  width:54px!important;
  flex:0 0 54px!important;
  text-align:center!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-pressure-field .input-unit{
  position:absolute;
  left:calc(100% + 4px);
  top:50%;
  transform:translateY(-50%);
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-iop-time-row{
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(100%,230px);
  min-height:16px;
  margin-top:0;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-iop-time-row .ocular-vitals-eye-spacer{
  display:none!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-field,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-time-field{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  min-width:0;
  margin:0;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-field > span,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-time-field > span{
  font-size:10.5px!important;
  font-weight:650!important;
  letter-spacing:0.03em!important;
  text-transform:none!important;
  color:var(--ink-faint,var(--text-faint))!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-vision .ocular-vitals-field > span,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-section-iop .ocular-vitals-field > span{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .input-row{
  justify-content:center;
  gap:0!important;
  margin:0!important;
  min-width:0;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .input-unit{
  font-family:var(--sans-paper,var(--font));
  font-size:12px!important;
  font-weight:550!important;
  line-height:1.2!important;
  color:var(--ink-faint,var(--text-faint))!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body input.stored-input{
  width:auto!important;
  min-width:28px!important;
  max-width:54px!important;
  height:22px!important;
  flex:0 1 54px!important;
  padding:0 2px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--ink,var(--text))!important;
  font-family:var(--sans-paper,var(--font));
  font-size:13px!important;
  font-weight:650!important;
  line-height:1.25!important;
  text-align:left;
  cursor:text;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body input.stored-input::placeholder{
  color:var(--ink-faint,var(--text-faint))!important;
  opacity:0.68;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body input.stored-input:focus{
  border-bottom:1px solid var(--ink-link,var(--blue,#d97757))!important;
  outline:none!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-pressure-field{
  grid-template-columns:minmax(0,1fr);
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-iop-time-row .ocular-vitals-time-field{
  justify-self:center;
  width:min(100%,120px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .ocular-vitals-iop-time-row .ocular-vitals-time-field input{
  width:58px!important;
  flex:0 0 58px!important;
  color:var(--ink,var(--text))!important;
  font-size:10.5px!important;
  font-weight:650!important;
  letter-spacing:0.03em!important;
  text-align:center;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .tog-val{
  min-height:0!important;
  padding:0 2px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--ink-link,var(--blue,#d97757))!important;
  font-size:11px!important;
  font-weight:750!important;
  line-height:1.2!important;
  cursor:pointer;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] .eye-exam-vitals-body .tog-val:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body #ortho-cross-wrap{
  width:min(100%,360px)!important;
  height:230px!important;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-zone-inline{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-width:0;
  padding:0!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-zone-dash{
  width:32px;
  height:24px;
  border:0;
  background:transparent;
  color:var(--ink-faint,var(--text-faint));
  font-family:var(--sans-paper,var(--font));
  font-size:15px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-zone-dash:hover{
  color:var(--ink-link,var(--blue,#d97757));
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-zone-label-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:0;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-zone-label-row > span{
  font-family:var(--sans-paper,var(--font));
  font-size:9px;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink-mute,var(--text-muted));
  white-space:nowrap;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-reset-btn{
  height:18px;
  padding:0 5px;
  border:0;
  background:transparent;
  color:var(--ink-link,var(--blue,#d97757));
  font-family:var(--sans-paper,var(--font));
  font-size:9px;
  font-weight:800;
  cursor:pointer;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-axis-row{
  grid-template-columns:30px 34px 48px 42px 10px;
  gap:5px;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-axis-toggle{
  width:30px;
  height:30px;
  border-radius:7px;
  background:var(--ink-link,var(--blue,#d97757));
  border-color:var(--ink-link,var(--blue,#d97757));
  color:var(--os-component-content-bg,var(--surface,#faf9f5));
  font-family:var(--sans-paper,var(--font));
  font-size:13px;
  font-weight:800;
  box-shadow:none;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-mini-select,
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-num-input{
  height:30px;
  border:0;
  border-bottom:2px solid var(--hairline-mid,var(--border-md));
  border-radius:0;
  background:transparent;
  color:var(--ink,var(--text));
  font-family:var(--sans-paper,var(--font));
  font-size:15px;
  font-weight:800;
  padding:0 2px;
  box-shadow:none;
  outline:none;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-mini-select{
  appearance:auto;
  text-align:center;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-num-input{
  width:42px;
  text-align:center;
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-mini-select:focus,
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-num-input:focus{
  border-bottom-color:var(--ink-link,var(--blue,#d97757));
}
body.encounter-active .card[data-widget-card="other-examination"] #orthoptics-body .ortho-delta{
  font-size:14px;
  font-weight:800;
  color:var(--ink-mute,var(--text-muted));
}

/* ── 14. Assessment & Plan textareas + tabs + billing chips ─────────── */
body.encounter-active .card.assessment-card .assessment-plan-domain{
  padding:8px 0 14px;
}
body.encounter-active .card.assessment-card .assessment-plan-domain > .vitals-subhdr{
  border-bottom:0;
}
body.encounter-active .card.assessment-card > .card-scroll{
  display:flex;
  flex-direction:column;
  min-height:0;
}
body.encounter-active .card.assessment-card .assessment-plan-domain{
  display:flex;
  flex-direction:column;
  min-height:0;
}
body.encounter-active .card.assessment-card .assessment-plan-domain-diagnosis{
  flex:0 0 auto;
}
body.encounter-active .card.assessment-card .assessment-plan-domain-assessment{
  flex:0 0 auto;
}
body.encounter-active .card.assessment-card .assessment-plan-domain-plan{
  flex:1 1 auto;
}
body.encounter-active .card.assessment-card .assessment-plan-free-text{
  width:100%;
  box-sizing:border-box;
  font-family:var(--sans-paper);
  font-size:13px;
  line-height:1.55;
  color:#1A2230!important;
  caret-color:var(--ink-link,var(--blue,#d97757));
  border:1px solid transparent!important;
  background:transparent!important;
  border-radius:6px;
  padding:8px 10px;
  outline:none;
  transition:border-color .15s,background .15s;
}
body.encounter-active .card.assessment-card .assessment-plan-domain:hover .assessment-plan-free-text,
body.encounter-active .card.assessment-card .assessment-plan-free-text:hover{
  border-color:var(--hairline-faint)!important;
  background:var(--paper)!important;
}
body.encounter-active .card.assessment-card .assessment-plan-free-text:focus{
  border-color:var(--ink)!important;
  background:var(--surface,#fff)!important;
}
body.encounter-active .card.assessment-card .assessment-plan-diagnosis-input{
  height:34px;
  min-height:34px;
}
/* 9.5: diagnosis-keyed template auto-suggest chips (inline, beneath the dx field) */
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin:6px 0 2px;
  padding:0 10px;
}
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest[hidden]{
  display:none;
}
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest-label{
  font-family:var(--sans-paper);
  font-size:11px;
  color:var(--ink-soft,#5a6472);
}
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest-chip{
  font-family:var(--sans-paper);
  font-size:12px;
  line-height:1.2;
  color:var(--ink-link,var(--blue,#d97757));
  background:var(--paper,#fff);
  border:1px solid var(--hairline-faint,#d6dae0);
  border-radius:12px;
  padding:3px 10px;
  cursor:pointer;
  transition:border-color .15s,background .15s;
}
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest-chip:hover,
body.encounter-active .card.assessment-card .assessment-plan-dx-suggest-chip:focus{
  border-color:var(--ink,#1A2230);
  background:var(--surface,#fff);
  outline:none;
}
body.encounter-active .card.assessment-card .assessment-plan-assessment-input{
  min-height:84px;
  resize:vertical;
}
body.encounter-active .card.assessment-card .assessment-plan-plan-input{
  flex:1 1 auto;
  min-height:160px;
  resize:vertical;
}
body.encounter-active .card.assessment-card textarea{
  width:100%;
  min-height:80px;
  resize:vertical;
  font-family:var(--sans-paper);
  font-size:13px;
  line-height:1.55;
  color:var(--ink);
  border:1px solid var(--hairline-faint);
  background:var(--paper);
  border-radius:6px;
  padding:10px 12px;
  outline:none;
  transition:border-color .15s,background .15s;
}
body.encounter-active .card.assessment-card textarea:focus{
  border-color:var(--ink);
  background:var(--surface,#fff);
}
body.encounter-active .card.assessment-card textarea::placeholder{
  color:var(--ink-faint);
  font-style:italic;
}
body.encounter-active .card.assessment-card .ap-tabs,
body.encounter-active .card.assessment-card .template-tabs{
  display:flex;
  gap:0;
  border-bottom:1px solid var(--hairline-mid);
  margin-bottom:10px;
}
body.encounter-active .card.assessment-card .ap-tabs > *,
body.encounter-active .card.assessment-card .template-tabs > *{
  padding:5px 13px;
  font-family:var(--sans-paper);
  font-size:11.5px;
  font-weight:600;
  color:var(--ink-mute);
  cursor:pointer;
  border-bottom:2px solid transparent;
  margin-bottom:-1px;
  background:transparent;
  border-top:none;
  border-left:none;
  border-right:none;
  transition:color .15s,border-color .15s;
}
body.encounter-active .card.assessment-card .ap-tabs > *.active,
body.encounter-active .card.assessment-card .template-tabs > *.active{
  color:var(--ink);
  border-bottom-color:var(--ink);
}

/* ── 15. Directory chrome — icon | search input | folder (right) ─────
 *
 * Footer layout: [icon] [search input] [folder].
 * Multi-domain cards render a <select> as the folder (shows subheadings
 * as dropdown options).
 * Single-domain cards (hpi, trends, other-examination) get a static
 * folder chip via ::after pseudo-element (section 15b below). */
body.encounter-active .card .widget-directory{
  flex:0 1 300px;
  display:flex;
  align-items:center;
  gap:0;
  min-width:210px;
  position:relative;
}
body.encounter-active .card .widget-directory-icon{
  display:none!important;
}
body.encounter-active .card .widget-directory-icon{
  order:0;
  flex:0 0 32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:8px 0 0 8px;
  background:var(--ink-link,var(--blue,#d97757));
  border:1px solid var(--ink-link,var(--blue,#d97757));
  color:var(--os-component-content-bg,var(--surface,#faf9f5));
  box-shadow:none;
}
body.encounter-active .card .widget-directory-icon svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body.encounter-active .card .widget-directory-input{
  order:1;
  flex:1;
  min-width:0;
  font-family:var(--sans-paper);
  font-size:12px;
  color:var(--ink);
  padding:6px 10px;
  background:var(--surface,#fff);
  border:1px solid var(--ink-link,var(--blue,#d97757));
  border-radius:8px;
  outline:none;
  transition:border-color .15s;
}
body.encounter-active .card .widget-directory-input:focus{
  border-color:var(--ink);
}
body.encounter-active .card .widget-directory-input::placeholder{
  color:var(--ink-faint);
}
/* Directory results popup (appended when search runs) — unchanged from
 * the prior commit, keep as-is. */
body.encounter-active .card .widget-directory-results{
  display:none;
  position:absolute;
  left:0;
  right:0;
  top:40px;
  bottom:auto;
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:6px;
  box-shadow:var(--shadow-paper);
  padding:6px;
  z-index:50;
  min-width:240px;
  max-width:360px;
  max-height:280px;
  overflow-y:auto;
}
body.encounter-active .card .widget-directory-results.open{
  display:block;
}
body.encounter-active .card .widget-directory-result{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:6px 10px;
  border:none;
  background:transparent;
  border-radius:4px;
  cursor:pointer;
  text-align:left;
  font-family:var(--sans-paper);
  transition:background .12s;
}
body.encounter-active .card .widget-directory-result:hover{
  background:var(--paper-2);
}
body.encounter-active .card .widget-directory-result-main{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
body.encounter-active .card .widget-directory-result-label{
  font-size:12.5px;
  font-weight:500;
  color:var(--ink);
}
body.encounter-active .card .widget-directory-result-domain{
  font-family:var(--mono,'Geist Mono',ui-monospace,monospace);
  font-size:9.5px;
  color:var(--ink-faint);
  letter-spacing:0;
  text-transform:none;
}
body.encounter-active .card .widget-directory-result-use{
  font-size:10.5px;
  font-weight:500;
  color:var(--muted);
  line-height:1.25;
}
body.encounter-active .card .widget-directory-source{
  font-size:9px;
  color:var(--ink-faint);
  text-transform:none;
  letter-spacing:0.1em;
  font-weight:600;
  max-width:132px;
  white-space:normal;
  text-align:center;
  line-height:1.15;
}
body.encounter-active .card .widget-directory-empty{
  padding:8px 10px;
  font-size:11.5px;
  color:var(--ink-faint);
  font-style:italic;
  text-align:center;
}

/* ── 15c. Encounter widget chrome — align with workspace queue widgets ─ */
body.encounter-active #content-appt{
  background:var(--os-canvas,var(--bg,#f0eee6));
  flex-direction:column;
}
body.encounter-active .topbar-pt{
  display:none!important;
}
.encounter-context-strip{
  display:none;
}
body.encounter-active .encounter-context-strip{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:46px;
  padding:10px 24px;
  background:var(--os-canvas,var(--bg,#f0eee6));
  color:var(--ink,var(--text));
  font-family:var(--sans-paper,var(--font));
  border-bottom:1px solid var(--hairline-faint,rgba(0,0,0,0.06));
  box-sizing:border-box;
}
.encounter-context-name{
  font-family:var(--serif,var(--display));
  font-size:18px;
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--ink,var(--text));
}
.encounter-context-demo,
.encounter-context-reason{
  font-size:13px;
  line-height:1.2;
  color:var(--ink-mute,var(--text-muted));
}
.encounter-context-demo::before,
.encounter-context-reason::before{
  content:"-";
  margin-right:8px;
  color:var(--ink-faint,var(--text-faint));
}
.encounter-context-reason:empty,
.encounter-context-demo:empty{
  display:none;
}
.encounter-context-appt{
  margin-left:2px;
}
body.encounter-active .exam-grid.general-consult-grid > .card{
  --widget-section-pad-x:16px;
  --widget-section-pad-y:var(--widget-section-pad-x);
  --widget-subheading-pad-y:0px;
  --widget-subheading-gap-y:6px;
  --widget-chrome:var(--os-component-content-bg,var(--surface,#faf9f5));
  --widget-border:var(--os-component-border,var(--hairline-mid,#d9d3c4));
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
  border:1px solid var(--os-component-border,var(--hairline-mid,#d9d3c4))!important;
  border-radius:10px!important;
  box-shadow:var(--shadow-paper,0 1px 0 rgba(0,0,0,0.02),0 10px 22px -16px rgba(0,0,0,0.10))!important;
  color:var(--ink,var(--text));
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child{
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
  border-bottom:1px solid var(--hairline-faint,rgba(0,0,0,0.06))!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:8px!important;
  padding:12px 14px!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child > .card-title{
  font-family:var(--serif,var(--display))!important;
  font-size:18px!important;
  font-weight:600!important;
  letter-spacing:-0.01em!important;
  line-height:1.2!important;
  color:var(--ink,var(--text))!important;
  text-transform:none!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-scroll{
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card .card-body{
  padding:14px 16px!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer{
  min-height:38px!important;
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
  border-top:1px solid var(--hairline-faint,rgba(0,0,0,0.06))!important;
  padding:8px 14px!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-footer:empty{
  display:none!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-add-btn,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-download-btn,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-na-btn,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .assessment-ocular-conditions-control,
body.encounter-active .exam-grid.general-consult-grid > .card .ap-section-hdr .ap-control-btn{
  min-width:28px!important;
  height:28px!important;
  padding:0 10px!important;
  border-radius:8px!important;
  border:1px solid var(--ink-link,var(--blue,#d97757))!important;
  background:var(--ink-link-soft,var(--blue-soft,#f4e5dc))!important;
  color:var(--ink-link,var(--blue,#d97757))!important;
  font-family:var(--sans-paper,var(--font))!important;
  font-size:11px!important;
  font-weight:700!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-download-btn,
body.encounter-active .exam-grid.general-consult-grid > .card .ap-section-hdr .widget-download-btn{
  width:28px!important;
  padding:0!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-add-btn,
body.encounter-active .exam-grid.general-consult-grid > .card .ap-section-hdr .widget-add-btn{
  width:28px!important;
  padding:0!important;
  font-size:16px!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .widget-na-btn.active,
body.encounter-active .exam-grid.general-consult-grid > .card > .card-hdr:first-child .assessment-ocular-conditions-control[aria-expanded="true"],
body.encounter-active .exam-grid.general-consult-grid > .card .ap-section-hdr .ap-control-btn[aria-expanded="true"]{
  background:var(--ink-link,var(--blue,#d97757))!important;
  color:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
}
body.encounter-active .card > .card-hdr .widget-directory{
  flex:0 1 240px;
  width:auto;
  min-width:0;
  height:32px;
  margin:0;
  padding:0;
  border-top:0;
  box-sizing:border-box;
}
body.encounter-active .card .widget-directory-input{
  height:24px!important;
  padding:3px 8px!important;
  border-color:var(--ink-link,var(--blue,#d97757))!important;
  background:var(--paper-2,var(--gray-100,#f0efed))!important;
  color:var(--ink-mute,var(--text-muted))!important;
  border-radius:8px!important;
}
body.encounter-active .card .widget-directory-input:focus{
  border-color:var(--ink-link,var(--blue,#d97757))!important;
  box-shadow:none!important;
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
}
body.encounter-active .card .widget-subheading{
  min-height:0!important;
  margin:0 0 var(--widget-subheading-gap-y,6px)!important;
  padding:var(--widget-subheading-pad-y,0) 0!important;
  border-bottom:0!important;
  font-family:var(--sans-paper,var(--font))!important;
  font-size:14px!important;
  font-weight:800!important;
  letter-spacing:0.06em!important;
  color:#5f5b52!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
body.encounter-active .card .widget-subheading > span:first-child{
  min-width:0;
  flex:0 1 auto;
  color:#5f5b52!important;
}
body.encounter-active .card .widget-subheading > .widget-directory{
  flex:0 0 54%;
  width:54%;
  max-width:54%;
  min-width:0;
  height:24px;
  margin:0;
  padding:0;
  border-top:0;
  box-sizing:border-box;
}
body.encounter-active .card .widget-subheading .widget-directory-input{
  font-size:12px!important;
  font-weight:600!important;
}
body.encounter-active .card .widget-section{
  margin:0 0 18px!important;
  padding:var(--widget-section-pad-y,0) var(--widget-section-pad-x,16px)!important;
}
body.encounter-active .card .widget-section-body{
  margin:0!important;
  padding:0!important;
}
body.encounter-active .card .assessment-plan-domain,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] > .card-scroll > .card-body{
  margin:0 0 18px!important;
  padding:var(--widget-section-pad-y,0) var(--widget-section-pad-x,16px)!important;
}
body.encounter-active .card .history-domain-body{
  margin:0!important;
  padding:0!important;
}
body.encounter-active .card[data-widget-card="hpi"] > .card-scroll > .card-body{
  padding:0!important;
}
body.encounter-active .card .history-domain{
  margin:0 0 18px!important;
}
body.encounter-active .card .ocular-history-top-row{
  margin:0 0 18px!important;
}
body.encounter-active .card .ocular-history-top-row > .history-domain{
  margin:0!important;
}
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] > .card-scroll > .card-body:first-child{
  margin-top:14px!important;
}
body.encounter-active .card .history-domain:last-child,
body.encounter-active .card .assessment-plan-domain:last-child,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] > .card-scroll > .card-body:last-child{
  margin-bottom:0!important;
}
body.encounter-active .card .card-body > .vitals-subhdr:not(:first-child),
body.encounter-active .card .history-domain + .history-domain,
body.encounter-active .card .assessment-plan-domain + .assessment-plan-domain,
body.encounter-active .card[data-widget-card="anterior-posterior-segment"] > .card-scroll > .card-body + .card-body{
  margin-top:18px!important;
}
body.encounter-active .card .ocular-history-top-row > .history-domain + .history-domain{
  margin-top:0!important;
}
body.encounter-active .card .history-domain [id$="-display"],
body.encounter-active .card .history-domain [id$="-inputs"],
body.encounter-active .card .hpi-widget-section .widget-section-body,
body.encounter-active .card #inv-rows,
body.encounter-active .card #body-tests-list,
body.encounter-active .card #ant-rows,
body.encounter-active .card #post-rows,
body.encounter-active .card .assessment-plan-domain{
  min-height:54px;
}
body.encounter-active .card .hpi-widget-section{
  padding-top:6px!important;
}
body.encounter-active .card .history-domain-body,
body.encounter-active .card .hpi-inline-form,
body.encounter-active .card .widget-tool-card,
body.encounter-active .card #inv-rows:empty,
body.encounter-active .card #body-tests-list:empty,
body.encounter-active .card .assessment-plan-domain{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.encounter-active .card .sb-item,
body.encounter-active .card #ant-rows > *,
body.encounter-active .card #post-rows > *{
  background:transparent!important;
  border-color:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.encounter-active .card .assessment-plan-domain:has(> .vitals-subhdr:only-child)::after,
body.encounter-active .card #inv-rows:empty::after,
body.encounter-active .card #body-tests-list:empty::after{
  content:""!important;
  display:block!important;
  min-height:42px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
}
body.encounter-active .encounter-subtab-placeholder{
  background:var(--os-canvas,var(--bg,#f0eee6));
}
.encounter-note-preview{
  max-width:1180px;
  margin:0 auto;
  color:var(--ink,var(--text));
  font-family:var(--sans-paper,var(--font));
}
.encounter-note-preview-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:20px 22px 18px;
  background:var(--os-component-content-bg,var(--surface,#faf9f5));
  border:1px solid var(--os-component-border,var(--hairline-mid,#d9d3c4));
  border-bottom:1px solid var(--hairline-faint,rgba(0,0,0,0.06));
  border-radius:10px 10px 0 0;
  box-shadow:var(--shadow-paper,0 1px 0 rgba(0,0,0,0.02),0 10px 22px -16px rgba(0,0,0,0.10));
}
.encounter-note-preview-head h2{
  margin:0 0 5px;
  font-family:var(--serif,var(--display));
  font-size:20px;
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--ink,var(--text));
}
.encounter-note-preview-head p{
  margin:0;
  max-width:520px;
  font-size:13px;
  line-height:1.45;
  color:var(--ink-mute,var(--text-muted));
}
.encounter-note-preview-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.encounter-note-preview-actions select{
  height:30px;
  min-width:160px;
  border:1px solid var(--hairline-faint,rgba(0,0,0,0.06));
  border-radius:8px;
  background:var(--paper-2,var(--gray-100,#f0efed));
  color:var(--ink,var(--text));
  font-family:var(--sans-paper,var(--font));
  font-size:12px;
  font-weight:700;
  padding:4px 10px;
}
.encounter-note-preview-meta{
  display:grid;
  grid-template-columns:repeat(5,minmax(120px,1fr));
  gap:8px;
  width:100%;
}
.encounter-note-preview-meta label{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  font-size:11px;
  font-weight:700;
  color:var(--ink-mute,var(--text-muted));
}
.encounter-note-preview-meta input{
  min-width:0;
  height:30px;
  border:1px solid var(--hairline-faint,rgba(0,0,0,0.06));
  border-radius:8px;
  background:var(--paper-2,var(--gray-100,#f0efed));
  color:var(--ink,var(--text));
  font-family:var(--sans-paper,var(--font));
  font-size:12px;
  padding:4px 8px;
}
.encounter-note-preview-body{
  min-height:560px;
  padding:0;
  background:var(--os-component-content-bg,var(--surface,#faf9f5));
  border:1px solid var(--os-component-border,var(--hairline-mid,#d9d3c4));
  border-top:0;
  border-radius:0 0 10px 10px;
  box-shadow:var(--shadow-paper,0 1px 0 rgba(0,0,0,0.02),0 10px 22px -16px rgba(0,0,0,0.10));
  overflow:hidden;
}
.encounter-note-preview-editor.note-textarea{
  min-height:560px;
  padding:26px 34px!important;
  background:var(--os-component-content-bg,var(--surface,#faf9f5))!important;
  color:var(--ink,var(--text))!important;
  border:0!important;
  box-shadow:none!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:13px!important;
  line-height:1.75!important;
}
.encounter-note-preview-editor{
  min-height:560px;
  padding:30px 20px 42px;
  background:var(--os-component-content-bg,var(--surface,#faf9f5));
}
.os-note-preview{
  max-width:760px;
  margin:0 auto;
  background:#fff;
  color:#111;
  border:1px solid #d6d6d6;
  border-radius:var(--os-radius-md,7px);
  box-shadow:0 1px 0 rgba(255,255,255,0.5) inset,0 20px 40px -28px rgba(0,0,0,0.18);
  padding:42px 56px;
  font-family:var(--os-font-document,'Newsreader',Georgia,serif);
  font-size:14.5px;
  line-height:1.6;
  box-sizing:border-box;
}
.os-note-preview__meta{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  margin:0 0 18px;
  color:#111;
  font-family:var(--os-font-sans,Inter,system-ui,sans-serif);
  font-size:12px;
  line-height:1.5;
}
.os-note-preview__meta-main{
  min-width:0;
}
.os-note-preview__meta-date{
  flex:0 0 auto;
  text-align:right;
  white-space:nowrap;
}
.os-note-preview__meta-sep{
  margin:0 6px;
  opacity:.5;
}
.os-note-preview h2{
  margin:0 0 8px;
  padding-bottom:6px;
  border-bottom:1px solid #d6d6d6;
  color:inherit;
  font-family:inherit;
  font-size:19px;
  font-weight:600;
  letter-spacing:-0.01em;
  line-height:1.2;
}
.os-note-preview__section{
  margin:0 0 24px;
}
.os-note-preview__section:first-of-type h2,
.os-note-preview h2:first-of-type{
  margin-top:0;
}
.os-note-preview p{
  margin:0 0 10px;
}
.os-note-preview__section p:last-child{
  margin-bottom:0;
}
.os-note-preview__placeholder{
  color:#111;
  font-style:normal;
}
/* A&P card §4.2: the assessment margin block — the clinician's free-text
   assessment rendered directly beneath the diagnosis lines as one indented,
   lighter accent block (doctor's margin notes). display:block keeps its own
   line + preserves the '\n' break in innerText re-reads; the literal '\t'
   indent lives in the plain-text contract, the visual indent lives here. */
.os-note-preview__assessment-note{
  display:block;
  margin-top:4px;
  padding-left:1.6em;
  color:var(--os-document-muted-text,var(--os-ink-muted,#7a6d5c));
  font-style:italic;
}
.os-note-preview__section--signoff{
  margin-top:26px;
  margin-bottom:0;
}
.os-note-preview__signoff-label{
  margin:0 0 26px;
  font-size:16px;
  line-height:1.5;
}
.os-note-preview__signature-space{
  min-height:66px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.os-note-preview__signature-name{
  color:#111;
  font-family:var(--os-font-document,'Newsreader',Georgia,serif);
  font-size:16px;
  font-weight:600;
  line-height:1.45;
}
.os-note-preview__signature-title{
  color:var(--os-document-muted-text,var(--os-ink-muted,#7a6d5c));
  font-family:var(--os-font-sans,Inter,system-ui,sans-serif);
  font-size:12px;
  font-weight:500;
  line-height:1.25;
}
.os-note-preview-paper{
  min-height:420px;
}
.os-note-preview-paper .os-note-preview{
  max-width:820px;
}
.os-note-preview-json{
  white-space:pre-wrap;
  overflow:auto;
  max-height:560px;
  background:var(--os-enc-code-bg,#1f2422)!important;
  color:var(--os-enc-code-text,#f7efe3)!important;
  border-radius:6px;
  padding:16px;
  font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (max-width:900px){
  body.encounter-active .encounter-context-strip,
  .encounter-note-preview-head{
    flex-direction:column;
    align-items:stretch;
  }
  .encounter-note-preview-actions{
    justify-content:flex-start;
  }
  .encounter-note-preview-meta{
    grid-template-columns:1fr;
  }
  .os-note-preview{
    padding:30px 28px;
  }
}

/* ── 16. Topbar + Day Sheet — Paper aesthetic (un-scoped, applies app-wide) ─
 *
 * The topbar/banner and Day Sheet view should match the Clinical Paper
 * aesthetic established for the encounter view. These rules are NOT scoped
 * under body.encounter-active because they apply outside the encounter too.
 * ─────────────────────────────────────────────────────────────────────── */

/* ── 16a. Topbar shell + strip ───────────────────────────────────────── */
/* Note: widgets.css uses !important on the legacy navy gradient, so the
 * paper repaint must also use !important to win. Same pattern for the
 * tabs-v2 strip and the .logo-icon chip below. */
.topbar{
  background:var(--paper-2)!important;
  background-image:none!important;
  border-bottom:1px solid var(--hairline-mid);
  box-shadow:none!important;
}
.topbar::after{
  /* The legacy navy underline gradient looks wrong on cream — hide it. */
  display:none!important;
}
.topbar-strip{
  /* height/padding unchanged from layout.css */
  background:transparent;
}
.tb-div{
  background:var(--hairline-mid)!important;
}

/* Logo — cream chip + ink iris.
 * Scoped under .topbar so the login screen's .login-logo .logo-icon (navy
 * gradient on the auth page) is unaffected. */
.topbar .logo .logo-icon{
  background:var(--paper)!important;
  background-image:none!important;
  border:1px solid var(--hairline-mid)!important;
  box-shadow:none!important;
  color:var(--ink)!important;
  width:36px!important;
  height:36px!important;
}
/* Hide the conic iris decoration legacy adds via ::before/::after on the
 * topbar logo — it was tuned for the dark gradient chip. */
.topbar .logo .logo-icon::before,
.topbar .logo .logo-icon::after{
  display:none!important;
}
/* Inline logo SVG uses currentColor; keep it inked for the paper chip. */
.topbar .logo-icon svg{ color:var(--ink)!important;width:25px!important;height:25px!important; }
.topbar .logo-icon svg path{ stroke:currentColor!important; }
.topbar .logo-icon svg circle{ stroke:currentColor!important; }
.topbar .logo-icon svg circle[fill="currentColor"]{ fill:currentColor!important;stroke:none!important; }
.topbar .logo-icon svg circle:last-of-type{ fill:rgba(255,255,255,0.72)!important;stroke:none!important; }

/* Logo wordmark — re-ink (legacy uses background-clip:text white gradient) */
.topbar .logo-name{
  font-family:var(--serif)!important;
  font-weight:600!important;
  font-size:22px!important;
  color:var(--ink)!important;
  background:none!important;
  -webkit-text-fill-color:var(--ink)!important;
  letter-spacing:-0.005em;
}
.topbar .logo-name em{
  font-style:normal;
  color:var(--ink-faint)!important;
  -webkit-text-fill-color:var(--ink-faint)!important;
}

/* Primary tab buttons in the strip */
.topbar .tab-btn{
  font-family:var(--sans-paper);
  font-size:12.5px;
  font-weight:500;
  color:var(--ink-mute);
  background:transparent;
  transition:color var(--t-fast,0.13s) var(--ease,ease),border-color var(--t-fast,0.13s) var(--ease,ease);
  letter-spacing:0.005em;
}
.topbar .tab-btn:hover{
  color:var(--ink);
  background:transparent;
}
.topbar .tab-btn.active{
  color:var(--ink)!important;
  background:transparent!important;
  background-image:none!important;
  border-bottom-color:var(--ink)!important;
  /* widgets.css line 1597 adds an inset blue 2px underline — neutralize */
  box-shadow:none!important;
}

/* Pill buttons in the topbar (Logout, etc.) */
.topbar .tbtn{
  font-family:var(--sans-paper);
  font-size:11.5px;
  font-weight:500;
  color:var(--ink-mute);
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  transition:color var(--t-fast,0.13s) var(--ease,ease),border-color var(--t-fast,0.13s) var(--ease,ease),background var(--t-fast,0.13s) var(--ease,ease);
}
.topbar .tbtn:hover{
  color:var(--ink);
  border-color:var(--ink);
  background:var(--surface,#fff);
}

/* Orange "View Note" button — keep semantic warn cue on paper background */
.topbar .tbtn-note{
  background:var(--ink-warn-soft);
  color:var(--ink-warn);
  border-color:var(--ink-warn);
  font-weight:600;
}
.topbar .tbtn-note:hover{
  background:var(--ink-warn-soft);
  color:var(--ink-warn);
  border-color:var(--ink-warn);
  filter:brightness(0.97);
}

/* Logout — paint as the dark OS-style pill (ink bg, paper text, ink border).
 * The element carries inline style="background:rgba(220,70,70,0.18); ...;
 * color:#ff9090;" — !important is required to win against inline. */
#btn-logout-top{
  background:var(--ink)!important;
  color:var(--paper)!important;
  border:1px solid var(--ink)!important;
}
#btn-logout-top:hover{
  background:#000!important;
  color:var(--paper)!important;
  border-color:#000!important;
}

/* Workspace secondary tab row. The top-level mode row owns the 72px topbar;
 * these tabs live below it and must stay compact. */
.topbar-tabs-v2{
  background:transparent!important;
  background-image:none!important;
  border-top:0!important;
  border-bottom:0!important;
  height:40px!important;
  padding:0!important;
  align-items:stretch!important;
}
.topbar-tabs-v2 .tab-btn-v2{
  font-family:var(--sans-paper);
  font-size:12.5px;
  font-weight:500;
  color:var(--ink-mute);
  background:transparent;
  letter-spacing:0.005em;
  height:40px;
}
.topbar-tabs-v2 .tab-btn-v2:hover{
  color:var(--blue);
  background:transparent;
}
.topbar-tabs-v2 .tab-btn-v2.active{
  color:var(--blue)!important;
  background:transparent!important;
  border-bottom-color:var(--blue)!important;
  /* Legacy adds an inset blue underline on .active::after — neutralize */
  box-shadow:none!important;
}
.topbar-tabs-v2 .tab-btn-v2.active::after{
  display:none!important;
}
.encounter-tabs-v2 .tab-btn-v2:hover{
  color:var(--blue)!important;
}
.encounter-tabs-v2 .tab-btn-v2.active{
  color:var(--blue)!important;
  background:transparent!important;
  border-bottom-color:var(--blue)!important;
  box-shadow:none!important;
}
.encounter-tabs-v2 .tab-btn-v2.active::after{
  display:none!important;
}

/* ── 16b. Patient banner overlay inside the topbar ───────────────────── */
.topbar-pt .banner-profile-card{
  background:var(--paper);
  border:1px solid var(--hairline-mid);
  border-radius:12px;
  box-shadow:var(--shadow-paper);
}
.topbar-pt .banner-name{
  color:var(--ink) !important;
  font-family:var(--serif) !important;
  font-weight:600 !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-fill-color:var(--ink) !important;
}
.topbar-pt .banner-name.empty{
  color:var(--ink-faint) !important;
  font-family:var(--sans-paper) !important;
  -webkit-text-fill-color:var(--ink-faint) !important;
}
.topbar-pt .banner-sub{
  color:var(--ink-mute) !important;
  font-family:var(--sans-paper) !important;
}
.topbar-pt .banner-avatar{
  background:var(--paper-2);
  border:1px solid var(--hairline-mid);
  color:var(--ink-faint);
}
.topbar-pt .banner-avatar.has-pt{
  background:var(--paper-2);
  color:var(--ink);
}

/* ── 16c. Dashboard view (#content-daysheet) ─────────────────────────── */
/* The Dashboard markup is mostly inline-styled (see app-shell.js lines 698–731).
 * Override via id + element selectors with !important where inline styles bind. */
#content-daysheet{
  background:var(--paper);
  font-family:var(--sans-paper);
  color:var(--ink);
}
/* Header band: friendly app title + date + Calendar pill + Add-Patient pill */
#content-daysheet .dashboard-title{
  font-family:var(--display)!important;
  font-weight:700!important;
  font-size:23px!important;
  line-height:1.05;
  color:var(--ink)!important;
  letter-spacing:0;
}
#content-daysheet #ds-date{
  font-family:inherit!important;
  font-size:inherit!important;
  color:inherit!important;
  letter-spacing:inherit;
}
/* Calendar — inline text-colour link with no button chrome */
#ds-calendar-btn{
  font-family:var(--font)!important;
  font-size:14px!important;
  font-weight:500!important;
  color:var(--ink-mute)!important;
  background:transparent!important;
  border:none!important;
  border-radius:0!important;
  padding:0!important;
  margin:0;
  width:auto;
  height:auto;
  line-height:1.2;
  display:inline-flex;
  align-items:center;
  gap:7px;
  justify-content:center;
  cursor:pointer;
  vertical-align:-0.125em;
  transition:color var(--t-fast,0.13s) var(--ease,ease),opacity var(--t-fast,0.13s) var(--ease,ease);
}
#ds-calendar-btn svg{
  display:inline-block;
  width:1em;
  height:1em;
  vertical-align:-0.125em;
}
#ds-calendar-btn:hover{
  color:var(--ink)!important;
}
/* "+ Add Patient/Appointment" pill — shared light button */
#ds-add-pt-appt{
  font-family:var(--sans-paper)!important;
  font-size:11.5px!important;
  font-weight:600!important;
  color:var(--ink)!important;
  background:#fff!important;
  border:1px solid color-mix(in srgb,var(--ink) 24%,transparent)!important;
  border-radius:999px!important;
  padding:5px 14px!important;
  transition:border-color var(--t-fast,0.13s) var(--ease,ease);
}
#ds-add-pt-appt:hover{
  border-color:var(--ink)!important;
}
/* Card wrapper around the table — neutralize legacy card chrome */
#content-daysheet .card{
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid);
  border-radius:10px;
  box-shadow:var(--shadow-paper);
  overflow:hidden;
}
/* Table header row — micro-label paper style */
#ds-table{
  font-family:var(--sans-paper);
  color:var(--ink);
}
#ds-table thead tr{
  border-bottom:1.5px solid var(--ink)!important;
  background:var(--paper-2);
}
#ds-table thead th{
  font-family:var(--sans-paper)!important;
  font-size:10px!important;
  font-weight:600!important;
  letter-spacing:0.16em!important;
  text-transform:uppercase;
  color:var(--ink-mute)!important;
  padding:10px 12px!important;
}
/* Data rows */
#ds-body tr{
  border-bottom:1px solid var(--hairline-faint)!important;
  transition:background var(--t-fast,0.13s) var(--ease,ease);
}
#ds-body tr:hover{
  background:var(--paper)!important;
}
#ds-body td{
  font-family:var(--sans-paper);
  color:var(--ink);
}
/* Empty-state row ("No appointments on this day.") — italic ink-faint serif.
 * widgets.css line 2125 binds to #ds-body td[colspan]:not(:has(button)):not(:has(input))
 * with !important; match that specificity here so our paper repaint wins. */
/* Note: widgets.css uses two chained :not(:has(...)) which has specificity
 * (1,1,3). To beat it we need ≥ that specificity. The combined-list form
 * :not(:has(button), :has(input)) is what stylelint expects, but it has
 * lower specificity. Add a #content-daysheet prefix to bump us past the
 * legacy selector (2 IDs + ...). */
#content-daysheet #ds-body td[colspan]:not(:has(button), :has(input)){
  padding:32px 24px!important;
  text-align:center!important;
  font-family:var(--serif)!important;
  font-style:italic!important;
  font-size:14px!important;
  color:var(--ink-faint)!important;
  letter-spacing:0.005em;
}
#content-daysheet #ds-body td[colspan]:not(:has(button), :has(input))::before{
  /* The legacy "·  ·  ·" decoration: keep but re-ink to paper line. */
  color:var(--ink-line)!important;
  font-family:var(--sans-paper)!important;
}
/* "+ Add Patient" footer row button — light OD-style pill.
 * Text is set by JS to "+ Add patient to Dashboard"; we hide it via
 * font-size:0 and render shorter "+ Add Patient" via ::after. */
#ds-body td[colspan]:has(button) > button{
  font-family:var(--sans-paper)!important;
  font-size:0!important;
  color:transparent!important;
  background:#fff!important;
  border:1px solid color-mix(in srgb,var(--ink) 24%,transparent)!important;
  border-radius:999px!important;
  padding:6px 16px!important;
  cursor:pointer;
  transition:border-color var(--t-fast,0.13s) var(--ease,ease);
}
#ds-body td[colspan]:has(button) > button::after{
  content:"+ Add Patient";
  font-family:var(--sans-paper);
  font-size:12px;
  font-weight:600;
  color:var(--ink);
  letter-spacing:0.01em;
}
#ds-body td[colspan]:has(button) > button:hover{
  background:#fff!important;
  border-color:var(--ink)!important;
}

/* ── 16d. Tab stubs (.tab-stub) + .tab-pane placeholder ──────────────── */
/* Many legacy widgets.css rules use !important on .tab-stub* — override. */
.tab-stub{
  background:var(--surface,#fff);
  border:1px solid var(--hairline-mid)!important;
  border-radius:10px!important;
  box-shadow:var(--shadow-paper)!important;
  color:var(--ink);
}
.tab-stub-title{
  font-family:var(--serif)!important;
  font-weight:600!important;
  font-size:18px!important;
  color:var(--ink)!important;
  letter-spacing:-0.01em!important;
}
.tab-stub-body{
  font-family:var(--sans-paper);
  font-size:13px;
  line-height:1.6;
  color:var(--ink-mute);
}
.tab-stub-action{
  font-family:var(--sans-paper)!important;
  font-size:12px!important;
  font-weight:600!important;
  color:var(--ink-link)!important;
  background:var(--ink-link-soft)!important;
  background-image:none!important;
  border:1px solid var(--ink-link)!important;
  border-radius:999px!important;
  padding:7px 16px!important;
  box-shadow:none!important;
  letter-spacing:0.01em;
  transition:filter var(--t-fast,0.13s) var(--ease,ease)!important;
}
.tab-stub-action:hover{
  background:var(--ink-link-soft)!important;
  filter:brightness(0.97);
  transform:none;
  box-shadow:none!important;
}

/* Shared tab-pane paper treatment for secondary workspace surfaces. */
.tab-pane{
  background:var(--paper-2);
  border-top:1px solid var(--hairline-faint);
  color:var(--ink-faint);
  font-family:var(--serif);
  font-style:italic;
  font-size:13px;
  padding:14px 20px;
  letter-spacing:0.005em;
}

/* ── 17. OD / OS assessment state colors ─────────────────────────────
 * Orange inline text = eye scope. Muted orange = not assessed / N/A. */
body.encounter-active .eye-tag.od,
body.encounter-active .eye-tag.os{
  width:auto !important;
  min-width:0 !important;
  height:auto !important;
  min-height:0 !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  justify-self:start !important;
  align-self:center !important;
  padding:0 2px !important;
  border-radius:0 !important;
  font-family:var(--sans-paper,var(--font)) !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  letter-spacing:0.08em !important;
  line-height:1.2 !important;
  text-transform:uppercase !important;
  background:transparent !important;
  background-image:none !important;
  color:var(--ink-link,var(--blue,#d97757)) !important;
  border:0 !important;
  box-shadow:none !important;
}
body.encounter-active .eye-tag.clickable.od:hover,
body.encounter-active .eye-tag.clickable.os:hover{
  background:transparent !important;
  color:var(--ink-link,var(--blue,#d97757)) !important;
  filter:none;
  text-decoration:underline;
  text-underline-offset:2px;
}
body.encounter-active .eye-tag.od.na-tag,
body.encounter-active .eye-tag.os.na-tag{
  background:transparent !important;
  background-image:none !important;
  color:var(--ink-link,var(--blue,#d97757)) !important;
  border:0 !important;
  box-shadow:none !important;
  opacity:0.64;
}
body.encounter-active .eye-tag.clickable.od.na-tag:hover,
body.encounter-active .eye-tag.clickable.os.na-tag:hover{
  background:transparent !important;
  color:var(--ink-link,var(--blue,#d97757)) !important;
  filter:none;
}

/* ── 18. Ocular Vitals — tighten gap from card header to Vision section ─
 * The Ocular Vitals card body uses .ocular-vitals-row (grid layout).
 * The first .vitals-subhdr inside the first .ocular-vitals-section is
 * NOT a direct child of .card-body, so the section-5 :first-child rule
 * doesn't fire. Tighten manually. */
body.encounter-active .exam-grid.general-consult-grid > .card[data-widget-card="ocular-vitals"] > .card-scroll > .ocular-vitals-row{
  position:relative;
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  padding-top:18px!important;
  padding-left:var(--widget-section-pad-x,16px)!important;
  padding-right:var(--widget-section-pad-x,16px)!important;
  padding-bottom:14px!important;
}
body.encounter-active .exam-grid.general-consult-grid > .card[data-widget-card="ocular-vitals"] > .card-scroll > .ocular-vitals-row .ocular-vitals-addon-region{
  position:absolute!important;
  inset:0 auto auto 0;
  width:0!important;
  height:0!important;
  overflow:visible!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section:first-of-type .vitals-subhdr,
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section:nth-of-type(2) .vitals-subhdr{
  padding-top:0;
  margin-bottom:6px;
  min-height:0;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section-pupils{
  grid-column:auto!important;
  justify-self:stretch!important;
  align-items:stretch!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-section-pupils .vitals-subhdr{
  width:100%!important;
  display:flex!important;
  justify-content:flex-start!important;
  margin-left:0!important;
  margin-right:0!important;
}
body.encounter-active .card[data-widget-card="ocular-vitals"] .ocular-vitals-pupil-controls{
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
}