/* =========================================================================
   Xingu Pulso — paleta e tokens (06/11/2026, direção "Grafite e Lima")

   Cor principal: LIMA sobre GRAFITE — a cara de app financeiro novo, e a cor do "deu certo".
   Conferida contra as irmãs: Atlas teal #0C7278 / navy #0E223E · Hermes vermelho #E1172D
   Orion verde-floresta #0F5B3D · Finance azul #1550BE · Nexus violeta #7C3AED.
   O lima (amarelo-esverdeado) fica longe do verde-floresta do Orion e do teal do Atlas.

   Na tela, texto e botão usam o MUSGO (#3D7A0B, branco sobre ele 5,3:1) no claro e o LIMA
   (#A3E635, grafite sobre ele 12:1) no escuro: lima puro sobre branco não dá leitura.

   Todo par de texto abaixo tem contraste AA (>= 4,5:1) sobre a superfície E sobre o fundo
   da página do seu tema (claro: #FFFFFF e #F4F6F1; escuro: #16181C e #0E0F12), pela fórmula
   do WCAG 2.1. As mesmas cores servem de traço de gráfico (>= 3:1).

   Tema: claro por padrão; escuro em `.dark` (Finanças Pinheiro, Tailwind) ou
   `[data-theme="dark"]`. Os --pulso-* de marca são fixos; os --t-* mudam com o tema.
   ========================================================================= */

:root {
  /* ---- Marca (o que está no símbolo e no lettering) ---- */
  --pulso-grafite: #14161A;         /* ladrilho do símbolo, lettering Pulso, sidebar */
  --pulso-grafite-2: #2A2E36;       /* topo do degradê do ladrilho */
  --pulso-musgo: #3D7A0B;           /* primária de interface no claro (branco sobre ela: 5,3:1) */
  --pulso-lima: #7CC413;            /* meio da trajetória, degradês */
  --pulso-lima-claro: #C6F25A;      /* ponta da trajetória, a META com o check */
  --pulso-cinza-do-xingu: #6B7280;  /* XINGU */
  --pulso-nevoa: #F4F6F1;           /* fundo de página clara, prancha */

  /* ---- Escala do lima (estados, fundos suaves, foco) ---- */
  --pulso-lima-50: #F6FDE6;
  --pulso-lima-100: #ECFAC8;
  --pulso-lima-200: #DCF59A;
  --pulso-lima-300: #C6F25A;
  --pulso-lima-400: #A3E635;
  --pulso-lima-500: #7CC413;
  --pulso-lima-600: #5C9E1A;
  --pulso-lima-700: #3D7A0B;
  --pulso-lima-800: #2F5E0C;
  --pulso-lima-900: #234510;
  --pulso-lima-950: #11260A;

  /* ---- Neutros "grafite" (frios, levemente puxados para o verde da névoa) ---- */
  --pulso-cinza-50: #F8FAF5;
  --pulso-cinza-100: #F4F6F1;
  --pulso-cinza-200: #E3E7DE;
  --pulso-cinza-300: #CDD2CB;
  --pulso-cinza-400: #9AA1AB;
  --pulso-cinza-500: #636B78;
  --pulso-cinza-600: #4B5260;
  --pulso-cinza-700: #353A44;
  --pulso-cinza-800: #1E2126;
  --pulso-cinza-850: #16181C;
  --pulso-cinza-900: #0E0F12;
  --pulso-cinza-950: #08090B;

  /* ---- Tipografia ---- */
  --pulso-fonte: 'Plus Jakarta Sans Variable', 'Plus Jakarta Sans', ui-sans-serif, system-ui, 'Segoe UI', sans-serif;
  --pulso-fonte-num: var(--pulso-fonte);           /* com font-variant-numeric: tabular-nums */
  --pulso-peso-regular: 400;
  --pulso-peso-medio: 500;
  --pulso-peso-semi: 600;
  --pulso-peso-forte: 700;
  --pulso-peso-titulo: 800;
  --pulso-texto-xs: .75rem;     /* 12 — rótulos de eixo, legendas */
  --pulso-texto-sm: .8125rem;   /* 13 — tabela densa */
  --pulso-texto-base: .9375rem; /* 15 — corpo */
  --pulso-texto-lg: 1.125rem;   /* 18 — título de cartão */
  --pulso-texto-xl: 1.5rem;     /* 24 — título de página */
  --pulso-texto-kpi: 2rem;      /* 32 — número de KPI */
  --pulso-tracking-rotulo: .08em;

  /* ---- Raio (o ladrilho do símbolo é "squircle": cartões seguem o mesmo espírito) ---- */
  --pulso-raio-sm: .5rem;
  --pulso-raio-md: .875rem;
  --pulso-raio-lg: 1.25rem;
  --pulso-raio-xl: 1.5rem;
  --pulso-raio-full: 999px;

  /* ---- Sombra ---- */
  --pulso-sombra-suave: 0 1px 2px rgb(20 22 26 / .05), 0 6px 18px -6px rgb(20 22 26 / .10);
  --pulso-sombra-elevada: 0 14px 40px -14px rgb(20 22 26 / .30);
  --pulso-sombra-lima: 0 8px 22px -8px rgb(124 196 19 / .55);   /* ícone flutuante do cartão (Material) */
  --pulso-anel: 0 0 0 3px rgb(124 196 19 / .40);               /* foco */

  /* ---- Movimento ---- */
  --pulso-curva-saida: cubic-bezier(.2, .8, .2, 1);     /* entrada (rise) — a do Finanças Pinheiro */
  --pulso-curva-padrao: cubic-bezier(.4, 0, .2, 1);     /* hover, troca de estado */
  --pulso-curva-mola: cubic-bezier(.34, 1.56, .64, 1);  /* sino, check que aparece */
  --pulso-dur-rapida: 120ms;
  --pulso-dur-media: 220ms;
  --pulso-dur-entrada: 450ms;
  --pulso-dur-grafico: 900ms;
  --pulso-atraso-escada: 60ms;

  /* ---- Tema CLARO (padrão) ---- */
  --t-fundo: #F4F6F1;
  --t-superficie: #FFFFFF;
  --t-superficie-2: #F8FAF5;
  --t-borda: #E3E7DE;
  --t-texto: #14161A;
  --t-texto-2: #4B5260;
  --t-mudo: #636B78;
  --t-primaria: #3D7A0B;          /* musgo */
  --t-primaria-hover: #2F5E0C;
  --t-primaria-texto: #FFFFFF;
  --t-primaria-suave: #F2FBDF;
  --t-destaque: #C6F25A;          /* lima claro: item ativo do menu, chip de meta (texto grafite por cima) */
  --t-destaque-texto: #14161A;
  --t-vidro: rgb(255 255 255 / .72);
  --t-vidro-borda: rgb(20 22 26 / .06);
  --t-vidro-blur: 18px;
  --t-sidebar-de: #2A2E36;        /* degradê 195° do Material, em grafite */
  --t-sidebar-ate: #14161A;

  /* Semânticas — texto e traço */
  --t-positivo: #1C7A3E;
  --t-negativo: #C81E1E;
  --t-alerta: #935A06;
  --t-neutro: #57606C;
  --t-info: #1D63C4;
  /* Semânticas — fundo suave de chip/célula */
  --t-positivo-fundo: #E7F5EC;
  --t-negativo-fundo: #FDECEC;
  --t-alerta-fundo: #FDF3DC;
  --t-neutro-fundo: #EEF0F2;
  --t-info-fundo: #E8F0FB;

  /* Cenários */
  --t-cen-base: #3D7A0B;
  --t-cen-otimista: #0F766E;
  --t-cen-pessimista: #B4234F;
  --t-cen-livre-1: #6D45C9;
  --t-cen-livre-2: #1D6FB8;
  --t-cen-livre-3: #9A5B06;

  /* Séries de gráfico (o pontilhado do planejado é o mesmo do símbolo) */
  --t-serie-planejado: #5E6673;  /* tracejado 8 6 */
  --t-serie-realizado: #3D7A0B;  /* linha cheia, grossa */
  --t-serie-projecao: #3D7A0B;   /* pontilhado redondo (0.1 6), continua o realizado */
  --t-serie-limite: #0B78A8;     /* faixa do limite de antecipação (preencher a 16%) */
  --t-grade: #ECEFE8;
}

