/* Cores dos portais (empresa e administração), iguais às do CRM: claro e escuro.
   Segue o aparelho (prefers-color-scheme); a escolha "Claro" ou "Escuro" no menu grava data-theme no <html>. */
:root {
  --bg: #f5f5f2;
  --surface: #ffffff;
  --sunk: #f0f0eb;
  --hover: #f0f0eb;
  --line: #dcdcd5;
  --line-2: #ecece6;
  --line-3: #bdbdb5;
  --fg: #0e0e0e;
  --mute: #55554f;
  --faint: #8e8e87;
  --brand: #c2410c;
  --brand-mark: #c2410c;
  --on-brand: #ffffff;
  --brand-soft: rgba(194, 65, 12, 0.1);
  --inv-bg: #0e0e0e;
  --inv-fg: #f5f5f2;
  --inv-mute: #bdbdb5;
  --inv-line: #3a3a36;
  --side-bg: #0e0e0e;
  --side-fg: #f5f5f2;
  --side-mute: #bdbdb5;
  --side-line: #2e2e2b;
  --side-hover: #1c1c1a;
  --map-bg: #e4e4dd;
  --ok: #1f6b3a;
  --ok-soft: #e4f1e8;
  --bad: #a1321f;
  --bad-soft: #f8e6e2;
  --warn: #8a5a00;
  --warn-soft: #f8efd9;
  --scrim: rgba(14, 14, 14, 0.5);
  --shadow: none;
  --shadow-lg: 0 12px 48px rgba(14, 14, 14, 0.18);
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  /* nomes usados nas telas antigas (styles.css) */
  --ink: var(--fg);
  --muted: var(--mute);
  --soft: var(--sunk);
  --green: var(--fg);
  --orange: var(--fg);
  --lime: var(--bg);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #121211;
    --surface: #1a1a18;
    --sunk: #20201e;
    --hover: #20201e;
    --line: #2e2e2b;
    --line-2: #262624;
    --line-3: #4a4a45;
    --fg: #f2f2ee;
    --mute: #a9a9a1;
    --faint: #77776f;
    --brand: #ea6a2f;
    --on-brand: #0e0e0e;
    --brand-soft: rgba(234, 106, 47, 0.16);
    --inv-bg: #f2f2ee;
    --inv-fg: #0e0e0e;
    --inv-mute: #55554f;
    --inv-line: #dcdcd5;
    --side-bg: #0a0a09;
    --side-fg: #f2f2ee;
    --side-mute: #9a9a92;
    --side-line: #262624;
    --side-hover: #181816;
    --map-bg: #20201e;
    --ok: #6cc08a;
    --ok-soft: #15291c;
    --bad: #f08a73;
    --bad-soft: #3a1c15;
    --warn: #e3b341;
    --warn-soft: #352a10;
    --scrim: rgba(0, 0, 0, 0.6);
    --shadow-lg: 0 12px 48px rgba(0, 0, 0, 0.6);
    color-scheme: dark;
  }
}
:root[data-theme='dark'] {
  --bg: #121211;
  --surface: #1a1a18;
  --sunk: #20201e;
  --hover: #20201e;
  --line: #2e2e2b;
  --line-2: #262624;
  --line-3: #4a4a45;
  --fg: #f2f2ee;
  --mute: #a9a9a1;
  --faint: #77776f;
  --brand: #ea6a2f;
  --on-brand: #0e0e0e;
  --brand-soft: rgba(234, 106, 47, 0.16);
  --inv-bg: #f2f2ee;
  --inv-fg: #0e0e0e;
  --inv-mute: #55554f;
  --inv-line: #dcdcd5;
  --side-bg: #0a0a09;
  --side-fg: #f2f2ee;
  --side-mute: #9a9a92;
  --side-line: #262624;
  --side-hover: #181816;
  --map-bg: #20201e;
  --ok: #6cc08a;
  --ok-soft: #15291c;
  --bad: #f08a73;
  --bad-soft: #3a1c15;
  --warn: #e3b341;
  --warn-soft: #352a10;
  --scrim: rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 12px 48px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}