/* Localização: /uiux/css/design_tokens.css */
/* Nome: design_tokens.css */
/* Linguagem: CSS */

:root {
  /* ── Cores Base ── */
  --cor-bg-base:       #0d0f12;
  --cor-bg-card:       #131619;
  --cor-bg-elevado:    #1a1e23;
  --cor-bg-input:      #10131a;
  --cor-borda:         #23272e;
  --cor-borda-foco:    #f5a623;

  /* ── Cores de Texto ── */
  --cor-texto:         #e2e2e2;
  --cor-texto-secundario: #8a8f98;
  --cor-texto-muted:   #555a63;

  /* ── Cores de Destaque ── */
  --cor-accent:        #f5a623;
  --cor-accent-hover:  #e69b1e;
  --cor-accent-bg:     rgba(245, 166, 35, 0.08);

  /* ── Cores de Status ── */
  --cor-sucesso:       #2ed87e;
  --cor-sucesso-bg:    rgba(46, 216, 126, 0.10);
  --cor-erro:          #f25c5c;
  --cor-erro-bg:       rgba(242, 92, 92, 0.10);
  --cor-alerta:        #f5a623;
  --cor-alerta-bg:     rgba(245, 166, 35, 0.10);
  --cor-info:          #4d9fff;
  --cor-info-bg:       rgba(77, 159, 255, 0.10);

  /* ── Tipografia ── */
  --font-principal:    'Barlow', sans-serif;
  --font-condensada:   'Barlow Condensed', sans-serif;
  --font-mono:         'JetBrains Mono', monospace;

  --font-xs:           0.7rem;
  --font-sm:           0.8rem;
  --font-md:           0.875rem;
  --font-lg:           1rem;
  --font-xl:           1.25rem;
  --font-2xl:          1.5rem;

  /* ── Espaçamento ── */
  --gap-xs:            4px;
  --gap-sm:            8px;
  --gap-md:            12px;
  --gap-lg:            16px;
  --gap-xl:            24px;
  --gap-2xl:           32px;

  /* ── Raios ── */
  --radius-sm:         4px;
  --radius-md:         6px;
  --radius-lg:         10px;
  --radius-xl:         14px;

  /* ── Sombras ── */
  --sombra-sm:         0 1px 3px rgba(0,0,0,0.3);
  --sombra-md:         0 4px 12px rgba(0,0,0,0.4);
  --sombra-lg:         0 8px 24px rgba(0,0,0,0.5);

  /* ── Transições ── */
  --transicao:         0.2s ease;
}