/* Tokens do Figma «LeadFlow — Redesign UX» (variáveis reais, modos Claro/Escuro). Fonte: docs/redesign/tokens.css.
   Telas usam os tokens semânticos; os nomes curtos (--bg, --fg…) são alias para as telas antigas. */
:root,
[data-theme='light'] {
  color-scheme: light;
  --brand-600: #1a57c7;
  --text-primary: #17243b;
  --text-secondary: #63738a;
  --surface-canvas: #f5f7fc;
  --surface-card: #ffffff;
  --border-default: #dee4ed;
  --signal-positive: #128c6e;
  --signal-attention: #994f0a;
  --signal-urgent: #bf3338;
  --signal-information: #1a57c7;
  --surface-information: #eaf2ff;
  --surface-positive: #e7f5ef;
  --surface-attention: #fff4e3;
  --surface-urgent: #fdebec;
  --navigation-icon-default: #a8b8cc;
  --navigation-icon-active: #ffffff;
  --navigation-surface: #16243b;
  --navigation-border: #2b3d59;
  --navigation-text: #ffffff;
  --navigation-secondary: #a8b8cc;
  --navigation-positive: #5cd19e;
  --bg-canvas: var(--surface-canvas);
  --bg-surface: var(--surface-card);
  --bg-subtle: #f4f7fb;
  --text-default: var(--text-primary);
  --text-muted: var(--text-secondary);
  --sem-border-default: var(--border-default);
  --action-primary: var(--brand-600);
  --status-ai: #574094;
  --status-ai-surface: #f4f0fb;
  --status-success: var(--signal-positive);
  --status-warning: var(--signal-attention);
  --status-error: var(--signal-urgent);
  --state-focus: #1c5ed9;
  --tenant-casaecia: #127080;
  --action-on-primary: #ffffff;
  /* espaçamento e raios */
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --radius-md: 12px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --radius-control: 8px;
  --radius-surface: 12px;
  --radius-large: 16px;
  --radius-pill: 999px;
  /* tipografia (Inter) */
  --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --type-display-size: 28px;
  --type-display-line: 36px;
  --type-display-weight: 700;
  --type-title-size: 22px;
  --type-title-line: 30px;
  --type-title-weight: 600;
  --type-section-size: 16px;
  --type-section-line: 24px;
  --type-section-weight: 600;
  --type-body-size: 14px;
  --type-body-line: 22px;
  --type-body-weight: 400;
  --type-body-mobile-size: 16px;
  --type-body-mobile-line: 24px;
  --type-body-mobile-weight: 400;
  --type-label-size: 13px;
  --type-label-line: 20px;
  --type-label-weight: 500;
  --type-caption-size: 12px;
  --type-caption-line: 18px;
  --type-caption-weight: 400;
  --type-button-size: 14px;
  --type-button-line: 20px;
  --type-button-weight: 600;
  --type-data-size: 24px;
  --type-data-line: 30px;
  --type-data-weight: 600;
  /* efeito */
  --elevation-popover: 0 8px 24px rgba(10, 20, 41, 0.12);
}

[data-theme='dark'] {
  color-scheme: dark;
  --brand-600: #78a2ff;
  --text-primary: #f2f5fa;
  --text-secondary: #a8b5c9;
  --surface-canvas: #0b1220;
  --surface-card: #151f30;
  --border-default: #2c3a50;
  --signal-positive: #54c9a5;
  --signal-attention: #f2b86b;
  --signal-urgent: #f27c84;
  --signal-information: #78a2ff;
  --surface-information: #1a2b45;
  --surface-positive: #16372f;
  --surface-attention: #3a2d1e;
  --surface-urgent: #3a1e24;
  --navigation-icon-default: #a8b8cc;
  --navigation-icon-active: #ffffff;
  --navigation-surface: #16243b;
  --navigation-border: #2b3d59;
  --navigation-text: #ffffff;
  --navigation-secondary: #a8b8cc;
  --navigation-positive: #5cd19e;
  --bg-subtle: #131c2d;
  --status-ai: #baa6f7;
  --status-ai-surface: #241f38;
  --state-focus: #91b8ff;
  --tenant-casaecia: #4dc4cc;
  --action-on-primary: #0b1220;
}