/* ---- Tema ESCURO ---- */
.dark,
[data-theme="dark"] {
  --t-fundo: #0E0F12;
  --t-superficie: #16181C;
  --t-superficie-2: #1E2126;
  --t-borda: #2A2E35;
  --t-texto: #F3F5F0;
  --t-texto-2: #C3C8CF;
  --t-mudo: #9AA1AB;
  --t-primaria: #A3E635;
  --t-primaria-hover: #C6F25A;
  --t-primaria-texto: #14161A;
  --t-primaria-suave: rgb(163 230 53 / .10);
  --t-destaque: #C6F25A;
  --t-destaque-texto: #14161A;
  --t-vidro: rgb(22 24 28 / .72);
  --t-vidro-borda: rgb(255 255 255 / .06);
  --t-sidebar-de: #1C1F25;
  --t-sidebar-ate: #0A0B0D;

  --t-positivo: #4ADE80;
  --t-negativo: #F87171;
  --t-alerta: #FACC15;
  --t-neutro: #A1A8B3;
  --t-info: #7AB0FF;
  --t-positivo-fundo: rgb(74 222 128 / .12);
  --t-negativo-fundo: rgb(248 113 113 / .12);
  --t-alerta-fundo: rgb(250 204 21 / .12);
  --t-neutro-fundo: rgb(161 168 179 / .12);
  --t-info-fundo: rgb(122 176 255 / .12);

  --t-cen-base: #A3E635;
  --t-cen-otimista: #2DD4BF;
  --t-cen-pessimista: #FB7196;
  --t-cen-livre-1: #B79BFA;
  --t-cen-livre-2: #6CB2F5;
  --t-cen-livre-3: #F5B544;

  --t-serie-planejado: #A1A8B3;
  --t-serie-realizado: #A3E635;
  --t-serie-projecao: #C6F25A;
  --t-serie-limite: #38BDF8;
  --t-grade: #23262C;

  --pulso-sombra-suave: 0 1px 2px rgb(0 0 0 / .3);
  --pulso-sombra-elevada: 0 18px 44px -14px rgb(0 0 0 / .6);
}

/* ---- Entrada dos cartões (a "rise" do Finanças Pinheiro) ---- */
@keyframes pulso-rise {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
@keyframes pulso-desenha {           /* traço de gráfico que se desenha */
  from { stroke-dashoffset: var(--comp, 1000); }
  to   { stroke-dashoffset: 0; }
}
@keyframes pulso-balanca {           /* sino com aviso novo */
  0%, 100% { transform: rotate(0); }
  20% { transform: rotate(14deg); }
  40% { transform: rotate(-10deg); }
  60% { transform: rotate(6deg); }
  80% { transform: rotate(-3deg); }
}
.pulso-rise { animation: pulso-rise var(--pulso-dur-entrada) var(--pulso-curva-saida) both; }

@media (prefers-reduced-motion: reduce) {
  .pulso-rise { animation: none; }
  * { transition-duration: 0ms !important; animation-duration: 0ms !important; }
}
