/* DRB V18.1 | ALL PAGES 2026-10-25
   Shared visual tokens only. No React module, route tree, metrics, finances,
   width/max-width for clinic dialogs, or data logic is modified.
   Reference: user's navy/blue/emerald DRB dashboard screenshot.
*/
:root { --drb-ui-radius:16px; --drb-ui-blue:#3979da; --drb-ui-green:#1ecfa3; }
html[data-drb-theme="dark"] {
  color-scheme:dark;
  --background:#081320; --foreground:#edf5ff;
  --card:#112238; --card-foreground:#edf5ff;
  --popover:#14253b; --popover-foreground:#edf5ff;
  --primary:#326fd5; --primary-foreground:#ffffff;
  --secondary:#1c314c; --secondary-foreground:#d5e5fb;
  --muted:#16283e; --muted-foreground:#9ab0cb;
  --accent:#1b3b62; --accent-foreground:#eaf5ff;
  --border:#263a54; --input:#2b405a;
  --ring:#579df7; --sidebar:#0b1b2d; --sidebar-foreground:#c3d7f1;
  --sidebar-accent:#213d65; --sidebar-accent-foreground:#fff;
  --sidebar-border:#243955;
  --drb-ui-bg:#081320; --drb-ui-panel:#13243a; --drb-ui-panel-2:#172d47;
  --drb-ui-line:#263d5a; --drb-ui-text:#ecf5ff; --drb-ui-sub:#9eb6d0;
  --drb-ui-hover:rgba(66,124,208,.13); --drb-ui-shadow:0 14px 30px rgba(0,6,20,.18);
}
html[data-drb-theme="light"] {
  color-scheme:light;
  --background:#f1f6fc; --foreground:#142840;
  --card:#fff; --card-foreground:#142840;
  --popover:#fff; --popover-foreground:#142840;
  --primary:#326bd2; --primary-foreground:#fff;
  --secondary:#e9f1fb; --secondary-foreground:#294461;
  --muted:#ebf2fa; --muted-foreground:#647995;
  --accent:#e5effd; --accent-foreground:#1c477d;
  --border:#d8e5f3; --input:#cbdbea;
  --ring:#3c80e2; --sidebar:#edf4fc; --sidebar-foreground:#29425f;
  --sidebar-accent:#dbe9fc; --sidebar-accent-foreground:#173d74;
  --sidebar-border:#d4e2f1;
  --drb-ui-bg:#f1f6fc; --drb-ui-panel:#ffffff; --drb-ui-panel-2:#f3f8ff;
  --drb-ui-line:#dae6f3; --drb-ui-text:#1a2f4b; --drb-ui-sub:#627991;
  --drb-ui-hover:rgba(57,115,194,.07); --drb-ui-shadow:0 12px 24px rgba(35,75,128,.07);
}
html[data-drb-theme] body {
  color:var(--drb-ui-text);
  background-color:var(--drb-ui-bg) !important;
  background-image:radial-gradient(ellipse 1100px 550px at 50% -340px,rgba(68,127,206,.15),transparent 94%);
  background-attachment:fixed;
}
html[data-drb-theme] #root {min-height:100vh;}
html[data-drb-theme] :is(main,[role="main"]) {color:var(--drb-ui-text);min-width:0;}
html[data-drb-theme] :is(main,[role="main"]) h1 {letter-spacing:-.035em;font-weight:750;}
html[data-drb-theme] :is(main,[role="main"]) :is(h2,h3,h4) {letter-spacing:-.018em;}

/* Side navigation, consistent on every module. No duplicate dashboard preview. */
html[data-drb-theme] aside:has([data-testid^="nav-"]) {
  background:linear-gradient(165deg,var(--sidebar),var(--drb-ui-bg) 140%) !important;
  border-right:1px solid var(--sidebar-border) !important;
}
html[data-drb-theme] [data-testid^="nav-"] {border-radius:10px;transition:background-color .14s ease,color .14s ease;}
html[data-drb-theme] [data-testid^="nav-"]:hover {background:var(--sidebar-accent)!important;}
html[data-drb-theme] [data-testid^="nav-"][aria-current="page"] {
  background:linear-gradient(120deg,#294f93,#285cae)!important;
  color:#fff!important;
  box-shadow:inset 3px 0 #60acff;
}
html[data-drb-theme] .drb17-preview-nav {display:none!important;}

/* Card system used by dashboard, patients, stock, finance, appointments etc. */
html[data-drb-theme] :is([data-slot="card"], main .valora-lift) {
  border-radius:var(--drb-ui-radius)!important;
  border:1px solid var(--drb-ui-line)!important;
  background:var(--drb-ui-panel)!important;
  color:var(--drb-ui-text);
  box-shadow:var(--drb-ui-shadow)!important;
}
html[data-drb-theme="dark"] :is([data-slot="card"],main .valora-lift) {
  background:linear-gradient(150deg,#15283f,#101e32 94%)!important;
}
html[data-drb-theme] :is([data-slot="card-header"],[data-slot="card-footer"]) {border-color:var(--drb-ui-line)!important;}
html[data-drb-theme] :is([data-slot="card-title"], [data-slot="dialog-title"], main h2, main h3) {color:var(--drb-ui-text)!important;}
html[data-drb-theme] [data-slot="card-description"] {color:var(--drb-ui-sub)!important;}
html[data-drb-theme] main [data-testid^="dashboard-lifetime-"] {
  min-height:133px;position:relative;overflow:hidden;
  padding:18px 19px!important;
}
html[data-drb-theme] main [data-testid^="dashboard-lifetime-"] > div:first-child > div {
  border-radius:12px!important;width:43px;height:43px;
  border-color:transparent!important;
}
html[data-drb-theme="dark"] main [data-testid^="dashboard-lifetime-"] > div:first-child > div {
  background:linear-gradient(145deg,#145e5a,#0e464b)!important;
}
html[data-drb-theme="light"] main [data-testid^="dashboard-lifetime-"] > div:first-child > div {
  background:#e8f5f6!important;
}
html[data-drb-theme] main [data-testid^="dashboard-lifetime-"] > p:nth-child(2) {
  font-variant-numeric:tabular-nums;letter-spacing:-.04em;
  font-size:clamp(20px,2.1vw,29px);
}
html[data-drb-theme="dark"] main [data-testid^="dashboard-lifetime-"] > p:nth-child(2).text-emerald-400 {color:#2adfae!important;}
html[data-drb-theme="light"] main [data-testid^="dashboard-lifetime-"] > p:nth-child(2).text-emerald-400 {color:#087f72!important;}
/* Other summary cards with existing React class names */
html[data-drb-theme] main .bg-\[\#111827\] {
  background:var(--drb-ui-panel)!important;
  border-color:var(--drb-ui-line)!important;
}
html[data-drb-theme="dark"] main .bg-\[\#111827\] {background:#14243a!important;}
html[data-drb-theme] main .bg-\[\#0F172A\] {background:var(--drb-ui-panel-2)!important;}

/* Topbar, filters, buttons and inputs: consistent across all route screens */
html[data-drb-theme] :is([data-slot="button"],button.valora-press) {
  border-radius:10px;
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease;
}
html[data-drb-theme] :is([data-slot="button"].bg-primary,button.bg-primary) {
  background:#326bca!important;color:#fff!important;
}
html[data-drb-theme] :is([data-slot="button"].bg-primary,button.bg-primary):hover {background:#285cbd!important;}
html[data-drb-theme] :is([data-slot="input"],[data-slot="select-trigger"],input:not([type="checkbox"]):not([type="radio"]),textarea,select) {
  border-radius:10px;
  background:var(--drb-ui-panel-2)!important;
  border-color:var(--drb-ui-line)!important;
  color:var(--drb-ui-text)!important;
}
html[data-drb-theme] :is(input,textarea)::placeholder {color:var(--drb-ui-sub)!important;opacity:.85;}
html[data-drb-theme] :is(input,textarea,select,button,[role="button"],a):focus-visible {
  outline:2px solid #61a5fb;outline-offset:2px;
}
html[data-drb-theme] :is([data-slot="tabs-list"],[role="tablist"]) {
  border-radius:12px;background:var(--drb-ui-panel-2)!important;border-color:var(--drb-ui-line)!important;
}
html[data-drb-theme] [data-slot="tabs-trigger"][data-state="active"] {
  background:#3469c8!important;color:#fff!important;
}

/* Tables and filters. Scrolling stays native; table sorting script is unaffected. */
html[data-drb-theme] main :is(table,[data-slot="table"]) {font-variant-numeric:tabular-nums;}
html[data-drb-theme] main :is(thead,[data-slot="table-header"]) {
  background:var(--drb-ui-panel-2)!important;
}
html[data-drb-theme] main :is(th,[data-slot="table-head"]) {
  color:var(--drb-ui-sub)!important;font-weight:650;
  border-color:var(--drb-ui-line)!important;
}
html[data-drb-theme] main :is(td,[data-slot="table-cell"]) {border-color:var(--drb-ui-line)!important;}
html[data-drb-theme] main tbody tr:hover {background:var(--drb-ui-hover)!important;}
html[data-drb-theme] main :is([data-slot="table-row"],tr) {border-color:var(--drb-ui-line)!important;}
html[data-drb-theme] .drb-f-toolbar {border-color:var(--drb-ui-line)!important;background:var(--drb-ui-panel)!important;border-radius:12px;}
html[data-drb-theme] .drb-f-btn {border-radius:9px;}
html[data-drb-theme] :is(.drb-f-panel,.drb-f-dialog) {border-color:var(--drb-ui-line)!important;}

/* Dialog color, not geometry. Existing 1060px clinical dialog untouched. */
html[data-drb-theme] :is([role="dialog"],[data-slot="dialog-content"],[data-slot="popover-content"],[role="menu"]) {
  background:var(--drb-ui-panel)!important;color:var(--drb-ui-text)!important;
  border-color:var(--drb-ui-line)!important;
}
html[data-drb-theme] :is([role="dialog"],[data-slot="dialog-content"]) :is(h2,h3) {color:var(--drb-ui-text)!important;}
html[data-drb-theme] [data-slot="dialog-header"] {border-color:var(--drb-ui-line)!important;}

/* Light palette: do not bleach colored status/chips/buttons. */
html[data-drb-theme="light"] main :is(.text-white,.text-slate-100,.text-slate-200) {color:#1b304c!important;}
html[data-drb-theme="light"] main :is(.text-slate-300,.text-slate-400,.text-slate-500) {color:#637892!important;}
html[data-drb-theme="light"] :is([data-slot="button"],button,a)[class*="bg-blue-"] {color:#fff!important;}
html[data-drb-theme="light"] :is([data-slot="button"],button,a).bg-primary {color:#fff!important;}
html[data-drb-theme="light"] main .bg-\[\#090D14\] {background:#f1f6fc!important;}
html[data-drb-theme="light"] main .bg-\[\#0D131F\] {background:#f1f6fc!important;}
html[data-drb-theme="light"] main .bg-\[\#1E293B\] {background:#e5effa!important;}
html[data-drb-theme="light"] [data-slot="badge"] {border-color:var(--drb-ui-line)!important;}

/* IMPORTANT: feature panels are route-specific, never stick across pages. */
html:not([data-drb-route="/patients"]) #drb-f-patient-tools,
html:not([data-drb-route="/stock"]) #drb-f-stock-tools {display:none!important;}

/* No CSS transform on main content or dialog widths; avoid previous regressions. */
@media(max-width:768px){
 html[data-drb-theme] main [data-testid^="dashboard-lifetime-"] {min-height:112px;padding:15px!important;}
 html[data-drb-theme] :is([data-slot="card"],main .valora-lift){border-radius:13px!important;}
}
@media(prefers-reduced-motion:reduce){html[data-drb-theme] *{scroll-behavior:auto!important;}}