/* ============================================================================
   ehr-credify#420 (Calendar V233) - dark mode.
   On when <html data-theme="dark">: index.html's applyTheme(), from the signed-in person's own
   Appearance (users.personalTheme, on their Provider Profile in the EHR; /api/state me.theme).
   - The tokens below re-color everything the page draws with var(--...). The sidebar sets its own
     (already dark) tokens and keeps them.
   - Between the dark:generated markers: the rules that hard-code a color, from
     scripts/gen-dark-theme.mjs. Regenerate after changing those rules (test/darkTheme.test.js checks).
   Palette (the EHR's): a green-tinted near-black page, slightly lighter cards, light text; the brand
   green, red and amber lifted so they read on dark.
   ============================================================================ */
:root[data-theme='dark'] {
  color-scheme: dark;
  --bg: #0f1714;
  --paper: #17211d;
  --ink: #e6efe9;
  --teal: #27a07a;
  --deep: #5cc49c;
  --accent1: #34b88d;
  --accent2: #4cc79e;
  --b2: #15302a;
  --mut: #9db3a8;
  --mut2: #8aa598;
  --mut3: #1d3d33;
  --mint: #15302a;
  --mint2: #1d3d33;
  --surface: #16201c;
  --warn: #f0a23b;
  --warn-bg: #33280f;
  --danger: #ef6b5e;
  --danger-bg: #3a1d1b;
  --border-default: #2a3a33;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 24px 70px rgba(0, 0, 0, 0.6);
  /* The colors the page's scripts write inline (style="background:var(--inl-paper,#fff)"): each falls back
     to its light color, so these exist only here. Not re-declared by the sidebar, so they hold there too. */
  --inl-paper: #17211d;
  --inl-surface: #16201c;
  --inl-mint: #15302a;
  --inl-ink: #e6efe9;
  --inl-mut: #9db3a8;
  --inl-border: #2a3a33;
  --inl-warn-bg: #33280f;
  --inl-danger-bg: #3a1d1b;
  --inl-deep: #5cc49c;
  --inl-weekend: #131c18;
  /* V262 (#190): the Appointment history window's light teal field borders */
  --hh-line: #2f5a49;
}
:root[data-theme='dark'] body {
  background: var(--bg);
  color: var(--ink);
}
/* Form controls the browser draws: dark fields, light text, a visible placeholder (zero specificity). */
:where(:root[data-theme='dark']) :where(input, select, textarea) {
  background-color: var(--paper);
  color: var(--ink);
  border-color: var(--border-default);
}
:where(:root[data-theme='dark']) :where(input, textarea)::placeholder {
  color: var(--mut2);
}
:where(:root[data-theme='dark']) option {
  background: var(--paper);
  color: var(--ink);
}

/* V262 (#190): Appointment history status labels take the status colors inline; lifted so they read on dark */
:where(:root[data-theme='dark']) #hh-root .hh-st {
  filter: brightness(1.5) saturate(1.1);
}

