/* Clean/Dark themes, mirroring Advanced Deposits' three-theme pattern (Light =
   original/default, no attribute; Clean = data-swp-ui="v1"; Dark = +data-theme="dark").
   Since app.css routes almost every color through the :root custom properties
   below, reskinning is just overriding those properties at the two selectors —
   no per-component overrides needed beyond the couple of hardcoded exceptions
   noted inline. Color values match Advanced Deposits' Clean/Dark palette so the
   fleet looks consistent when someone switches themes across apps. */
.theme-control { display: inline-flex; align-items: center; gap: .35rem; flex-shrink: 0; }
.theme-control-icon { width: 15px; height: 15px; color: var(--muted); flex-shrink: 0; }
.theme-select {
  padding: .3rem 1.5rem .3rem .5rem; border-radius: 20px; font: 600 12px inherit;
  cursor: pointer; background: var(--panel); border: 1px solid var(--border); color: var(--ink);
}
.theme-select:focus { outline: 2px solid var(--brand); outline-offset: 1px; }

html[data-swp-ui="v1"] {
  color-scheme: light;
  --brand: #2563eb; --brand-dark: #1d4ed8; --brand-soft: #dbeafe;
  --ink: #1e293b; --muted: #64748b;
  --border: #e2e8f0; --border2: #e2e8f0;
  --bg: #f1f5f9; --panel: #fff; --soft: #f8fafc; --btn-bg: #f8fafc;
  --ok: #15803d;
  --warn: #456f9d; --warn-soft: #e7f0fa; --warn-border: #cbd5e1;
  --danger: #b91c1c; --danger-soft: #fee2e2; --danger-border: #cbd5e1;
  --overlay: rgba(2, 6, 23, .58);
  --shadow: 0 12px 32px rgba(15, 23, 42, .09);
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, sans-serif;
}

html[data-swp-ui="v1"][data-theme="dark"] {
  color-scheme: dark;
  --brand: #91afd2; --brand-dark: #a3bdd9; --brand-soft: rgba(145, 175, 210, .18);
  --ink: #e1e4e8; --muted: #b4bbc3;
  --border: #59636e; --border2: #59636e;
  --bg: #22262b; --panel: #373d44; --soft: #454c54; --btn-bg: #454c54;
  --ok: #93b99f;
  --warn: #9db9d6; --warn-soft: rgba(109, 145, 183, .2); --warn-border: #6b7682;
  --danger: #d29595; --danger-soft: rgba(174, 96, 96, .2); --danger-border: #6b7682;
  --overlay: rgba(7, 9, 11, .6);
  --shadow: 0 16px 36px rgba(7, 9, 11, .3);
}

/* Row striping/hover states aren't variable-driven in app.css (they're plain
   :hover/:nth-child rules with no color at all in Light — nothing to override),
   but Dark needs a touch more contrast between adjacent rows than "no styling". */
html[data-swp-ui="v1"][data-theme="dark"] .entry-table tbody tr:hover td,
html[data-swp-ui="v1"][data-theme="dark"] .card-table tbody tr:hover td {
  background: rgba(255, 255, 255, .035);
}
