/* FINANCIEI Design System — tokens institucionais (TEMA CLARO).
   Espelha a estética de financiei.com.br: fundo cinza-claro, cards brancos
   sem sombra, texto quase preto, laranja e roxo como preenchimento sólido.

   PALETA OFICIAL FINANCIEI
   ------------------------------------------------------------------
   Roxo         #8470B2  rgb(132,112,178)  elementos roxos / secundário
   Laranja      #E76629  rgb(231,102,41)   elementos laranja / ação principal
   Cinza claro  #E7E3E1  rgb(231,227,225)  barra central / divisores
   Fundo        #231E3D  rgb(35,30,61)     fundo da logo / faixas escuras
   ------------------------------------------------------------------
   Superfícies medidas no site: página #EDF3F7, card #FFFFFF, texto #212529.

   Os nomes --trino-graphite-* / --trino-navy-* / --trino-gold-* são ALIASES
   LEGADOS. A escala continua "quanto maior o número, mais elevada a
   superfície" — só que agora elevado significa mais BRANCO, não mais escuro. */
:root {
  /* ---------- Marca Financiei ---------- */
  --financiei-roxo: #8470b2;
  --financiei-laranja: #e76629;
  --financiei-cinza: #e7e3e1;
  --financiei-fundo: #231e3d;

  /* Superfícies claras — 600 é a mais "funda", 800+ é branco */
  --financiei-base-1000: #dce3ea;
  --financiei-base-950: #edf3f7;
  --financiei-base-900: #f2f6f9;
  --financiei-base-850: #f8fafc;
  --financiei-base-800: #ffffff;
  --financiei-base-750: #fbfcfd;
  --financiei-base-700: #eef2f6;
  --financiei-base-600: #dce3ea;
  --financiei-base-500: #c9d3dd;

  /* Laranja — ação principal. Tons escuros para texto sobre claro. */
  --financiei-laranja-700: #8f3c14;
  --financiei-laranja-600: #c4541f;
  --financiei-laranja-500: #e76629;
  --financiei-laranja-400: #f0854f;
  --financiei-laranja-300: #ffe3d0;

  /* Roxo — secundário */
  --financiei-roxo-700: #4c3f70;
  --financiei-roxo-600: #6f5d9d;
  --financiei-roxo-500: #8470b2;
  --financiei-roxo-400: #a394c9;
  --financiei-roxo-300: #e4dcf0;

  /* Neutros */
  --financiei-cinza-100: #ffffff;
  --financiei-cinza-200: #e7e3e1;
  --financiei-cinza-400: #5c6470;
  --financiei-cinza-500: #767d88;
  --financiei-cinza-600: #626972;
  --financiei-tinta: #212529;

  /* ---------- Aliases legados de superfície ---------- */
  --trino-graphite-1000: var(--financiei-base-1000);
  --trino-graphite-950: var(--financiei-base-950);
  --trino-graphite-900: var(--financiei-base-900);
  --trino-graphite-850: var(--financiei-base-850);
  --trino-graphite-800: var(--financiei-base-800);
  --trino-graphite-750: var(--financiei-base-750);
  --trino-graphite-700: var(--financiei-base-700);
  --trino-graphite-600: var(--financiei-base-600);
  --trino-navy-1000: var(--financiei-base-1000);
  --trino-navy-950: var(--financiei-base-950);
  --trino-navy-900: var(--financiei-base-900);
  --trino-navy-850: var(--financiei-base-850);
  --trino-navy-800: var(--financiei-base-800);
  --trino-navy-750: var(--financiei-base-750);
  --trino-navy-700: var(--financiei-base-700);
  --trino-navy-600: var(--financiei-base-600);

  /* ---------- Acento: o antigo "gold" é o LARANJA ----------
     Atenção: no tema escuro "soft" significava mais claro. No claro, "soft"
     precisa ser mais ESCURO para continuar legível sobre branco. */
  --trino-gold-600: var(--financiei-laranja-700);
  --trino-gold-500: var(--financiei-laranja-500);
  --trino-gold-300: var(--financiei-laranja-600);

  --trino-off-white: var(--financiei-tinta);
  --trino-text-muted: var(--financiei-cinza-400);
  --trino-text-subtle: var(--financiei-cinza-600);
  --trino-success: #1a7f4f;
  --trino-warning: #a86a12;
  --trino-danger: #c1303f;
  --trino-info: var(--financiei-roxo-600);
  --trino-neutral: var(--financiei-cinza-500);

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

  --trino-radius-xs: 4px;
  --trino-radius-sm: 6px;
  --trino-radius-md: 10px;
  --trino-radius-lg: 12px;
  --trino-radius-xl: 16px;
  --trino-radius-pill: 999px;
  --trino-border-subtle: 1px solid rgba(35, 30, 61, 0.08);
  --trino-border-default: 1px solid rgba(35, 30, 61, 0.14);
  --trino-border-strong: 1px solid rgba(231, 102, 41, 0.55);

  /* o site é plano: sombras quase inexistentes */
  --trino-elevation-1: 0 1px 2px rgba(35, 30, 61, .05);
  --trino-elevation-2: 0 2px 10px rgba(35, 30, 61, .07);
  --trino-elevation-3: 0 8px 28px rgba(35, 30, 61, .10);
  --trino-focus-ring: 0 0 0 3px rgba(231, 102, 41, .30);

  --trino-control-sm: 32px;
  --trino-control-md: 40px;
  --trino-control-lg: 48px;
  --trino-sidebar-width: clamp(360px, 36vw, 520px);
  --trino-content-max: 1760px;

  --trino-duration-fast: 160ms;
  --trino-duration-normal: 240ms;
  --trino-duration-panel: 320ms;
  --trino-ease-standard: cubic-bezier(.2, .8, .2, 1);
  --trino-ease-emphasized: cubic-bezier(.16, 1, .3, 1);

  --trino-z-header: 30;
  --trino-z-dropdown: 80;
  --trino-z-modal: 200;
  --trino-z-toast: 300;

  /* ---------- Aliases curtos ---------- */
  --bg: var(--financiei-base-950);
  --bg-panel: var(--financiei-base-800);
  --bg-panel-2: var(--financiei-base-850);
  --bg-panel-3: var(--financiei-base-700);
  --border: var(--financiei-base-600);
  --border-soft: rgba(35, 30, 61, 0.10);
  --border-hair: rgba(35, 30, 61, 0.06);

  --gold: var(--financiei-laranja-500);
  --gold-soft: var(--financiei-laranja-600);
  --gold-dim: rgba(231, 102, 41, .10);
  --laranja: var(--financiei-laranja-500);
  --roxo: var(--financiei-roxo-500);
  --roxo-soft: var(--financiei-roxo-600);
  --roxo-dim: rgba(132, 112, 178, .14);

  --green: var(--trino-success);
  --amber: var(--trino-warning);
  --warn: var(--trino-warning);
  --red: var(--trino-danger);
  --danger: var(--trino-danger);
  --text: var(--financiei-tinta);
  --text-dim: var(--financiei-cinza-400);
  --text-dim-2: var(--financiei-cinza-600);
  --ring: var(--trino-focus-ring);
  --trans: var(--trino-duration-fast) var(--trino-ease-standard);
}
