/* ==========================================================================
   Central de Serviços de TI — Schiffer
   Tokens de identidade visual. ÚNICO lugar onde cores, raios, sombras e tipografia
   são definidos. As três cores de marca abaixo são sobrescritas por /tema.css, gerado a
   partir de Configurações > Identidade visual — trocar a cor não exige mexer em página.

   Cores da marca Schiffer, amostradas do logotipo oficial (public/assets/img/logo-schiffer.png):
   laranja #FE5B00, preto #000000 e branco.
   Contraste: branco sobre o laranja dá só 3,1:1, então texto sobre a cor de marca usa
   --marca-contraste (preto, 6,7:1) e texto na cor de marca sobre fundo claro usa --marca-link
   (laranja escurecido, >= 4,5:1). /tema.css recalcula os dois quando as cores mudam.
   ========================================================================== */
:root {
  /* Marca (sobrescritas por /tema.css) */
  --marca-primaria: #fe5b00;
  --marca-escura: #000000;
  --marca-destaque: #fe5b00;
  --marca-contraste: #000000;            /* texto sobre --marca-primaria */
  --marca-contraste-destaque: #000000;   /* texto sobre --marca-destaque */
  --marca-link: #cf4a00;                 /* texto na cor da marca sobre fundo claro */

  /* Derivadas da marca: não editar, acompanham as três acima */
  --marca-primaria-hover: color-mix(in srgb, var(--marca-primaria) 88%, #000);
  --marca-primaria-suave: color-mix(in srgb, var(--marca-primaria) 10%, #fff);
  --marca-primaria-borda: color-mix(in srgb, var(--marca-primaria) 30%, #fff);
  --marca-escura-2: color-mix(in srgb, var(--marca-escura) 88%, #fff);
  --marca-escura-3: color-mix(in srgb, var(--marca-escura) 75%, #fff);
  --anel-foco: 0 0 0 3px color-mix(in srgb, var(--marca-destaque) 35%, transparent);

  /* Neutros */
  --fundo: #f4f4f5;
  --fundo-2: #e8e8ea;
  --superficie: #ffffff;
  --superficie-2: #f9f9fa;
  --borda: #dfdfe2;
  --borda-forte: #c6c7cc;
  --texto: #18181a;
  --texto-2: #4a4c52;
  --texto-3: #6b6d74;
  --texto-inverso: #ffffff;

  /* Estados (semânticos, independentes da marca) */
  --ok: #1e7a4f;        --ok-suave: #e5f4ec;
  --info: #1f63b4;      --info-suave: #e6effa;
  --alerta: #8f6400;    --alerta-suave: #fbf3d2;
  --perigo: #b42336;    --perigo-suave: #fbe9ec;
  --neutro: #546173;    --neutro-suave: #edf0f4;
  --roxo: #6941c6;      --roxo-suave: #f0ebfb;

  /* Paleta categórica para gráficos (ordem fixa) */
  --graf-1: var(--marca-primaria);
  --graf-2: #2aa198;
  --graf-3: #8a5cc2;
  --graf-4: #5f8f2e;
  --graf-5: #3b7dd8;
  --graf-6: #d6455d;
  --graf-7: #8c6239;
  --graf-8: #6b6d74;

  /* Tipografia */
  --fonte: "Segoe UI Variable Text", "Segoe UI", "Inter", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --fonte-titulo: "Segoe UI Variable Display", "Segoe UI", "Inter", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --fonte-mono: "Cascadia Mono", Consolas, "SFMono-Regular", Menlo, monospace;
  --t-xs: 0.75rem;
  --t-sm: 0.8125rem;
  --t-md: 0.9375rem;
  --t-lg: 1.0625rem;
  --t-xl: 1.375rem;
  --t-2xl: 1.75rem;
  --t-3xl: clamp(1.9rem, 1.3rem + 2.2vw, 2.75rem);

  /* Forma */
  --raio-sm: 6px;
  --raio: 10px;
  --raio-lg: 16px;
  --sombra-1: 0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 1px rgba(0, 0, 0, 0.04);
  --sombra-2: 0 4px 14px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.06);
  --sombra-3: 0 18px 48px rgba(0, 0, 0, 0.18);
  --transicao: 160ms cubic-bezier(.2, .7, .3, 1);

  /* Espaço */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 24px; --e-6: 32px; --e-7: 48px;
}
