/* =====================================================
   Note.Ia — Variáveis CSS (Design System)
   Tema escuro · Brand Book v1.0 · Abril 2026
   ===================================================== */

:root {
  /* --- Paleta escura principal --- */
  --ink:          #0B0B0C;
  --ink-2:        #141416;
  --ink-3:        #1C1C1F;
  --line:         #2A2A2E;
  --line-soft:    #1F1F22;
  --paper:        #F2EFE8;
  --paper-dim:    #C9C5BC;
  --paper-mute:   #7B7970;
  --accent:       #d4ff3a;   /* Signal Lime — oklch(88% 0.18 118) */
  --accent-dim:   #a8cc2d;   /* Lime escurecido para hover */
  --accent-ink:   #0B0B0C;   /* Texto sobre fundo lime */
  --warn:         #e6892a;   /* Amarelo-âmbar para avisos */

  /* --- Semânticas de estado --- */
  --cor-sucesso:       #4ade80;
  --cor-sucesso-fundo: rgba(74, 222, 128, 0.12);
  --cor-aviso:         #e6892a;
  --cor-aviso-fundo:   rgba(230, 137, 42, 0.12);
  --cor-erro:          #f87171;
  --cor-erro-fundo:    rgba(248, 113, 113, 0.12);

  /* --- Aliases de compatibilidade com código existente --- */
  --cor-fundo:                     var(--ink);
  --cor-superficie:                var(--ink-2);
  --cor-superficie-secundaria:     var(--ink-3);
  --cor-texto-primario:            var(--paper);
  --cor-texto-secundario:          var(--paper-dim);
  --cor-texto-terciario:           var(--paper-mute);
  --cor-borda:                     var(--line);
  --cor-accent:                    var(--accent);
  --cor-accent-invertido:          var(--accent-ink);

  /* --- Badges de categoria (adaptados para tema escuro) --- */
  --cor-categoria-geral:           rgba(255,255,255,0.06);
  --cor-categoria-geral-texto:     var(--paper-dim);
  --cor-categoria-cliente:         rgba(100,149,237,0.15);
  --cor-categoria-cliente-texto:   #93b4f0;
  --cor-categoria-entrega:         rgba(150,100,220,0.15);
  --cor-categoria-entrega-texto:   #c4a3f5;
  --cor-categoria-caixa:           rgba(74,222,128,0.12);
  --cor-categoria-caixa-texto:     #4ade80;
  --cor-categoria-pendente:        rgba(230,137,42,0.15);
  --cor-categoria-pendente-texto:  #f0a85a;
  --cor-categoria-incidente:       rgba(248,113,113,0.15);
  --cor-categoria-incidente-texto: #f87171;

  /* --- Tipografia --- */
  --fonte-serif:    "Instrument Serif", "Times New Roman", serif;
  --fonte-principal: "Geist", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --fonte-mono:     "Geist Mono", ui-monospace, "Cascadia Code", Menlo, monospace;

  --tamanho-display:       clamp(44px, 6vw, 80px);
  --tamanho-h1:            clamp(28px, 4vw, 40px);
  --tamanho-h2:            22px;
  --tamanho-h3:            18px;
  --tamanho-body:          15px;
  --tamanho-body-pequeno:  13px;
  --tamanho-micro:         11px;

  --peso-regular:   400;
  --peso-medium:    500;
  --peso-semibold:  600;

  /* --- Espaçamento (base 8px) --- */
  --espaco-1:   4px;
  --espaco-2:   8px;
  --espaco-3:   12px;
  --espaco-4:   16px;
  --espaco-5:   20px;
  --espaco-6:   24px;
  --espaco-8:   32px;
  --espaco-12:  48px;
  --espaco-16:  64px;

  /* --- Border radius --- */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   18px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* --- Sombras (tema escuro — mais intensas) --- */
  --sombra-sm:  0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.3);
  --sombra-md:  0 4px 20px rgba(0,0,0,0.5), 0 2px 6px rgba(0,0,0,0.3);
  --sombra-lg:  0 16px 48px rgba(0,0,0,0.7), 0 4px 12px rgba(0,0,0,0.4);

  /* --- Glassmorphism padrão --- */
  --glass-bg:     linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015));
  --glass-border: 1px solid rgba(255,255,255,0.08);
  --glass-inset:  inset 0 1px 0 rgba(255,255,255,0.06);
  --glass-blur:   blur(20px) saturate(1.3);

  /* --- Transições --- */
  --transicao-rapida: all 0.15s ease;
  --transicao-normal: all 0.22s ease;
  --transicao-lenta:  all 0.35s cubic-bezier(0.2, 0.7, 0.2, 1);

  /* --- Layout --- */
  --largura-sidebar:   240px;
  --largura-conteudo:  900px;
  --altura-header:     64px;
  --altura-bottom-tab: 64px;
}