/* dark:generated:start */
/* GENERATED from public/index.html (89 rules): edit the source rule, then run node scripts/gen-dark-theme.mjs */
:where(:root[data-theme="dark"]) .ed-client-link {
  color: #6bdcb7;
}
:where(:root[data-theme="dark"]) .tele-badge {
  color: #58d1ef;
}
:where(:root[data-theme="dark"]) .cc-ev .kebab {
  background: #17211c;
  border: 1px solid #2c4238;
}
:where(:root[data-theme="dark"]) .kebab:hover {
  border-color: #2c4238;
}
:where(:root[data-theme="dark"]) .scroll::-webkit-scrollbar-thumb {
  background: #26463a;
}
:where(:root[data-theme="dark"]) .tb-item[data-tb-item="search"] .searchbox {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ghost {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ghost:hover {
  border-color: #363d47;
}
:where(:root[data-theme="dark"]) .icon-btn {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .icon-btn:hover {
  border-color: #363d47;
}
:where(:root[data-theme="dark"]) .navgroup {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .nav-arrow {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .nav-div {
  background: #2c4238;
}
:where(:root[data-theme="dark"]) .searchbox {
  background: #17211c;
  border: 1px solid #2c4238;
}
:where(:root[data-theme="dark"]) .seg-pref {
  background: #1f2b23;
}
:where(:root[data-theme="dark"]) .seg button.on {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .sidebar .dd.dd-open .dd-menu {
  --ink: #d5ede4;
  --mint: #1b3328;
  background: #17211c;
  border-color: #2c4238;
}
:where(:root[data-theme="dark"]) .sb-menu {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cc-prov {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cc-prov-tx .cc-prov-ok {
  color: #65e1b9;
}
:where(:root[data-theme="dark"]) .cc-prov-tx .cc-prov-dc {
  color: #df6868;
}
:where(:root[data-theme="dark"]) .sidebar .swatch.on {
  box-shadow: 0 0 0 2.5px #0a3d2b,0 0 0 4px #17211c;
}
:where(:root[data-theme="dark"]) .inp {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) #attn-tip {
  background: #17211c;
}
:where(:root[data-theme="dark"]) #attn-tip .tip-divider {
  background: #2c4238;
}
:where(:root[data-theme="dark"]) #attn-tip .tip-billing .bt-warn {
  background: #484127;
}
:where(:root[data-theme="dark"]) #attn-tip .tip-billing .bt-warn.amber {
  color: #ee9958;
  background: #484127;
}
:where(:root[data-theme="dark"]) #attn-tip .tip-billing .bt-warn.red {
  color: #df6868;
  background: #2d1818;
  border-color: #462626;
}
:where(:root[data-theme="dark"]) .modal {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .swatch.on {
  border: 2px solid #17211c;
  box-shadow: 0 0 0 2.5px var(--ink),0 0 0 4px #17211c;
}
:where(:root[data-theme="dark"]) .dur-preset {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .step {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .kpi-panel {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ds-ghost {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cmdk {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ed-readonly-banner {
  background: #312b1a;
  color: #e7935f;
}
:where(:root[data-theme="dark"]) .dd-face {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dd.dd-open .dd-menu {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dd-search {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dd-search-input {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .tgl {
  background: #2c4238;
}
:where(:root[data-theme="dark"]) .set-acc summary:hover {
  background: #1b3328;
  color: #6bdcb7;
}
:where(:root[data-theme="dark"]) .set-acc[open]>summary {
  color: #6bdcb7;
}
:where(:root[data-theme="dark"]) .set-acc[open]>summary .set-acc-chev {
  color: #6bdcb7;
}
:where(:root[data-theme="dark"]) .ctx {
  background: #17211c;
  border: 1px solid #2c4238;
}
:where(:root[data-theme="dark"]) .scope-badge {
  color: #6bdcb7;
}
:where(:root[data-theme="dark"]) .ed-search input {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ed-search-results {
  background: #17211c;
}
:where(:root[data-theme="dark"]) #billing-tip {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .bt-warn.amber {
  background: #30261a;
  color: #ee9958;
  border: 1px solid #5a4630;
}
:where(:root[data-theme="dark"]) .bt-warn.red {
  background: #2d1818;
  color: #d8796f;
  border: 1px solid #462626;
}
:where(:root[data-theme="dark"]) .type-toggle button.on {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .viewas-panel {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .role-sw-panel {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ep-bar {
  background: #2c4238;
}
:where(:root[data-theme="dark"]) .rec-seg {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .rec-dow {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cdp-trigger {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cdp-panel {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cdp-yr-btn {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cdp-yr-menu {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ctp-panel {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cset-menu {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cset-mod-foot {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .cset-save-mine:hover {
  background: #264739;
  color: #68dfb9;
}
:where(:root[data-theme="dark"]) .cset-modhead {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ar-card {
  background: var(--panel,#17211c);
}
:where(:root[data-theme="dark"]) .ar-rm:hover {
  color: var(--red,#d8796f);
}
:where(:root[data-theme="dark"]) .ar-dirty {
  color: var(--amber,#f6b351);
}
:where(:root[data-theme="dark"]) .vdays {
  background: #1f2b23;
}
:where(:root[data-theme="dark"]) .vday:hover:not(.on) {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .vd-note.warn {
  color: #e7935f;
}
:where(:root[data-theme="dark"]) .vd-item {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ms-face {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .ms-menu {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dtp-field-wrap {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dtp-icon-btn {
  border-left: 1px solid #2c4238;
}
:where(:root[data-theme="dark"]) .dtp-panel {
  background: #17211c;
  border: 1px solid #2c4238;
}
:where(:root[data-theme="dark"]) .dtp-nav:hover {
  background: #202d26;
}
:where(:root[data-theme="dark"]) .dtp-wheel-wrap {
  border: 1px solid #2c4238;
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dtp-ampm-btn {
  background: #17211c;
}
:where(:root[data-theme="dark"]) .dtp-footer-row {
  background: #17211c;
}
@media (max-width:900px) {
  :where(:root[data-theme="dark"]) .m-sheet-head {
    background: #17211c;
  }
  :where(:root[data-theme="dark"]) .m-sheet-foot {
    background: #17211c;
  }
  :where(:root[data-theme="dark"]) .kpi-ov {
    background: #17211c;
  }
}
:where(:root[data-theme="dark"]) .hh-pill {
  border: 1px solid #34604b;
}
:where(:root[data-theme="dark"]) .hh-ms-menu {
  border: 1px solid #2d5443;
}
:where(:root[data-theme="dark"]) .hh-row:hover {
  border-color: #3f564b;
}
:where(:root[data-theme="dark"]) .hh-mod.tele {
  color: #58d1ef;
}
/* dark:generated:end */