/*
 * tokens.css — variáveis de design do Quitô.
 * Tema claro é o padrão; o escuro vale por prefers-color-scheme (quando o
 * usuário não escolheu "claro") ou por data-theme="dark" (escolha manual).
 */
:root {
  color-scheme: light;

  /* superfícies */
  --fundo: #f4f5f7;
  --superficie: #ffffff;
  --superficie-2: #f8f9fb;
  --superficie-hover: #f1f2f5;
  --borda: #e3e5ea;
  --borda-forte: #c9ced6;

  /* tinta */
  --tinta: #111827;
  --tinta-2: #4b5563;
  --tinta-3: #5b6472;
  --tinta-inversa: #ffffff;

  /* marca */
  --marca: #6d28d9;
  --marca-hover: #5b21b6;
  --marca-suave: #ede9fe;
  --marca-tinta: #5b21b6;
  --foco: #6d28d9;

  /* status (sempre com ícone + texto) */
  --sucesso: #15803d;
  --sucesso-suave: #dcfce7;
  --aviso: #92400e;
  --aviso-marca: #d97706;
  --aviso-suave: #fef3c7;
  --erro: #b91c1c;
  --erro-suave: #fee2e2;
  --info: #1d4ed8;
  --info-suave: #dbeafe;
  --perigo-tinta: #ffffff;
  --anel-perfil: transparent;
  --toast-icone-erro: #fca5a5;
  --toast-icone-sucesso: #86efac;

  /* séries de gráfico (paleta validada: dataviz, ordem fixa) */
  --serie-1: #2a78d6;
  --serie-2: #eb6834;
  --serie-3: #1baf7a;
  --serie-4: #eda100;
  --serie-5: #e87ba4;
  --serie-6: #008300;
  --serie-7: #0e93a8;
  --serie-8: #b5651d;
  --serie-outros: #9aa1ac;
  --grade-grafico: #e8eaee;
  --eixo-grafico: #c9ced6;

  /* tipografia */
  --fonte: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fonte-codigo: ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace; /* contrato JSON do proxy e link de convite */
  --t-micro: 0.6875rem; /* rótulos sob ícones: barra inferior e abas de fatura */
  --t-xs: 0.75rem;
  --t-sm: 0.875rem;
  --t-md: 1rem;
  --t-lg: 1.125rem;
  --t-titulo: 1.25rem;
  --t-xl: 1.375rem;
  --t-2xl: 1.75rem;
  --t-3xl: 2.25rem;

  /* espaço (escala de 4 px) */
  --e-1: 4px;
  --e-2: 8px;
  --e-3: 12px;
  --e-4: 16px;
  --e-5: 20px;
  --e-6: 24px;
  --e-8: 32px;
  --e-10: 40px;

  /* forma e profundidade */
  --raio-sm: 8px;
  --raio: 10px;
  --raio-lg: 14px;
  --raio-pill: 999px;
  --sombra-1: 0 1px 2px rgba(17, 24, 39, 0.05), 0 1px 3px rgba(17, 24, 39, 0.06);
  --sombra-2: 0 4px 12px rgba(17, 24, 39, 0.08), 0 2px 4px rgba(17, 24, 39, 0.05);
  --sombra-3: 0 16px 40px rgba(17, 24, 39, 0.18), 0 4px 10px rgba(17, 24, 39, 0.08);

  /* movimento */
  --ease-saida: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-rapida: 120ms;
  --dur: 200ms;

  /* layout */
  --largura-menu: 240px;
  --altura-barra-inferior: 64px;
}

@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) {
    color-scheme: dark;
    --fundo: #0e0f13;
    --superficie: #17181d;
    --superficie-2: #1c1d23;
    --superficie-hover: #22242b;
    --borda: #2a2c34;
    --borda-forte: #3b3e48;
    --tinta: #f3f4f6;
    --tinta-2: #c4c9d2;
    --tinta-3: #a8afbd;
    --tinta-inversa: #ffffff;
    --marca: #7c3aed;
    --marca-hover: #6d28d9;
    --marca-suave: #2a2140;
    --marca-tinta: #c4b5fd;
    --foco: #a78bfa;
    --sucesso: #4ade80;
    --sucesso-suave: #12301f;
    --aviso: #fbbf24;
    --aviso-marca: #f59e0b;
    --aviso-suave: #33270c;
    --erro: #f87171;
    --erro-suave: #3a1618;
    --info: #93c5fd;
    --info-suave: #142640;
    --perigo-tinta: #1a0a0a;
    --anel-perfil: rgba(255, 255, 255, 0.7);
    --toast-icone-erro: #b91c1c;
    --toast-icone-sucesso: #15803d;
    --serie-1: #3987e5;
    --serie-2: #d95926;
    --serie-3: #199e70;
    --serie-4: #c98500;
    --serie-5: #d55181;
    --serie-6: #008300;
    --serie-7: #1a95a8;
    --serie-8: #c4762e;
    --serie-outros: #6b7280;
    --grade-grafico: #262830;
    --eixo-grafico: #3b3e48;
    --sombra-1: 0 1px 2px rgba(0, 0, 0, 0.4);
    --sombra-2: 0 4px 12px rgba(0, 0, 0, 0.45);
    --sombra-3: 0 16px 40px rgba(0, 0, 0, 0.6);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --fundo: #0e0f13;
  --superficie: #17181d;
  --superficie-2: #1c1d23;
  --superficie-hover: #22242b;
  --borda: #2a2c34;
  --borda-forte: #3b3e48;
  --tinta: #f3f4f6;
  --tinta-2: #c4c9d2;
  --tinta-3: #a8afbd;
  --tinta-inversa: #ffffff;
  --marca: #7c3aed;
  --marca-hover: #6d28d9;
  --marca-suave: #2a2140;
  --marca-tinta: #c4b5fd;
  --foco: #a78bfa;
  --sucesso: #4ade80;
  --sucesso-suave: #12301f;
  --aviso: #fbbf24;
  --aviso-marca: #f59e0b;
  --aviso-suave: #33270c;
  --erro: #f87171;
  --erro-suave: #3a1618;
  --info: #93c5fd;
  --info-suave: #142640;
  --serie-1: #3987e5;
  --serie-2: #d95926;
  --serie-3: #199e70;
  --serie-4: #c98500;
  --serie-5: #d55181;
  --serie-6: #008300;
  --serie-7: #1a95a8;
  --serie-8: #c4762e;
  --serie-outros: #6b7280;
  --grade-grafico: #262830;
  --eixo-grafico: #3b3e48;
  --sombra-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --sombra-2: 0 4px 12px rgba(0, 0, 0, 0.45);
  --sombra-3: 0 16px 40px rgba(0, 0, 0, 0.6);
  --perigo-tinta: #1a0a0a;
  --toast-icone-erro: #b91c1c;
  --toast-icone-sucesso: #15803d;
  --anel-perfil: rgba(255, 255, 255, 0.7);
}