/* © 2026 Jose Carvalho. Intel Ceasa. Ver LICENSE. */
/* ============================================================
   SISTEMA MAQUINA DE VENDAS -- a quinta porta do Portal Intel (tarefa r85, 02/10/2026).

   O MAQUINA DE VENDAS NAO TEM MANUAL NEM LOGOTIPO: o icone que o sistema do Zama usa e o circulo do
   GRUPO JAP, que ja e a marca de outra porta. A cor daqui e ESCOLHIDA, e a regra da escolha foi uma
   so: ser distinta das quatro portas que existem, no claro e no escuro, para quem entra saber em que
   sistema esta sem ler o nome.
     Painel Intel       verde da casa   #14603f
     Grupo JAP          verde-oliva     #5a7512
     Nova Ceasa         verde Ceasa     #144221
     Polo Piaui Center  azul-marinho    #3c418a
   Tres verdes e um azul: a quinta porta vai para o outro lado do circulo de cores, o TERRACOTA
   (#b03d16), quente, que nao se confunde com nenhum deles nem com o vermelho de perigo do painel.

   CONTRASTE MEDIDO (WCAG, a conta de luminancia relativa), cada numero ao lado da cor. Texto pede
   4,5:1; borda de campo e anel de foco, 3:1. `scripts/testar-sistemas.mjs` remede o `--primary` no
   navegador, porta por porta.

   TEMA ESCURO: fundo GRAFITE NEUTRO (#141414, os tres canais iguais), sem verde e sem azul no fundo,
   pedido do lider da r85; so a cor de interface (`--primary`) clareia para o pessego, senao some.
   Como nas outras folhas, so TOKENS: nenhum seletor de componente (ver _LEIA-ME.md).
   ============================================================ */
body[data-porta="maquina"] {
  --primary: #b03d16; /* terracota: 5,96:1 no branco, 5,14:1 no --accent */
  --primary-hover: #8f3112; /* 8,03:1 */
  /* MARCA SOLIDA: fundo grande com texto claro por cima, igual no claro e no escuro (ver sistema-polo.css) */
  --marca-solida: #b03d16; /* o branco por cima: 5,96:1 */
  --marca-solida-forte: #8f3112; /* 8,03:1 */
  --marca-solida-tinta: #ffffff;

  --secondary: #f7f1ee;
  --secondary-foreground: #4a2416; /* 12,07:1 no --secondary */
  --muted: #f7f3f1;
  --muted-foreground: #6b5b54; /* 6,46:1 no branco, 5,86:1 no --muted */
  --accent: #f8ece6;
  --accent-foreground: #1a1210;
  --border: #ece4e0;
  --input: #8f817a; /* 3,76:1 */
  --ring: #c25a33; /* 4,37:1 */
  --sidebar: #ffffff;
  --sidebar-accent: #f7f1ee;
  --pontos: #d8ccc6;
  --foreground: #1a1210; /* 18,45:1 */
  --card-foreground: #1a1210;
  --popover-foreground: #1a1210;
  --ok: #3f6b2e; /* 6,26:1 */
  --ok-fundo: #edf3e8;
  /* series de grafico: terracota, ambar, petroleo, roxo, mostarda, marrom (figura, nunca texto) */
  --chart-1: #b03d16;
  --chart-2: #d9822b;
  --chart-3: #2f7d7a;
  --chart-4: #6b4fa0;
  --chart-5: #c2a83e;
  --chart-6: #8a5a44;
  --sombra-sm: 0 1px 2px rgba(26, 18, 16, 0.06);
  --sombra-md: 0 4px 16px -4px rgba(26, 18, 16, 0.12), 0 1px 3px rgba(26, 18, 16, 0.06);
  --sombra-lg: 0 16px 40px -12px rgba(26, 18, 16, 0.22);
}
@media (prefers-color-scheme: dark) {
  html:not([data-tema="claro"]) body[data-porta="maquina"] {
    --background: #141414; /* grafite neutro: os tres canais iguais */
    --card: #141414;
    --popover: #1c1c1c;
    --foreground: #ededed; /* 15,74:1 */
    --card-foreground: #ededed;
    --popover-foreground: #ededed;
    --primary: #f0a07c; /* pessego: 8,79:1 no fundo, e o grafite por cima dele 8,79:1 */
    --primary-foreground: #141414;
    --primary-hover: #f5b899; /* 10,70:1 */
    --secondary: #1c1c1c;
    --secondary-foreground: #dedede; /* 12,67:1 */
    --muted: #1a1a1a;
    --muted-foreground: #a3a3a3; /* 7,30:1 no fundo, 6,90:1 no --muted */
    --accent: #222222;
    --accent-foreground: #ededed;
    --border: #2e2e2e;
    --input: #6e6e6e; /* 3,61:1 */
    --ring: #d9825c; /* 6,40:1 */
    --sidebar: #161616;
    --sidebar-accent: #1f1f1f;
    --pontos: #333333;
    --ok: #8fb76e; /* 8,04:1 */
    --ok-fundo: #182010;
    --chart-1: #e8875f;
    --chart-2: #efa65a;
    --chart-3: #5fb3ae;
    --chart-4: #a08ad0;
    --chart-5: #d9c46a;
    --chart-6: #c08e76;
  }
}
html[data-tema="escuro"] body[data-porta="maquina"] {
  --background: #141414;
  --card: #141414;
  --popover: #1c1c1c;
  --foreground: #ededed;
  --card-foreground: #ededed;
  --popover-foreground: #ededed;
  --primary: #f0a07c;
  --primary-foreground: #141414;
  --primary-hover: #f5b899;
  --secondary: #1c1c1c;
  --secondary-foreground: #dedede;
  --muted: #1a1a1a;
  --muted-foreground: #a3a3a3;
  --accent: #222222;
  --accent-foreground: #ededed;
  --border: #2e2e2e;
  --input: #6e6e6e;
  --ring: #d9825c;
  --sidebar: #161616;
  --sidebar-accent: #1f1f1f;
  --pontos: #333333;
  --ok: #8fb76e;
  --ok-fundo: #182010;
  --chart-1: #e8875f;
  --chart-2: #efa65a;
  --chart-3: #5fb3ae;
  --chart-4: #a08ad0;
  --chart-5: #d9c46a;
  --chart-6: #c08e76;
}

/* A COR DA PORTA NO PORTAL (r84 e r85, 03/10/2026): o cartao desta porta na tela do Portal (assets/css/portal.css) le duas
   variaveis. `--porta-marca` e FIGURA (o filete do alto, a pastilha, o circulo da seta: 3:1 ou mais) e
   `--porta-texto` e TEXTO (a palavra "Sistema": 4,5:1 ou mais). O terracota da porta, o mesmo do `--primary` dela; no
   escuro o pessego, porque o terracota some no grafite.
   Claro: marca #b03d16 (5,96:1 no branco), texto #b03d16 (5,96:1 no branco). Escuro: marca #e8875f (6,54:1 no cartao
   escuro #1c1c1c), texto #f0a07c (8,14:1 no cartao escuro). */
.porta-cartao[data-porta="maquina"] {
  --porta-marca: #b03d16;
  --porta-texto: #b03d16;
}
@media (prefers-color-scheme: dark) {
  html:not([data-tema="claro"]) .porta-cartao[data-porta="maquina"] {
    --porta-marca: #e8875f;
    --porta-texto: #f0a07c;
  }
}
html[data-tema="escuro"] .porta-cartao[data-porta="maquina"] {
  --porta-marca: #e8875f;
  --porta-texto: #f0a07c;
}