/* ===========================================================================
   DELTA IMPORTS · SISTEMA FINANCEIRO — TOKENS
   A paleta vem da logo da Delta Imports: navy abissal como primária, azul aço
   como secundária e dourado como destaque. O dourado nunca significa "atenção";
   significa Delta. As cores semânticas são independentes do destaque, para que
   ler o sinal de um número nunca dependa de lembrar da marca.
   =========================================================================== */

:root {
  /* marca */
  --navy:       #031531;
  --navy-2:     #08315e;
  --navy-3:     #0f3460;
  --steel:      #165d90;
  --steel-2:    #2e7cb8;
  --steel-3:    #6ba3d0;
  --gold:       #c1a561;
  --gold-2:     #a88b4c;
  --gold-3:     #edd691;

  /* neutros com viés frio, derivados do navy */
  --paper:      #ffffff;
  --paper-2:    #eef2f8;
  --paper-3:    #e4eaf3;
  --line:       #cfd9e6;
  --line-2:     #b6c4d6;
  --ink:        #08182e;
  --ink-2:      #23374f;
  --ink-soft:   #4e617a;
  --ink-mute:   #7a8ca3;
  --ink-faint:  #9aa9bd;

  /* semânticos */
  --pos:        #146b4f;
  --pos-2:      #1d8a66;
  --pos-bg:     #e4f2ec;
  --neg:        #94232f;
  --neg-2:      #b8323f;
  --neg-bg:     #fbe7e9;
  --warn:       #8a5b10;
  --warn-bg:    #fbf0dc;
  --info:       #144e7a;
  --info-bg:    #e4eef7;

  /* superfícies e sombras */
  --surf:       #ffffff;
  --surf-2:     #eef2f8;
  --surf-sunk:  #eef2f7;
  --sh-1:       0 1px 2px rgba(3, 21, 49, .07), 0 0 0 1px rgba(3, 21, 49, .015);
  --sh-2:       0 4px 16px rgba(3, 21, 49, .08);
  --sh-3:       0 18px 48px rgba(3, 21, 49, .18);

  /* métrica */
  /* O menu tem dois níveis: um trilho de seis destinos e um submenu com as
     telas do destino ativo. 76 + 208 = 284px — 32px a mais que a coluna única
     que havia antes, e em troca a lista visível caiu de 22 itens para dez. */
  --rail-w:     76px;
  --side-w:     284px;
  --head-h:     58px;
  --rad-s:      6px;
  --rad:        10px;
  --rad-l:      14px;
  /* ESPAÇAMENTO — uma escala de 4px, e a razão dela.
     O corpo de texto é 13,5px e a entrelinha cai em múltiplos de 4. Antes eram
     três degraus (10/16/24) e o resto era número solto espalhado pelo CSS —
     o que produz blocos que respiram diferente sem razão aparente.

     A regra de decisão: a distância entre dois elementos é proporcional à
     distância entre os ASSUNTOS deles. Dois números da mesma cascata ficam a
     --sp-3; duas seções que respondem perguntas diferentes ficam a --sp-6.

     Densidade aqui é escolha: é um painel de trabalho lido todo dia pela mesma
     pessoa, não uma página de apresentação. Espaço demais custa rolagem, e
     rolagem custa comparação. Ver 43_DIRETRIZES_DESIGN_PRODUTO §3. */
  --sp-1:       4px;    /* rótulo e valor dentro de um cartão            */
  --sp-2:       8px;    /* entre chips; entre ícone e texto              */
  --sp-3:       12px;   /* célula de tabela; linha de lista densa        */
  --sp-4:       16px;   /* padding de cartão; entre cartões de uma grade */
  --sp-5:       24px;   /* entre blocos de uma seção                     */
  --sp-6:       32px;   /* entre seções                                  */
  --sp-7:       48px;   /* acima do primeiro bloco da página             */

  /* Os três nomes antigos CONTINUAM COM O VALOR QUE TINHAM.
     Dois deles já caem na escala (16 e 24). O terceiro é 10px, e a tentação era
     apontá-lo para --sp-2 e ficar tudo redondo — o que reflui cada componente
     do painel de uma vez, sem ninguém poder conferir o resultado. Esta rodada
     não consegue capturar a tela renderizada, e mudar 2px em toda a interface
     às cegas é exatamente o tipo de coisa que este produto não faz.

     A escala fica disponível para o código novo. A conversão dos 10px é uma
     decisão para quem estiver olhando a tela. */
  --gap-s:      10px;
  --gap:        var(--sp-4);
  --gap-l:      var(--sp-5);

  /* tipografia */
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: "SF Mono", "Cascadia Mono", "Roboto Mono", Consolas, "Courier New", monospace;

  --fs-micro:   10.5px;
  --fs-xs:      11.5px;
  --fs-sm:      12.5px;
  --fs-base:    13.5px;
  --fs-md:      15px;
  --fs-lg:      18px;
  --fs-xl:      24px;
  --fs-2xl:     32px;
  --fs-3xl:     44px;

  --z-drawer:   60;
  --z-header:   40;
  --z-tooltip:  80;
}

/* tons das séries de gráfico — semânticos, não decorativos */
:root {
  --series-in:    #165d90;
  --series-out:   #b8323f;
  --series-acc:   #c1a561;
  --series-proj:  #6ba3d0;
  --series-alt:   #146b4f;
  --grid:         #dde5ef;
}
