/* Tokens visuais do conhecimento político (frente K/PO) — FONTE ÚNICA para o portal, as páginas e o segundo ecrã
   do g2-agente (que lê este ficheiro ao arrancar e o serve embutido). Só custom properties: nada de regras de layout.
   Temas: claro por omissão; escuro por prefers-color-scheme ou [data-theme="dark"]; [data-theme="light"] força claro.
   Caras: [data-cara="presidencia"] | [data-cara="bancada"] — redefinem SÓ --acento e --acento-f.
   Modo discreto (segundo ecrã de perto): [data-modo="discreto"].
   Sem logótipo nem brasão até o André fornecer os ficheiros oficiais. */

:root {
  /* superfícies e texto */
  --papel: #f7f6f2;        /* fundo da página */
  --cartao: #ffffff;       /* fundo de cartões e tabelas */
  --tinta: #1d2229;        /* texto principal */
  --suave: #5d6670;        /* texto secundário, legendas */
  --linha: #d9d7d0;        /* contornos e divisórias */
  /* cores com significado (cada uma com a versão de fundo -f) */
  --azul: #2f5d8a;    --azul-f: #e3ecf5;
  --laranja: #c8561a; --laranja-f: #fbe9de;
  --ok: #2e7d4f;      --ok-f: #e2f2e8;
  --atencao: #9a6b00; --atencao-f: #fbf0d4;
  /* acento da cara (omissão: neutro = Presidência) */
  --acento: var(--azul); --acento-f: var(--azul-f);
  /* estados — os mesmos glifos do vidro: aberto ● · feito ✓ · vencido/erro ■ · aviso ◇ · provisório (itálico) */
  --estado-aberto: var(--azul);
  --estado-feito: var(--ok);
  --estado-vencido: var(--laranja);
  --estado-aviso: var(--atencao);
  --estado-provisorio: var(--suave);
  /* tipografia (sem carregar nada de fora: se o IBM Plex não estiver instalado, cai no sistema) */
  --serif: "Literata", Georgia, "Times New Roman", serif;   /* títulos */
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;   /* corpo */
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;  /* datas, minutos, rótulos */
  --corpo: 15px;
  --linha-altura: 1.55;
  /* forma e ritmo */
  --raio: 3px;          /* selos, botões */
  --raio-pilula: 999px; /* separadores de navegação */
  --esp-1: 4px; --esp-2: 8px; --esp-3: 12px; --esp-4: 16px; --esp-5: 24px; --esp-6: 32px;
  --gutter: 16px;       /* margem lateral mínima no telemóvel */
  --alvo: 40px;         /* altura mínima de um alvo de toque */
  --largura: 1080px;    /* largura máxima do conteúdo */
  /* profundidade discreta */
  --sombra-1: 0 1px 2px rgb(0 0 0 / .05), 0 1px 1px rgb(0 0 0 / .04);
  --sombra-2: 0 6px 18px -8px rgb(0 0 0 / .18), 0 2px 4px rgb(0 0 0 / .05);
  /* movimento (0 com prefers-reduced-motion e no modo discreto) */
  --dur-1: 120ms;  /* micro: estados, botões */
  --dur-2: 240ms;  /* transições de página/cartão */
  --dur-3: 520ms;  /* revelação no scroll */
  --curva: cubic-bezier(.2, .7, .2, 1);
}
@media (prefers-reduced-motion: reduce) { :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; } }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --papel: #15181c; --cartao: #1c2026; --tinta: #e8e6e1; --suave: #a3abb4; --linha: #2d333a;
    --azul: #8db6df;    --azul-f: #1b2938;
    --laranja: #f08a4b; --laranja-f: #3a2418;
    --ok: #7fcf9e;      --ok-f: #17291f;
    --atencao: #e3b54d; --atencao-f: #33290f;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --papel: #15181c; --cartao: #1c2026; --tinta: #e8e6e1; --suave: #a3abb4; --linha: #2d333a;
  --azul: #8db6df;    --azul-f: #1b2938;
  --laranja: #f08a4b; --laranja-f: #3a2418;
  --ok: #7fcf9e;      --ok-f: #17291f;
  --atencao: #e3b54d; --atencao-f: #33290f;
  color-scheme: dark;
}

/* as duas caras: só o acento muda (nunca misturadas na mesma página) */
[data-cara="presidencia"] { --acento: var(--azul); --acento-f: var(--azul-f); }
[data-cara="bancada"] { --acento: var(--laranja); --acento-f: var(--laranja-f); }
/* área neutra «Os meus pedidos»: sem cor de cara (decisão do lead, 13/10) */
[data-cara="pedidos"] { --acento: var(--tinta); --acento-f: var(--linha); }

/* modo discreto: fundo quase preto, texto cinzento médio, contraste baixo mas legível de perto */
[data-modo="discreto"] {
  --papel: #0b0c0e; --cartao: #121417; --tinta: #9aa1a9; --suave: #6b727a; --linha: #22262b;
  --azul: #6f8fae;    --azul-f: #151c24;
  --laranja: #b8784e; --laranja-f: #21170f;
  --ok: #6f9e80;      --ok-f: #121b15;
  --atencao: #a88e4e; --atencao-f: #1e1a0e;
  --corpo: 14px;
  --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms;
  --sombra-1: none; --sombra-2: none;
  color-scheme: dark;
}
