/* ════════════════════════════════════════════════════════════════════════════
   KITEBIZ Design System — Tokens
   ════════════════════════════════════════════════════════════════════════════
   2 temas: Light (default) e Dark. Preferência persiste em
   localStorage.kb_theme; futuramente em users.metadata.theme.

   Terminal interno (Tokyo Night) é ILHA INTENCIONAL — cores hardcoded
   nas regras de xterm/.kb-pane/etc, NÃO usam estas variáveis.

   Doc: docs/STATE.md §"Design System".
   ════════════════════════════════════════════════════════════════════════════ */

/* ─── Light KITEBIZ (default — identidade marca) ─── */
:root, :root[data-theme="light"] {
  --surface-base:  #f5f3ed;
  --surface-1:     #ffffff;
  --surface-2:     #fbfaf5;
  --surface-3:     #efece4;
  --surface-elev:  #ffffff;

  --border-subtle: rgba(20, 20, 30, 0.06);
  --border-default: rgba(20, 20, 30, 0.12);
  --border-strong: rgba(20, 20, 30, 0.20);

  --text-primary:   #14141e;
  --text-secondary: #3a3a4a;
  --text-muted:     #7a7a88;
  --text-disabled:  #b8b8c0;

  --brand:        #1ebe5d;
  --brand-hover:  #17a14e;
  --brand-tint-10: rgba(30, 190, 93, 0.10);
  --brand-tint-20: rgba(30, 190, 93, 0.18);
  --brand-fg:     #ffffff;

  --success:    #1ebe5d;
  --success-bg: rgba(30, 190, 93, 0.12);
  --warn:       #d97a06;
  --warn-bg:    rgba(253, 187, 87, 0.18);
  --danger:     #d63040;
  --danger-bg:  rgba(214, 48, 64, 0.10);
  --info:       #1d6fc4;
  --info-bg:    rgba(29, 111, 196, 0.10);
}

/* ─── Dark KITEBIZ (warm dark, mesma identidade) ─── */
:root[data-theme="dark"] {
  --surface-base:  #181614;
  --surface-1:     #1f1d1a;
  --surface-2:     #28251f;
  --surface-3:     #33302a;
  --surface-elev:  #3a3631;

  --border-subtle:  rgba(253, 247, 237, 0.06);
  --border-default: rgba(253, 247, 237, 0.10);
  --border-strong:  rgba(253, 247, 237, 0.16);

  --text-primary:   #f5f3ed;
  --text-secondary: #c8c4ba;
  --text-muted:     #807a70;
  --text-disabled:  #4a4540;

  --brand:        #25d366;
  --brand-hover:  #1ec459;
  --brand-tint-10: rgba(37, 211, 102, 0.10);
  --brand-tint-20: rgba(37, 211, 102, 0.20);
  --brand-fg:     #08110b;

  --success:    #25d366;
  --success-bg: rgba(37, 211, 102, 0.12);
  --warn:       #fdbb57;
  --warn-bg:    rgba(253, 187, 87, 0.15);
  --danger:     #ef4444;
  --danger-bg:  rgba(239, 68, 68, 0.12);
  --info:       #5fa8e8;
  --info-bg:    rgba(95, 168, 232, 0.10);
}

/* ─── Tipografia + escala ─── */
:root {
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;

  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 14px;
  --text-lg:   16px;
  --text-xl:   20px;
  --text-2xl:  24px;

  --leading-tight:   1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.7;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-pill: 9999px;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* ─── Terminal interno: ILHA Tokyo Night — NÃO usa tokens acima ─── */
/* Variáveis fixas pra referência (cosmetic). Cores reais devem ficar
   inline nas regras de .kb-pane/.kb-xterm/etc — não trocar por var(). */
:root {
  --terminal-bg:     #1a1b26;
  --terminal-fg:     #c0caf5;
  --terminal-accent: #7dcfff;
  --terminal-border: #414868;
}