/* AXION — Design tokens.
   Tema claro é o padrão; o tema escuro é aplicado por [data-theme="dark"]
   no elemento raiz (definido pelo usuário ou por prefers-color-scheme). */

:root {
  /* Marca */
  --color-primary: #5468ff;
  --color-primary-hover: #4356e6;
  --color-primary-soft: #eef0ff;
  --color-accent: #12b5a6;

  /* Estados */
  --color-success: #16a34a;
  --color-success-soft: #e7f6ed;
  --color-warning: #d97706;
  --color-warning-soft: #fdf2e3;
  --color-danger: #dc2626;
  --color-danger-soft: #fdeaea;
  --color-info: #2563eb;
  --color-info-soft: #e8effd;

  /* Superfícies */
  --bg-app: #f4f6fb;
  --bg-surface: #ffffff;
  --bg-surface-2: #f8fafc;
  --bg-hover: #f1f5f9;
  --bg-sidebar: #0f1420;
  --bg-sidebar-hover: #1a2133;
  --bg-sidebar-active: #232c44;

  /* Texto */
  --text-strong: #0f172a;
  --text: #334155;
  --text-muted: #64748b;
  --text-faint: #94a3b8;
  --text-on-dark: #e2e8f0;
  --text-on-dark-muted: #8a97ae;
  --text-inverse: #ffffff;

  /* Bordas e sombras */
  --border: #e2e8f0;
  --border-strong: #cbd5e1;
  --border-dark: #232c44;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --shadow: 0 4px 16px rgba(15, 23, 42, .08);
  --shadow-lg: 0 18px 48px rgba(15, 23, 42, .18);

  /* Escala de espaçamento (4px) */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-full: 999px;

  --font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", Consolas, monospace;

  --fs-xs: 11.5px; --fs-sm: 12.5px; --fs-base: 13.5px;
  --fs-md: 15px;   --fs-lg: 18px;   --fs-xl: 22px; --fs-2xl: 28px;

  --sidebar-w: 256px;
  --sidebar-w-collapsed: 68px;
  --topbar-h: 58px;
  --transition: 160ms cubic-bezier(.4, 0, .2, 1);
  --z-drawer: 60; --z-modal: 70; --z-palette: 80; --z-toast: 90;
}

[data-theme="dark"] {
  --color-primary: #6d7fff;
  --color-primary-hover: #8290ff;
  --color-primary-soft: #1c2340;
  --color-accent: #2dd4bf;

  --color-success-soft: #10291b;
  --color-warning-soft: #2c1f0c;
  --color-danger-soft: #2d1414;
  --color-info-soft: #15203c;

  --bg-app: #080b12;
  --bg-surface: #111826;
  --bg-surface-2: #161f30;
  --bg-hover: #1b2435;
  --bg-sidebar: #0b0f18;
  --bg-sidebar-hover: #161f30;
  --bg-sidebar-active: #212c45;

  --text-strong: #f1f5f9;
  --text: #cbd5e1;
  --text-muted: #94a3b8;
  --text-faint: #64748b;

  --border: #1f2937;
  --border-strong: #2c3a4f;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow: 0 6px 20px rgba(0, 0, 0, .45);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, .6);
}