/* sysadmin — tokens da família, versão 0.1.0.
   GERADO por ferramentas/Gerar-Tokens.ps1 a partir de tokens/tokens.json: não edite à mão.

   Como usar: <html data-produto="central|navega|guarda">. O tema segue o sistema
   (prefers-color-scheme); data-tema="claro" ou "escuro" força um dos dois.
   --marca-acao é o azul da família (botão, link, foco, item ativo), igual nos três;
   --marca-produto é o acento de cada produto (símbolo, régua do topo, ícone, capa). */

:root {
    --acao: #1f5fa9;
    --acao-fundo: #eaf1fa;
    --acao-hover: #1a5190;
    --acao-texto: #ffffff;
    --acao-tinta: #17457c;
    --aviso: #a8871f;
    --aviso-fundo: #f9f2df;
    --aviso-tinta: #836918;
    --borda: #e3e6ea;
    --conferido: #12876f;
    --critico: #a8261a;
    --critico-fundo: #fbeae8;
    --critico-tinta: #a8261a;
    --erro: #6b4fa8;
    --erro-fundo: #f0ecf9;
    --erro-tinta: #6b4fa8;
    --fundo: #f6f7f9;
    --ok: #12876f;
    --ok-fundo: #e6f4f1;
    --ok-tinta: #107a64;
    --stackit: #1f7fa8;
    --stackit-marinho: #0b2540;
    --superficie: #ffffff;
    --texto: #1c2126;
    --texto-apoio: #68717c;
    --tinta: #13202e;
    --marca-produto: #1f5fa9;
    --fonte: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
    --fonte-mono: "IBM Plex Mono", ui-monospace, "Cascadia Code", Consolas, monospace;
    --tam-rotulo: 11px;
    --tam-apoio: 13px;
    --tam-tabela: 14px;
    --tam-texto: 15px;
    --tam-titulo-secao: 17px;
    --tam-titulo: 22px;
    --tam-numero: 28px;
    --tam-capa: 32px;
    --espaco-1: 4px;
    --espaco-2: 8px;
    --espaco-3: 12px;
    --espaco-4: 16px;
    --espaco-5: 20px;
    --espaco-6: 24px;
    --espaco-7: 28px;
    --espaco-8: 40px;
    --raio-codigo: 4px;
    --raio-campo: 7px;
    --raio-bloco: 10px;
    --raio-cartao: 12px;
    --raio-pilula: 999px;
    --medida-topo: 60px;
    --medida-regua: 3px;
    --medida-lateral: 232px;
    --medida-lateral-recolhida: 56px;
    --medida-conteudo: 1180px;
    color-scheme: light;
}
:root[data-produto="navega"] { --marca-produto: #8a2f6e; }
:root[data-produto="guarda"] { --marca-produto: #3d4b5c; }

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --acao: #6aa9e9;
    --acao-fundo: #17273a;
    --acao-hover: #82b8ee;
    --acao-texto: #14181d;
    --acao-tinta: #a9cef4;
    --aviso: #b08e24;
    --aviso-fundo: #2e2712;
    --aviso-tinta: #b08e24;
    --borda: #2b323b;
    --conferido: #1fb08f;
    --critico: #c4483a;
    --critico-fundo: #331916;
    --critico-tinta: #d06d61;
    --erro: #9878dc;
    --erro-fundo: #241f38;
    --erro-tinta: #9878dc;
    --fundo: #14181d;
    --ok: #0f9a86;
    --ok-fundo: #0e2a26;
    --ok-tinta: #1b9f8c;
    --stackit: #5bc0e8;
    --stackit-marinho: #0b2540;
    --superficie: #1b2027;
    --texto: #e8ebee;
    --texto-apoio: #98a2ae;
    --tinta: #e8ebee;
    --marca-produto: #6aa9e9;
    color-scheme: dark;
  }
  :root[data-produto="central"]:not([data-tema="claro"]) { --marca-produto: #6aa9e9; }
  :root[data-produto="guarda"]:not([data-tema="claro"]) { --marca-produto: #96a8bd; }
  :root[data-produto="navega"]:not([data-tema="claro"]) { --marca-produto: #df8ac5; }
}
:root[data-tema="escuro"] {
    --acao: #6aa9e9;
    --acao-fundo: #17273a;
    --acao-hover: #82b8ee;
    --acao-texto: #14181d;
    --acao-tinta: #a9cef4;
    --aviso: #b08e24;
    --aviso-fundo: #2e2712;
    --aviso-tinta: #b08e24;
    --borda: #2b323b;
    --conferido: #1fb08f;
    --critico: #c4483a;
    --critico-fundo: #331916;
    --critico-tinta: #d06d61;
    --erro: #9878dc;
    --erro-fundo: #241f38;
    --erro-tinta: #9878dc;
    --fundo: #14181d;
    --ok: #0f9a86;
    --ok-fundo: #0e2a26;
    --ok-tinta: #1b9f8c;
    --stackit: #5bc0e8;
    --stackit-marinho: #0b2540;
    --superficie: #1b2027;
    --texto: #e8ebee;
    --texto-apoio: #98a2ae;
    --tinta: #e8ebee;
    --marca-produto: #6aa9e9;
    color-scheme: dark;
}
:root[data-produto="central"][data-tema="escuro"] { --marca-produto: #6aa9e9; }
:root[data-produto="guarda"][data-tema="escuro"] { --marca-produto: #96a8bd; }
:root[data-produto="navega"][data-tema="escuro"] { --marca-produto: #df8ac5; }

/* Impressão: sempre clara, com os estados mais fechados para o papel. */
@media print {
  :root, :root[data-tema="escuro"] {
    --aviso: #7e660f;
    --aviso-fundo: #f6efdb;
    --aviso-tinta: #6b570d;
    --borda: #c9ced5;
    --critico: #8f2015;
    --critico-fundo: #f6e3e0;
    --critico-tinta: #8f2015;
    --erro: #55408a;
    --erro-fundo: #eae5f5;
    --erro-tinta: #55408a;
    --fundo: #ffffff;
    --ok: #0d6b58;
    --ok-fundo: #e2f1ee;
    --ok-tinta: #0d6b58;
    --superficie: #ffffff;
    --texto: #101418;
    --texto-apoio: #4a5058;
    --acao: #1f5fa9;
    --tinta: #13202e;
    --conferido: #12876f;
    --stackit: #1f7fa8;
    color-scheme: light;
  }
  :root[data-produto="central"] { --marca-produto: #1f5fa9; }
  :root[data-produto="guarda"] { --marca-produto: #3d4b5c; }
  :root[data-produto="navega"] { --marca-produto: #8a2f6e; }
}

/* Nomes de transição (fase 5): os que a Central e o Navega usam hoje, apontando para os novos.
   Saem quando os dois produtos estiverem nos nomes novos. */
:root {
    --acento: var(--acao);
    --acento-fundo: var(--acao-fundo);
    --acento-texto: var(--acao-tinta);
    --marca-acao: var(--acao);
    --marca-botao: var(--acao);
    --marca-botao-hover: var(--acao-hover);
    --marca-botao-texto: var(--acao-texto);
    --marca-foco: var(--acao);
    --marca-destaque: var(--marca-produto);
    --marca-trilha: var(--marca-produto);
    --marca-tinta: var(--tinta);
    --marca-conferido: var(--conferido);
    --marca-stackit: var(--stackit);
}
