/* Bully Max admin theme switch (Matt, Nov 8, 2026): employee dashboards are light by default, with a moon/sun toggle
   to night mode. Customer-facing pages never load this file and stay black. Light overrides every surface token the
   three apps use (rewards/timeclock: --bg --fg --muted --line --panel --panel-2; reviews: --card --surface --bad). */
html[data-theme="light"] { --bg: #ffffff; --fg: #111111; --muted: #6b6b6b; --line: #e3e3e3; --panel: #f7f7f7; --panel-2: #ededed;
  --card: #f7f7f7; --surface: #ededed; --danger: #d93025; --bad: #c5221f; --ok: #1e8e3e; color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
html[data-theme="light"] img.wordmark, html[data-theme="light"] .brand img, html[data-theme="light"] img[src*="wordmark-white"] { filter: invert(1); }
html[data-theme="light"] input, html[data-theme="light"] select, html[data-theme="light"] textarea { background: #ffffff; color: var(--fg); }
html[data-theme="light"] .hubframe { background: #ffffff; }
html[data-theme="light"] .badge, html[data-theme="light"] .tag.solid, html[data-theme="light"] .toast, html[data-theme="light"] .tabs b, html[data-theme="light"] .btn:not(.ghost):not(.primary):not(.danger) { color: inherit; }
html[data-theme="light"] .btn.primary, html[data-theme="light"] .badge, html[data-theme="light"] .toast, html[data-theme="light"] .tabs b { color: #fff; }
html[data-theme="light"] .applink { border-color: rgba(0,0,0,.25); color: #111; background: rgba(0,0,0,.04); }
html[data-theme="light"] .flags span { background: #fde7d9; color: #8a3a0c; }
html[data-theme="light"] .receipt { background: #f7f7f7; }
.bm-theme-btn { width: 36px; height: 36px; border-radius: 18px; border: 1px solid var(--line); background: var(--panel); color: var(--fg); display: inline-grid; place-items: center; font-size: 16px; line-height: 1; cursor: pointer; padding: 0; flex: none; }
.bm-theme-btn:hover { border-color: var(--orange, #F05A12); }

html[data-theme="light"] { --text-2: #333333; --flag-bg: #fde7d9; --flag-fg: #8a3a0c; --flag-red-bg: #fde0de; --pill-line: rgba(0,0,0,.25); --pill-bg: rgba(0,0,0,.04); --hit: rgba(0,0,0,.05); }
html[data-theme="dark"] { --text-2: #dddddd; --flag-bg: #2a1208; --flag-fg: #ffb38a; --flag-red-bg: #2a0808; --pill-line: rgba(255,255,255,.28); --pill-bg: rgba(255,255,255,.06); --hit: rgba(255,255,255,.04); }
/* Light-theme readability pass (Matt, Nov 8, 2026, 10:25: "lots of grey on white that is hard to read"): muted copy darker, every orange fill keeps white text (contrast lock), hover rows and highlighted rows use the panel tone, never black. */
html[data-theme="light"] { --muted: #5f5f5f; }
html[data-theme="light"] .muted, html[data-theme="light"] .fine, html[data-theme="light"] small, html[data-theme="light"] .k, html[data-theme="light"] .tile .k, html[data-theme="light"] .kpi .k { color: #5f5f5f; }
html[data-theme="light"] .tag.solid, html[data-theme="light"] .pill.in, html[data-theme="light"] .pill.approved, html[data-theme="light"] .pill.accepted, html[data-theme="light"] .tag.approved, html[data-theme="light"] .tag.kind.in, html[data-theme="light"] .btn-big.primary, html[data-theme="light"] .acal .p.approved { color: #fff; }
html[data-theme="light"] .tips li { color: #333; }
html[data-theme="light"] tr.on td, html[data-theme="light"] tr.selected td, html[data-theme="light"] tr.sel td { background: var(--panel-2); }

.bm-theme-btn svg{display:block;width:20px;height:20px}.bm-theme-btn{display:inline-flex;align-items:center;justify-content:center}