/* CONNECTED37: compact desktop workspace and separated graphite surfaces.
   Loaded after the historical styles. Content lists scroll, desktop actions do not. */
body:not([data-theme="light"]){
  --bg:#292b2f;--panel:#36393e;--panel2:#43474d;--panel3:#50555c;
  --line:#636970;--text:#f1f2f3;--muted:#b8bdc5;
  background:var(--bg);
}
body:not([data-theme="light"]) .sidebar{background:#303338;border-color:#5b6067;box-shadow:none}
body:not([data-theme="light"]) :is(.stack>.card,.summary,.pl-side-card,.modal,.modal-head,.settings-card){
  background:var(--panel);border-color:var(--line);box-shadow:0 4px 14px #0002;
}
body:not([data-theme="light"]) :is(.stack>.card .card-head,.summary-toolbar,.pl-side-heading){
  background:#40444a;border-color:#656b72;
}
body:not([data-theme="light"]) :is(.stack .control,.summary .control,.discount-trigger,
  #workToggle,#implantToggle,#shadeSelection,.tech-task-trigger){
  background:#4a4e55!important;border-color:#717780!important;color:var(--text)!important;
}
body:not([data-theme="light"]) :is(input,textarea)::placeholder{color:#c2c6cc;opacity:1}
body:not([data-theme="light"]) :is(.field>label,.field-label-actions>label,
  .account-pill small,.work-detail small,.work-money small,.invoice-item small,.invoice-item-total span){color:var(--muted)}
body:not([data-theme="light"]) :is(.account-pill,.invoice-item,.work-item){
  background:#45494f!important;border-color:#696f77!important;box-shadow:none;
}
body:not([data-theme="light"]) :is(.summary-context,.invoice-adjustment,.utility-menu){background:#36393e}
/* Ledger 211 (owner 07.10): the dropdowns are the modest ones of the owner's reference shots — a dark menu (#1d2025, a
   neutral #575c64 frame), dark rounded rows (#282c32, a thin #41464e line, small text, the price on the right); the
   selected / hovered row is the champagne look (case_form.css, last section). Tokens: main_y2.css --champ-menu-* / -row-*. */
body:not([data-theme="light"]) :is(.option-menu,.shade-menu,.recovery-choices,.discount-menu,
  .technician-suggestions,.tech-task-menu,.tech-assignment-popover){background:var(--champ-menu-bg,#1d2025)!important;border-color:var(--champ-menu-line,#575c64)}
body:not([data-theme="light"]) :is(.option-tile,.option-choice,.work-option,.shade-option,.option-grid>button){
  background:var(--champ-row-bg,#282c32)!important;border-color:var(--champ-row-line,#41464e)!important;color:var(--champ-row-ink,#ddd);
}
body:not([data-theme="light"]) :is(.tech-action-row>button,.utility-btn,.fullscreen-toggle,.case-search-toggle){
  background:#4b5057!important;border-color:#737b85!important;color:#eceef1;
}
body:not([data-theme="light"]) .recovery-choices button[aria-selected="true"],
body:not([data-theme="light"]) .recovery-choices button:hover{background:rgba(var(--ui-accent-rgb),.19)}
body:not([data-theme="light"]) :is(.work-list-empty,.invoice-empty){color:#c0c5cc;border-color:#767d86;background:#303339}
/* Unassigned teeth are neutral; assigned and selected semantic colors retain their rules. */
body:not([data-theme="light"]) .tooth:not(.on):not(.work-standard):not(.work-implant):not(.work-ceramic):not(.work-metal):not(.work-mixed){background:#4a4f56;color:#e0e3e8;border-color:#737b85}
body:not([data-theme="light"]) :is(.analytics-toolbar,.analytics-section,.analytics-v68 .analytics-filters,.metric){background:#42464c;border-color:#6b727b}
body:not([data-theme="light"]) :is(.analytics-search-field input,.analytics-search-field input:focus){background:#4a4f56!important}
body:not([data-theme="light"]) .settings-workspace{background:#36393e}

body:not([data-theme="light"]) :is(.analytics-filter-card,.analytics-v68 .metric){background:#42464c;border-color:#6b727b}
body:not([data-theme="light"]) :is(.rh-tabs button,.analytics-period-switch-v68 button):not(.on){background:#4b5057;border-color:#737b85;color:#eceef1}
#invoiceStatus[hidden]{display:none!important}

/* Highlight the Clinic control as the entry into the clinic/doctor pair. */
.clinic-case-field>label{color:var(--ui-accent-text)!important;font-weight:800}
#clinicSearch{border-color:var(--ui-accent)!important;box-shadow:inset 3px 0 0 var(--ui-accent)!important}
#clinicSearch:focus{box-shadow:inset 3px 0 0 var(--ui-accent),0 0 0 2px var(--ui-accent-soft)!important}
body[data-theme="light"] .clinic-case-field>label{color:#765827!important}

/* Review lives beside Patient. All document controls use the same button geometry. */
.invoice-date-row{grid-template-columns:minmax(0,1fr) minmax(124px,.85fr);align-items:stretch;gap:8px}
.invoice-date-row #saveInvoice{height:auto!important;min-height:42px;min-width:0;padding:6px 10px;border-radius:9px;font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.02em}
#invoiceDocumentActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px;margin:0;padding:0 13px 8px}
#invoiceDocumentActions>button,.summary .label-actions>button{
  display:flex;align-items:center;justify-content:center;width:100%;height:34px!important;
  min-height:34px!important;min-width:0;padding:4px 6px!important;border:1px solid var(--gold-btn-line)!important;
  border-radius:9px!important;background:var(--gold-btn-face)!important;color:var(--gold-btn-ink)!important;
  font-size:9px!important;font-weight:800!important;letter-spacing:.025em;line-height:1.2;box-shadow:none!important;
}
/* ledger 208 p.3: the gold button tokens of main_y2.css switch with the theme — no brownish light-theme override */
.summary .label-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
.case-work-save-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;flex:0 0 auto;margin-top:8px!important}
.case-work-save-row>button{
  display:flex;align-items:center;justify-content:center;width:100%!important;min-width:0;
  height:36px!important;min-height:36px;padding:5px 9px!important;border:1px solid var(--ui-accent-line);
  border-radius:9px;background:var(--ui-accent-soft);color:var(--ui-accent-text);
  font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.02em;box-shadow:none;
}
.case-work-save-row>button{background:var(--gold-btn-face)!important;color:var(--gold-btn-ink)!important;border-color:var(--gold-btn-line)!important}
#editCaseTop{height:28px;min-height:28px;padding:0 8px;font-size:9px;box-shadow:none}
.sidebar{position:relative}
.sidebar-credit[hidden]{display:none!important}
.workspace-account{position:absolute;z-index:50;top:11px;inset-inline-end:9px}
.workspace-account>summary{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--ui-accent-line);border-radius:8px;background:var(--panel2);color:var(--text);cursor:pointer;font-size:17px;list-style:none}
.workspace-account>summary::-webkit-details-marker{display:none}
.workspace-account-items{position:absolute;inset-inline-end:0;top:34px;width:210px;display:grid;gap:5px;padding:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px #0004}
.workspace-account-items>strong{padding:5px;font-size:12px;overflow-wrap:anywhere}
.workspace-account-items>button{width:100%;min-height:34px;padding:7px;text-align:start;border:1px solid var(--ui-accent-line);border-radius:7px;background:var(--ui-accent-soft);color:var(--ui-accent-text);font-size:11px}
.workspace-account:not([open])>.workspace-account-items{display:none}
#clinicChoices{min-width:260px;max-height:none;overflow:visible}
.clinic-choice-list{max-height:190px;overflow:auto;overscroll-behavior:contain}
.clinic-picker-actions{border-top:1px solid var(--ui-accent-line);margin-top:5px;padding-top:5px}
.clinic-picker-actions>button{font-weight:750;color:var(--ui-accent-text)}
.clinic-picker-actions>button small{font-weight:400}

@media(min-width:1251px){
  .app{grid-template-columns:clamp(215px,17.2vw,265px) minmax(0,1fr);min-width:0;height:100vh;height:100dvh}
  .main{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;padding:12px;overflow:hidden}
  .workspace{flex:1;min-height:0;min-width:0;height:100%;grid-template-columns:minmax(0,1fr) clamp(330px,28vw,430px);gap:12px;align-items:stretch}
  .stack{height:100%;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);gap:9px;overflow:visible;align-content:stretch}
  .stack>.card{min-width:0;max-width:100%;border-radius:13px}
  #caseInformation{position:relative;z-index:5;overflow:visible}
  #unifiedWork{position:relative;z-index:4;overflow:visible}
  #caseInformation>.card-head,#unifiedWork>.card-head{border-radius:12px 12px 0 0}
  .stack>.card>.card-head{padding:8px 12px!important;min-height:38px;flex:0 0 auto}
  .stack>.card>.card-body{padding:10px 12px!important}
  .case-form-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1.05fr) minmax(0,1.2fr) minmax(94px,.8fr) minmax(94px,.8fr)!important;gap:8px!important}
  .case-form-grid>.field,.case-form-grid>.field:nth-child(1),.case-form-grid>.field:nth-child(2){grid-column:auto!important;min-width:0}
  .case-form-grid .field-label-actions{gap:3px;min-width:0;min-height:17px;margin-bottom:5px;white-space:nowrap}
  .case-form-grid .field-label-actions>label,.case-form-grid>.field>label{font-size:9px!important;line-height:17px;margin-bottom:5px}
  .case-form-grid .field-label-actions>label{margin-bottom:0}
  .case-form-grid .inline-privacy{flex:0 1 auto;min-width:0;max-width:calc(100% - 38px);overflow:hidden;text-overflow:ellipsis;font-size:7px!important;padding:1px 3px;gap:2px;letter-spacing:0}
  .case-form-grid .inline-privacy .mask-code{font-size:7px!important;padding-inline-start:2px}
  .case-form-grid .control{height:35px;min-height:35px;padding-inline:8px;font-size:12px}
  #unifiedWork>.teeth-wrap{padding:10px 12px!important}
  #unifiedWork .teeth{gap:6px}
  #unifiedWork .tooth-arch{grid-template-columns:repeat(15,minmax(0,1fr) 7px) minmax(0,1fr)!important;gap:2px!important}
  #unifiedWork .bridge-connector{width:7px!important}
  #unifiedWork .tooth{height:33px!important;font-size:12px!important}
  #unifiedWork .service-row{grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,1fr) 64px 94px!important;gap:7px!important}
  #unifiedWork .service-row .add-work{grid-column:auto!important;min-width:0;padding-inline:7px;font-size:9px;height:36px}
  #unifiedWork .service-row>.field>label{font-size:9px!important;min-height:16px;letter-spacing:.03em;white-space:nowrap}
  #unifiedWork :is(#workToggle,#implantToggle,#shadeSelection){min-height:36px!important;height:36px!important;font-size:11px!important}
  #unifiedWork .service-row .control{height:36px;min-height:36px;padding-inline:7px;font-size:12px}
  #unifiedWork .service-followup{grid-template-columns:1fr!important;gap:0;margin-top:8px}
  #unifiedWork .tech-assignment-builder{grid-column:1/-1;grid-template-columns:minmax(0,1fr)!important;gap:5px}
  #unifiedWork .tech-action-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px}
  #unifiedWork .tech-action-row>button{height:30px;font-size:9px}
  #unifiedWork .tech-assignment-label{margin-bottom:4px}
  #unifiedWork .tech-assignment-selection{max-height:37px;overflow:auto}
  /* The progress bar fits the 37px row whole: one line (stages / dispatch), the stage list is the tooltip and the Traffic Manager. */
  #unifiedWork .tech-assignment-selection .production-traffic{padding:4px 10px;gap:0;line-height:17px}
  #unifiedWork .tech-assignment-selection .production-traffic :is(ol,.production-schedule-warnings,small){display:none}
  .case-work-card{display:flex;min-height:0!important;flex-direction:column}
  .case-work-card .card-head h2{font-size:16px!important}
  .case-work-body{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
  .case-work-body .work-list{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
  .case-work-body .work-list-empty{min-height:70px;height:100%;font-size:12px}
  .case-work-body .work-item{grid-template-columns:minmax(120px,1.5fr) minmax(65px,.8fr) 45px minmax(55px,.7fr) 42px 80px!important;gap:5px;padding-block:8px!important}
  .case-work-body .case-notes{flex:0 0 auto;margin-top:6px}
  .case-work-body .case-notes textarea.control{height:47px;min-height:47px!important;padding-top:7px;resize:none}
  .case-work-body .case-notes label{margin-bottom:4px}
  .case-work-body .case-media{flex:0 0 auto;max-height:48px;overflow:auto}
  .summary{height:100%;min-height:0!important;border-radius:13px}
  .summary :is(.summary-toolbar,.summary-context,.invoice-date,.invoice-adjustment,.total-block,.actions,.utility-menu){flex-shrink:0}
  .summary-toolbar{padding:8px 12px}
  .summary-context,.invoice-date,.invoice-adjustment,.total-block{padding:7px 12px}
  .summary .account-pill{padding:6px 8px}
  .summary .summary-lines{flex:1;min-height:65px;max-height:none;overflow:auto;overscroll-behavior:contain;padding:8px 12px}
  .summary .invoice-empty{min-height:55px;font-size:12px}
  .summary .total-row{margin:4px 0;font-size:12px}
  .summary .total-row.grand{margin-top:7px;font-size:17px}
  .summary .invoice-adjustment .control,.summary .discount-trigger{height:34px;min-height:34px;font-size:12px}
  .summary .label-actions{padding:0 12px 8px}
  .summary .utility-menu{padding:8px 12px}
  .summary .utility-btn{height:30px;font-size:10px}
  .summary .utility-grid{gap:6px}
  .sidebar,.sidebar:has(.pl-side-sections){height:100%;max-height:100%;min-height:0;overflow:hidden;padding:13px 11px 10px}
  .sidebar .brand{padding:0 6px 12px;flex:0 0 auto}
  .pl-side-sections{display:grid;grid-template-rows:minmax(100px,1fr) auto minmax(100px,1fr);flex:1;min-height:0;margin:0;gap:9px}
  .pl-side-card,body[data-density="compact"] .pl-side-card{min-height:0;height:100%}
  .pl-side-heading{min-height:35px;padding:5px 8px;flex-shrink:0}
  .pl-side-heading h2,.pl-side-heading h2 button{font-size:12px}
  .pl-side-content{flex:1;min-height:0;max-height:none;padding:6px;overflow:auto}
  .pl-side-footer{padding:6px;min-height:34px;flex-shrink:0}
  .pl-side-footer .pl-side-button{padding:5px 6px;font-size:9px}
  .pl-calendar-card{min-height:0}
  .pl-mini-day{height:21px}
  .pl-mini-weekday{padding:2px 0}
  .pl-calendar-key{padding-bottom:5px;font-size:8px;gap:7px}
  .pl-month-heading{padding-top:5px}
  /* A real error takes space without pushing Save beyond the viewport. */
  .main>#recoveryError:not([hidden]){flex:0 0 auto;max-height:78px;overflow:auto;margin-bottom:8px}
}

/* Narrower devices retain normal document scrolling rather than hide actions. */
@media(max-width:1250px){
  html,body{height:auto;min-height:100%;overflow:auto}
  .app{min-width:0;height:auto;min-height:100vh;grid-template-columns:210px minmax(0,1fr)}
  .main{height:auto;overflow:visible;padding:12px}
  .workspace{height:auto;grid-template-columns:minmax(0,1fr);gap:12px}
  .stack{height:auto;overflow:visible;grid-template-rows:auto auto minmax(340px,1fr)}
  .summary{height:auto;min-height:0}
  .summary-lines{max-height:320px}
  .case-work-save-row>button{font-size:9px}
}
@media(max-width:760px){
  .app{display:block}
  .sidebar{max-height:none;height:auto}
  .case-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .case-form-grid>.field,.case-form-grid>.field:nth-child(1),.case-form-grid>.field:nth-child(2){grid-column:auto!important}
}
@media print{
  body,.app,.main,.workspace,.stack{height:auto!important;min-height:0!important;overflow:visible!important}
}

/* Gold affordance for interactive case and tooth choices in either theme. */
:is(.option-tile,.option-choice,.work-option,.shade-option,.option-grid>button,.tooth,.metric[role="button"],button):not(:disabled):hover{border-color:var(--ui-accent,#d7b56d)!important;box-shadow:0 0 0 1px var(--ui-accent,#d7b56d)}
@media(max-width:520px){
  /* Phone: one field per row; the tooth chart keeps its 16-tooth arches and scrolls sideways instead of squeezing. */
  .case-form-grid{grid-template-columns:1fr!important}
  .teeth,.teeth-wrap{overflow-x:auto}.teeth{padding-bottom:6px}
  #unifiedWork .tooth-arch,.unified-work-card .tooth-arch{min-width:560px!important;width:560px!important;grid-template-columns:repeat(15,minmax(27px,1fr) 8px) minmax(27px,1fr)!important}
}

/* AQ.9: part state is also written in text, never communicated by colour alone. */
.case-parts{min-width:0}
.case-parts-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;padding:0;list-style:none}
.case-parts-item{display:flex;flex-direction:column;gap:5px;border:1px solid;border-radius:8px;padding:10px}
.case-parts-ready{border-color:#3d9b64;background:rgba(61,155,100,.12)}
.case-parts-waiting{border-color:#c7a348;background:rgba(199,163,72,.14)}
.case-parts-item small{opacity:.85}