@media (prefers-color-scheme:dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --brand-600: #78a2ff;
    --text-primary: #f2f5fa;
    --text-secondary: #a8b5c9;
    --surface-canvas: #0b1220;
    --surface-card: #151f30;
    --border-default: #2c3a50;
    --signal-positive: #54c9a5;
    --signal-attention: #f2b86b;
    --signal-urgent: #f27c84;
    --signal-information: #78a2ff;
    --surface-information: #1a2b45;
    --surface-positive: #16372f;
    --surface-attention: #3a2d1e;
    --surface-urgent: #3a1e24;
    --navigation-icon-default: #a8b8cc;
    --navigation-icon-active: #ffffff;
    --navigation-surface: #16243b;
    --navigation-border: #2b3d59;
    --navigation-text: #ffffff;
    --navigation-secondary: #a8b8cc;
    --navigation-positive: #5cd19e;
    --bg-subtle: #131c2d;
    --status-ai: #baa6f7;
    --status-ai-surface: #241f38;
    --state-focus: #91b8ff;
    --tenant-casaecia: #4dc4cc;
    --action-on-primary: #0b1220;
  }
}

/* Alias das telas antigas -> tokens (resolvem no uso, então seguem o tema). */
:root {
  --bg: var(--bg-canvas); --surface: var(--bg-surface); --muted: var(--bg-subtle); --line: var(--sem-border-default);
  --fg: var(--text-default); --fg2: var(--text-muted); --accent: var(--action-primary); --on-accent: var(--action-on-primary);
  --ok: var(--text-success); --warn: var(--status-warning); --bad: var(--status-error);
  --b-lead: var(--surface-card); --b-agent: var(--surface-positive); --b-human: var(--surface-information);
  --b-tpl: var(--status-ai-surface); --chat: var(--bg-subtle);
  --s-novo: var(--text-secondary); --s-qual: var(--signal-information); --s-qualif: var(--signal-positive);
  --s-agend: var(--signal-positive); --s-hum: var(--signal-attention); --s-perd: var(--text-secondary); --s-opt: var(--signal-urgent);
  --display: var(--font-family); --body: var(--font-family);
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --shadow: 0 1px 2px rgba(10, 20, 41, .06), 0 1px 3px rgba(10, 20, 41, .08);
  --spacing-xs: var(--space-1); --spacing-lg: var(--space-6); --spacing-xl: var(--space-8); --spacing-2xl: var(--space-10);
  --font-display: var(--font-family);
}
/* Casca: por padrão o menu usa a superfície da tela (como nos PNGs do Figma, claro e escuro).
   Para a barra sempre escura do texto de tokens.md, aponte --nav-* para os tokens --navigation-*. */
:root {
  --on-status: var(--action-on-primary);
  --nav-bg: var(--bg-surface); --nav-border: var(--border-default); --nav-text: var(--text-default);
  --nav-muted: var(--text-secondary); --nav-active-bg: var(--surface-information); --nav-active-text: var(--action-primary);
  --nav-positive: var(--status-success);
}
/* O verde do Figma (#128c6e) dá 4,2:1 em texto pequeno; este passa AA. No escuro o token do Figma já passa. */
:root,
[data-theme='light'] { --text-success: #0e7a5f; }
/* Texto secundário do Figma (#63738a) dá 4,49:1 sobre o canvas #f4f7fb; este passa AA (4,97:1). Só o tema claro. */
:root:not([data-theme='dark']) { --text-secondary: #5c6c84; }
@media (prefers-color-scheme:dark) { :root:not([data-theme='light']) { --text-secondary: #a8b5c9; } }
[data-theme='dark'] { --text-success: var(--signal-positive); }
@media (prefers-color-scheme:dark) { :root:not([data-theme='light']) { --text-success: var(--signal-positive); } }
