/* ═══ Theme drawer (Ed 2026-09-27) — the "View all" slide-out: every theme with a live mini-preview, one-click apply,
 * Auto + Colour-blind toggles on top. A right-side panel over the page (not a modal: no dimmed backdrop), Esc or a
 * click outside closes it. Swiss: square, hairlines, ink labels, gold only as the current-theme marker.
 * The sidebar footer row: the existing toggle keeps its height; "All" sits beside it (hidden in the icon rail). */
.emr-theme-row { display: flex; align-items: stretch; gap: 6px; }
.emr-theme-row > .emr-theme-toggle { flex: 1 1 auto; min-width: 0; }
.emr-theme-all {
  flex: 0 0 auto; padding: 0 10px; border: 1px solid var(--emr-sidebar-border); border-radius: 0;
  background: var(--emr-sidebar-bg); color: var(--emr-sidebar-text); font: 600 11px/1 var(--sans);
  letter-spacing: .04em; text-transform: uppercase; cursor: pointer;
}
.emr-theme-all:hover { background: var(--sidebar-hover, var(--emr-bg-subtle)); }
.emr-theme-all:focus-visible { outline: 2px solid var(--emr-sidebar-text); outline-offset: -2px; }
body.emr-sb-rail:not(.emr-sb-expanded) .emr-theme-all { display: none; }

.emr-theme-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 360px; max-width: 100vw; z-index: 99999; /* above the sticky system-health banner (99998), which otherwise hides the drawer head + Auto toggle */
  display: flex; flex-direction: column; background: var(--emr-modal-bg, var(--bg)); color: var(--text);
  border-left: 1px solid var(--border2); box-shadow: -8px 0 24px rgba(0, 0, 0, .18);
  transform: translateX(100%); transition: transform 160ms ease; visibility: hidden;
}
.emr-theme-drawer.is-open { transform: none; visibility: visible; }
.emr-theme-drawer-head {
  display: flex; align-items: center; justify-content: space-between; padding: 12px 16px;
  border-bottom: 2px solid var(--rule); font: 700 13px/1.2 var(--sans); letter-spacing: .06em; text-transform: uppercase;
}
.emr-theme-drawer-close { border: 1px solid var(--border2); background: transparent; color: var(--text); border-radius: 0; width: 28px; height: 28px; cursor: pointer; font-size: 16px; line-height: 1; }
.emr-theme-drawer-settings { padding: 10px 16px; border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 8px; }
.emr-theme-drawer-setting { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; }
.emr-theme-drawer-setting small { display: block; color: var(--text3); font-size: 11px; }
.emr-theme-drawer-setting select { border-radius: 0; font-size: 11px; }
.emr-theme-drawer-list { flex: 1 1 auto; overflow-y: auto; padding: 6px 0; }
.emr-theme-option {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 16px; border: 0; border-left: 3px solid transparent;
  background: transparent; color: var(--text); text-align: left; cursor: pointer; border-radius: 0;
}
.emr-theme-option:hover { background: var(--bg2); }
.emr-theme-option:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
.emr-theme-option[aria-checked="true"] { border-left-color: var(--accent, #F5A623); }
.emr-theme-option-name { font: 700 13px/1.2 var(--sans); }
.emr-theme-option-use { color: var(--text3); font-size: 11px; margin-top: 2px; }
.emr-theme-option-now { margin-left: auto; font: 700 10px/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--text3); }
/* the mini-preview: the theme's ground, a panel, two ink lines, a hairline and a status mark — its own colours, whatever
 * theme the page is in (inline custom properties per swatch, set by themeDrawer.js) */
.emr-theme-swatch {
  flex: 0 0 auto; width: 64px; height: 44px; position: relative; background: var(--sw-ground);
  border: 1px solid var(--sw-hair); box-sizing: border-box;
}
.emr-theme-swatch::before { content: ''; position: absolute; left: 6px; top: 6px; right: 6px; bottom: 6px; background: var(--sw-panel); border-top: 2px solid var(--sw-ink); }
.emr-theme-swatch i { position: absolute; left: 10px; height: 3px; background: var(--sw-ink); }
.emr-theme-swatch i:nth-child(1) { top: 16px; width: 30px; }
.emr-theme-swatch i:nth-child(2) { top: 24px; width: 20px; opacity: .6; }
.emr-theme-swatch b { position: absolute; right: 10px; top: 22px; width: 7px; height: 7px; border-radius: 50%; background: var(--sw-status); }

/* Settings at the top of the drawer (themeSettings.js, themes gate c): Auto day/night + colour-blind safe. */
.emr-theme-settings { display: flex; flex-direction: column; gap: 6px; }
.emr-theme-set-row { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text); cursor: pointer; }
.emr-theme-set-auto { display: flex; gap: 8px; padding-left: 22px; }
.emr-theme-set-auto[data-off] { opacity: .55; }
.emr-theme-set-pick { display: flex; align-items: center; gap: 4px; font-size: 11px; color: var(--text2); }
.emr-theme-set-select { font-size: 11px; background: var(--bg); color: var(--text); border: 1px solid var(--border2); border-radius: 0; }