/* One screen theme for every clinic route. The existing modules own behavior,
   responsive layout, semantic states and printed documents. */
@media screen {
 :root{
  --ui-accent:#00a6c4;--ui-accent-hover:#0095af;--ui-ink:#303339;
  --ui-muted:#777c84;--ui-line:#dedfe2;--ui-soft:#f5f6f8;--ui-surface:#fff;
  --ui-sidebar:#222c2d;--ui-modal-heading:#5085b2;
  --teal:var(--ui-accent);--line:var(--ui-line);--muted:var(--ui-muted);
  --clinic-ink:var(--ui-ink);--clinic-blue:var(--ui-accent);--clinic-aqua:var(--ui-accent);
 }
 body{background:var(--ui-soft);color:var(--ui-ink);font-size:14px;font-family:"PingFang SC","Microsoft YaHei",Arial,sans-serif;letter-spacing:0}
 button,input,select,textarea{font-family:inherit;letter-spacing:0;border-radius:3px;box-shadow:none}
 button{background-image:none;border-color:#d8dbe0;color:#60656e;font-weight:400}
 button:hover{background:#f5fbfc;border-color:#9dcdd7}
 button.primary{background:var(--ui-accent);border-color:var(--ui-accent);color:#fff;box-shadow:none}
 button.primary:hover{background:var(--ui-accent-hover);border-color:var(--ui-accent-hover)}
 input,select,textarea{border-color:#d8dbe0;background:#fff;color:#60656e}
 input::placeholder,textarea::placeholder{color:#a5a8ae}
 input[type=checkbox],input[type=radio]{accent-color:var(--ui-accent)}
 button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #00839d;outline-offset:2px}
 button.danger{color:#bd3544;border-color:#e9c8ce;background:#fff8f8}
 button:disabled{cursor:not-allowed;opacity:.5}
 .shell .card,.shell .metric,.shell .reception-board{border-radius:3px;box-shadow:none;border-color:var(--ui-line)}
 .shell h1,.shell h2,.shell h3{color:var(--ui-ink);letter-spacing:0}
 .shell .subtle{color:var(--ui-muted)}
 .shell th{background:#f5f7f7;color:#484d55;border-color:var(--ui-line);font-weight:500}
 .shell td{border-color:#e4e5e8;color:#60656e}
 .shell .tablewrap tbody tr:hover{background:#f3fafc}
 .shell .tabs{gap:0;border-color:var(--ui-line)}
 .shell .tabs button{border-radius:3px 3px 0 0;border-color:var(--ui-line);background:#fff;color:#60656e;box-shadow:none}
 .shell .tabs button.active{background:var(--ui-accent);border-color:var(--ui-accent);color:#fff}
 .shell .patient-name-link,.shell .patient-card-link{color:#219cb4}
 .shell .workflow-next,.shell .coordination-reference{border-color:var(--ui-line);box-shadow:none}
 .login{border-radius:3px;border-color:var(--ui-line);box-shadow:none}
 .login h1{font-weight:500;color:var(--ui-ink)}
 .login button.primary{background:var(--ui-accent);border-color:var(--ui-accent)}
}
@media screen and (min-width:721px){
 .shell,.shell:has(.reception-workbench){grid-template-columns:92px minmax(0,1fr)}
 .shell.nav-collapsed,.shell.nav-collapsed:has(.reception-workbench){grid-template-columns:56px minmax(0,1fr)}
 .shell .sidebar,.shell:has(.reception-workbench) .sidebar,.shell.nav-collapsed .sidebar,.shell.nav-collapsed:has(.reception-workbench) .sidebar{background:var(--ui-sidebar);border:0;color:#bfc3ca;padding:0;box-shadow:none}
 .shell .brand,.shell:has(.reception-workbench) .brand{height:50px;min-height:50px;padding:0;justify-content:center;align-items:center;border:0;background:transparent}
 .shell .brand>.nav-icon{width:35px;height:35px;color:#f1f3f5}
 .shell .brand small{display:none}
 .shell .nav{padding:5px 0;gap:0;scrollbar-width:none}
 .shell .nav::-webkit-scrollbar{display:none}
 .shell .nav button,.shell-more-navigation>summary{min-height:40px;padding:10px 6px;gap:5px;line-height:20px;font-size:14px;font-weight:400;border:0;border-radius:0;box-shadow:none;color:#bfc3ca;background:transparent}
 .shell .nav .nav-icon,.shell-more-navigation>summary>.nav-icon{width:18px;height:18px}
 .shell .nav .nav-label{overflow:visible;text-overflow:clip}
 .shell .nav button.active,.shell .nav button.active:hover{background:var(--ui-accent);color:#fff;box-shadow:none}
 .shell .nav button:hover,.shell-more-navigation>summary:hover{background:#344346;color:#fff}
 .shell .shell-more-links>button{padding-left:8px}
 .shell-more-navigation{margin-top:10px;padding-top:8px;border-color:#ffffff12}
 .shell-more-navigation>summary::after{width:9px;height:9px;background:#bfc3ca}
 .shell-settings-link{border:0;margin-top:auto;padding-top:10px}
 .shell .sidebar footer{font-size:9px;padding:8px 5px;color:#929a9f;border:0;background:#ffffff08;line-height:1.6}
 .shell.nav-collapsed .nav button{padding-inline:0}
 .shell.nav-collapsed .nav .nav-label{display:none}
 .shell .main,.shell:has(.reception-workbench) .main{padding:0 8px 12px}
 .shell .topbar,.main:has(.appointment-workspace) .topbar{height:50px;min-height:50px;margin:0 -8px 8px;padding:6px 12px;gap:12px;overflow:visible;background:#fff;border:0;border-bottom:1px solid #e2e3e6;border-radius:0;box-shadow:none}
 .shell .topbar .shell-heading{max-width:34%;gap:8px}
 .shell .topbar .shell-heading>strong{font-size:16px;font-weight:600;color:#219cb4}
 .shell .topbar .shell-heading #toggle-main-nav{min-height:32px;min-width:24px;padding:3px;border:0;color:#92969e}
 .shell .topbar .shell-patient-search{min-width:120px;max-width:360px;background:#fff;border-color:#e0e2e6;border-radius:3px}
 .shell .topbar .shell-patient-search input,.shell .topbar .shell-patient-search button{min-height:32px;height:32px;font-size:13px}
 .shell .topbar .shell-patient-search button{min-width:32px;padding:4px 8px}
 .shell .topbar #shell-new-patient{min-height:32px;padding:6px 10px;background:#fff;color:#219cb4;border:1px solid #d8dbe0;border-radius:3px}
 .shell .topbar #shell-new-patient>.nav-icon{width:16px;height:16px;color:#7c838c}
 .shell-account>summary{min-height:34px;border-radius:3px;color:#60656e;font-size:13px}
 .shell-account>summary>.nav-icon{width:24px;height:24px;color:var(--ui-accent)}
 .shell-account-panel{border-radius:3px;border-color:#dedfe2;box-shadow:0 4px 12px #22374624}
 .shell-account-panel>button{border-radius:2px}
 .shell .pagehead{margin:0 0 10px;min-height:42px;align-items:center;padding:7px 10px;background:#fff;border-bottom:1px solid var(--ui-line)}
 .shell .pagehead h1{margin:0;font-size:16px;font-weight:500;line-height:24px}
 .shell .pagehead h2{margin:0;font-size:15px;font-weight:500;line-height:22px}
 .shell .pagehead p{font-size:12px}
 .shell .pagehead button{min-height:32px;border-radius:3px;font-size:13px}
 .shell .toolbar input,.shell .toolbar select,.shell .toolbar button{font-size:13px;min-height:32px;border-radius:3px}
 .shell .patient-management-nav{margin:0 0 8px;background:#fff;border-bottom-color:var(--ui-line)}
 .shell .patient-management-nav>button{min-height:40px;padding:10px 16px;color:#60656e}
 .shell .patient-management-nav>button.active{color:var(--ui-accent);border-bottom-color:var(--ui-accent)}
 /* Appointment geometry stays at 44px per half hour, with its current filters. */
 #view .appointment-workspace{height:calc(100dvh - 66px);--appointment-accent:var(--ui-accent);--appointment-line:var(--ui-line);border-radius:0;box-shadow:none}
 .appointment-workspace .appointment-command-bar{background:#fff;border-color:var(--ui-line)}
 .appointment-workspace .schedule-mode-tabs button.active{color:var(--ui-accent);border-bottom-color:var(--ui-accent);background:#fff}
 .appointment-workspace .appointment-mini-grid button.selected{background:var(--ui-accent)}
 .appointment-workspace .appointment-status-strip button{font-weight:400;border-radius:2px}
 .appointment-workspace .schedule-event{box-shadow:0 2px 4px #263d4426;border-radius:5px}
 .appointment-workspace .state-booked{--event-color:#49b6df;--event-bg:#89d6f2;--event-ink:#164964}
 .appointment-workspace .state-arrived{--event-color:#83b947;--event-bg:#c8e7a9;--event-ink:#385a20}
 .appointment-workspace .state-waiting{--event-color:#68ad56;--event-bg:#a9d994;--event-ink:#315324}
 .appointment-workspace .state-working{--event-color:#e6a135;--event-bg:#ffd18a;--event-ink:#6c4510}
 .appointment-workspace .state-done{--event-color:#69a780;--event-bg:#b2d5bc;--event-ink:#315b40}
 .appointment-workspace .state-cancelled{--event-color:#9ba2ac;--event-bg:#dfe3e8;--event-ink:#606975}
 .appointment-workspace .state-missed{--event-color:#798493;--event-bg:#a6afbb;--event-ink:#27394d}
 /* Plain, compact workbench metrics, as in the observed daily-work panel. */
 .reception-workbench .reception-tasks{background:#fff;border-color:var(--ui-line);border-radius:3px}
 .reception-workbench .reception-tasks button{background:#fff;border-color:var(--ui-line);color:#60656e}
 .reception-workbench .reception-tasks b{color:#219cb4}
 .reception-workbench .work-stat-grid{background:#fff;border:0;gap:0;border-radius:3px}
 .reception-workbench .work-stat-grid>button,.reception-workbench .work-stat-grid>button:nth-child(3n+2),.reception-workbench .work-stat-grid>button:nth-child(3n){background:#fff;color:#60656e;border:0;border-right:1px solid #e2e3e6;border-top:0;border-radius:0;padding:10px 8px;box-shadow:none}
 .reception-workbench .work-stat-grid>button strong{color:#303339;font-size:20px;font-weight:550}
 .reception-workbench .work-stat-grid>button span{color:#60656e}
 .reception-workbench .clinical-quality,.reception-workbench .clinical-quality-item{background:#fff;border-color:var(--ui-line);border-radius:3px;box-shadow:none}
 .reception-workbench .clinical-quality-item strong{color:#219cb4}
 .reception-workbench .reception-list-heading{background:#fff;border-color:var(--ui-line)}
 .reception-workbench .reception-list-heading h2{font-size:14px;font-weight:500}
 .reception-workbench .reception-toolbar{background:#fff;border-color:var(--ui-line)}
 .reception-workbench table th{background:#f5f7f7;color:#34383f;font-size:12px;border-color:#d9dcde}
 .reception-workbench table td{border-color:#dedfe2}
 .reception-workbench tbody tr:nth-child(even){background:#f5f6f8}
 .reception-workbench .flow-main{color:#60656e}
 /* Common edit dialogs use the blue title bar seen in the patient editor. */
 #modal::backdrop{background:#0000000a}
 #modal:not(.billing-reference-dialog,.appointment-dialog,.appointment-detail-drawer,.consent-sign-dialog,.smart-consent-dialog,.catalog-batch-dialog,.catalog-import-dialog,.permissions-dialog,.oral-dialog,.oral-compare-dialog,.ai-dialog,.notation-dialog){width:min(900px,94vw)}
 #modal:not(.billing-reference-dialog) #modal-form>.grid{gap:12px 20px}
 #modal:not(.billing-reference-dialog) #modal-form>.grid>h3{font-size:14px;font-weight:500;margin:8px 0 0;padding-bottom:8px;border-bottom:1px solid #eff0f2;color:#60656e}
 #modal:not(.billing-reference-dialog) #modal-form>.grid>label:not(.full):has(>input:not([type=checkbox],[type=radio])),
 #modal:not(.billing-reference-dialog) #modal-form>.grid>label:not(.full):has(>select){display:grid;grid-template-columns:minmax(75px,100px) minmax(0,1fr);gap:8px;align-items:center;margin:0;min-height:42px}
 #modal:not(.billing-reference-dialog) #modal-form>.grid>label:not(.full)>input,
 #modal:not(.billing-reference-dialog) #modal-form>.grid>label:not(.full)>select{margin-top:0}

 #modal:not(.billing-reference-dialog):not(.appointment-detail-drawer){--ui-dialog-inset:26px;padding:var(--ui-dialog-inset);border:1px solid #5b89b0;border-radius:3px;box-shadow:0 5px 18px #0004}
 #modal:not(.billing-reference-dialog):not(.appointment-detail-drawer) #modal-content>h2{margin:calc(-1 * var(--ui-dialog-inset)) calc(-1 * var(--ui-dialog-inset)) 20px;padding:8px 14px;background:var(--ui-modal-heading);color:#fff;font-size:15px;font-weight:400;line-height:20px;border:0;border-radius:0}
 #modal:not(.billing-reference-dialog):not(.appointment-detail-drawer) #modal-form>.actions{border-top:1px solid #e9eaec;padding-top:12px;background:#fff}
 #modal:not(.billing-reference-dialog) label{color:#777c84;font-size:13px;font-weight:400}
 #modal:not(.billing-reference-dialog) input:not([type=checkbox],[type=radio],[type=hidden]),#modal:not(.billing-reference-dialog) select,#modal:not(.billing-reference-dialog) textarea{font-size:13px;min-height:32px;border-radius:0}
 #modal input[type=checkbox],#modal input[type=radio]{min-height:0;padding:0}
}
@media screen and (min-width:721px) and (max-width:1000px){
 .shell .topbar{gap:7px;padding-inline:9px}
 .shell .topbar .shell-heading{max-width:26%}
 .shell .topbar .shell-heading>strong{font-size:14px}
 .shell .topbar .shell-patient-search{flex-basis:100px;min-width:100px}
 .shell .topbar .shell-tools{gap:4px}
 .shell-account{max-width:100px}
 .shell-account-name{max-width:55px}
 .shell .topbar #shell-new-patient{font-size:12px;padding-inline:7px}
}
@media screen and (max-width:720px){
 body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
 .shell .main{background:var(--ui-soft)}
 .mobile-home-reference{--mobile-home-accent:var(--ui-accent)}
 .mobile-home-reference .mobile-home-header,.mobile-bottom{background:#fff;border-color:#edf0f2}
 .mobile-bottom button.active{color:var(--ui-accent);background:#fff}
 .mobile-bottom button.active .feature-symbol{color:var(--ui-accent)}
 .mobile-home-reference .mobile-home-stat-grid>button strong{color:#303339}
 .shell .patient-management-nav>button.active{color:var(--ui-accent);border-bottom-color:var(--ui-accent)}
 .mobile-schedule-reference .week-strip .selected strong{background:var(--ui-accent)!important}
 .mobile-schedule-reference .mobile-schedule-ref-header #schedule-board{border-bottom-color:var(--ui-accent)}
 .mobile-schedule-reference #new-appointment,.mobile-schedule-reference .mobile-schedule-ref-today{color:#303339;background:#fff}
}