:root {
  /* Espaçamento horizontal útil (páginas com .container / lab) */
  --page-pad-x: 32px;
  --page-pad-y: 24px;

  /* Light surfaces */
  --bg0:     #f4f6f9;
  --bg1:     #ffffff;
  --bg2:     #f1f4f8;
  --bg3:     #e6ecf2;

  /* Design tokens (dashboard / lab) */
  --color-background-primary: var(--bg1);
  --color-background-secondary: var(--bg2);
  --color-border-tertiary: rgba(148, 163, 184, 0.45);

  /* Subtle borders for light mode */
  --border:  rgba(15,23,42,0.10);
  --border2: rgba(15,23,42,0.16);

  /* Text on light background */
  --text1:   #0f172a;
  --text2:   #475569;
  --text3:   #94a3b8;

  /* Accent / semantic */
  --green:   #0ea968;
  --green2:  #10c47a;
  --red:     #e63957;
  --red2:    #c92642;
  --amber:   #ea7d20;
  --blue:    #2f7bf2;
  --purple:  #7c3aed;

  /* Brand accent (SVG prefix "trade." uses green #16a34a; UI accent may differ) */
  --brand-orange: #ff7a00;

  /* Breadcrumb “/” (p.ex. Dashboard / Indicadores) — legível em light e dark */
  --breadcrumb-sep: rgba(15, 23, 42, 0.4);

  /* Cartões / painéis aninhados (lab, dashboards) */
  --bg-card: #ffffff;
  --bg-panel-muted: #f5f5f5;
  --border-subtle: rgba(15, 23, 42, 0.08);

  /* Painéis / tabelas (indicators lab) */
  --panel: var(--bg1);
  --score-muted-fill: rgba(15, 23, 42, 0.045);
  --score-bar-track: rgba(15, 23, 42, 0.1);
  --table-sticky-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.14);
  --table-header-shadow: 0 1px 0 var(--border);

  /* Typography */
  --sans: 'Jura', 'Segoe UI', Tahoma, Geneva, sans-serif;
  --mono: 'JetBrains Mono', 'Courier New', Courier, monospace;
}

:root[data-theme="dark"] {
  --bg-card: var(--bg1);
  --bg-panel-muted: var(--bg2);
  --border-subtle: rgba(148, 163, 184, 0.14);

  --bg0:     #0b1220;
  --bg1:     #111a2b;
  --bg2:     #0f172a;
  --bg3:     #1c2940;

  --color-background-primary: var(--bg1);
  --color-background-secondary: var(--bg2);
  --color-border-tertiary: rgba(148, 163, 184, 0.35);

  --border:  rgba(148, 163, 184, 0.22);
  --border2: rgba(148, 163, 184, 0.34);

  --text1:   #e2e8f0;
  --text2:   #a5b4c7;
  --text3:   #6b7b93;

  --green:   #34d399;
  --green2:  #6ee7b7;
  --red:     #fb7185;
  --red2:    #f43f5e;
  --amber:   #f59e0b;
  --blue:    #60a5fa;
  --purple:  #a78bfa;
  --brand-orange: #ff9f45;

  --breadcrumb-sep: rgba(226, 232, 240, 0.45);

  --score-muted-fill: rgba(255, 255, 255, 0.07);
  --score-bar-track: rgba(255, 255, 255, 0.14);
  --table-sticky-shadow: 4px 0 8px -4px rgba(0, 0, 0, 0.55);
  --table-header-shadow: 0 1px 0 var(--border);
}