/* ============================================================
   FnOS — CAMADA DE TOKENS (fn-tokens.css)
   OS-S5-UI-003B. Extraida de fn-shell.css SEM alteracao de valor: e a mesma
   declaracao, no mesmo arquivo de origem, movida para que possa ser entregue a
   telas que ainda nao herdam a casca do Layout Mestre.
   CONTEM SOMENTE custom properties. Nenhuma regra de layout, nenhum seletor de
   elemento, nenhuma classe — e isso que permite carrega-la nas 26 telas da
   Fase B sem mover uma unica caixa.
   Fonte unica (M1/L1): fn-shell.css passa a importar este arquivo em vez de
   declarar os tokens.
   Autoridade de valores: docs/fep-design-system.md secoes 2 a 7.
   ============================================================ */

:root {
  /* 2.1 — marca e neutras (claro) — Vermelho FardaNova, valores já em uso
     em 14 telas de produção antes deste documento existir (auditoria
     FDS-001 §2) */
  --fep-primaria:#A6001A; --fep-primaria-forte:#7E0014; --fep-primaria-suave:#FBEDEB;
  --fep-fundo:#F6F4F2; --fep-superficie:#FFFFFF; --fep-superficie-2:#FBF9F7;
  --fep-borda:#E8E2DD; --fep-texto:#1A1512; --fep-texto-2:#8A7E77; --fep-texto-3:#B9AFA9;
  /* 2.2 — severidade (funcional — nunca compete com a marca) */
  --fep-sev-critica:#B3261E; --fep-sev-critica-suave:#FBEDEB;
  --fep-sev-alta:#EA580C;    --fep-sev-alta-suave:#FFEDE0;
  --fep-sev-media:#B7791F;   --fep-sev-media-suave:#FFF7E6;
  --fep-sev-baixa:#2563EB;   --fep-sev-baixa-suave:#EAF1FF;
  --fep-sev-normal:#1B7F4B;  --fep-sev-normal-suave:#E7F4EC;
  /* 2.4 — gargalo (cor exclusiva, nunca reutilizada para outro significado) */
  --fep-gargalo:#7C3AED; --fep-gargalo-suave:#F1E9FE;
  /* interação (hover/foco/seleção — genérico, para qualquer superfície) */
  --fep-hover:rgba(15,10,8,.05); --fep-ativo:rgba(15,10,8,.09);
  --fep-selecionado-bg:var(--fep-primaria-suave); --fep-selecionado-borda:var(--fep-primaria);
  --fep-foco:0 0 0 3px rgba(166,0,26,.28);
  /* paleta categórica p/ gráficos e dashboards (8 cores, distintas da marca,
     ordem estável — nunca reordenar entre gráficos do mesmo relatório) */
  --fep-cat-1:#A6001A; --fep-cat-2:#2563EB; --fep-cat-3:#1B7F4B; --fep-cat-4:#B7791F;
  --fep-cat-5:#7C3AED; --fep-cat-6:#0E7490; --fep-cat-7:#BE185D; --fep-cat-8:#57534E;
  /* 3 — tipografia */
  --fep-fonte:Inter,"Segoe UI",system-ui,sans-serif;
  --fep-fonte-mono:"JetBrains Mono",ui-monospace,monospace;
  --fep-tam-titulo-1:28px; --fep-tam-titulo-2:20px; --fep-tam-titulo-3:16px;
  --fep-tam-corpo:14px; --fep-tam-apoio:12px; --fep-tam-kpi:32px;
  /* 5 — espaçamentos (base 4px) */
  --fep-esp-1:4px; --fep-esp-2:8px; --fep-esp-3:12px; --fep-esp-4:16px;
  --fep-esp-5:24px; --fep-esp-6:32px; --fep-esp-7:48px; --fep-esp-8:64px;
  /* 6 — sombras */
  --fep-elev-0:none; --fep-elev-1:0 1px 2px rgba(26,21,18,.06);
  --fep-elev-2:0 4px 12px rgba(26,21,18,.10); --fep-elev-3:0 12px 32px rgba(26,21,18,.18);
  /* 7 — raios */
  --fep-raio-1:6px; --fep-raio-2:10px; --fep-raio-3:16px; --fep-raio-cheio:999px;
  /* 4 — grid/regiões fixas */
  --fep-h-topo:56px; --fep-w-menu:256px; --fep-w-menu-recolhido:64px; --fep-w-painel:384px;
  /* transparências (2.3) */
  --fep-alfa-veu:.48; --fep-alfa-desabilitado:.45; --fep-alfa-esqueleto:.6;
  /* z-index (2.4) */
  --fep-z-fixo:100; /* REMVAR-02: diálogos/notificações/crítico acima da barra fixa do FnChrome (9500) */ --fep-z-menu:200; --fep-z-painel:300; --fep-z-dialogo:9600; --fep-z-notificacao:9700; --fep-z-critico:9800;
  /* 10 — animações (fep-design-system.md §10) */
  --fep-dur-micro:120ms; --fep-dur-padrao:200ms; --fep-dur-painel:320ms;
  --fep-curva:cubic-bezier(.2,.8,.2,1);
  /* GUIDED FLOW — campos por ESTADO SEMÂNTICO (docs/fn-guided-flow.md). "Ação" = o creme claro JÁ aprovado na SPA (Parâmetros Gerais: #FFFBEA em sistema-bundle.js),
     agora como token reutilizável. Cor nunca é o único sinal: cada estado também tem borda/forma e texto (ver fn-guided.css). */
  --fep-campo-acao-bg:#FFFBEA; --fep-campo-acao-borda:#E6DBB0;
  --fep-campo-auto-bg:var(--fep-superficie);
  --fep-campo-leitura-bg:#F1EEEA; --fep-campo-leitura-texto:#6B6159;
  --fep-campo-pendente:var(--fep-sev-media); --fep-campo-erro:var(--fep-sev-critica); --fep-campo-erro-bg:var(--fep-sev-critica-suave);
  --fep-campo-ok:var(--fep-sev-normal); --fep-campo-atencao:var(--fep-sev-alta); --fep-campo-foco:var(--fep-foco);
  /* CAMADA DE AÇÃO (H — ação secundária, "prata acetinado") — tokens HOMOLOGADOS (claro = V2.1, escuro = V2; protótipo em prototipos/acoes/, homologação visual do Proprietário em 13/10/2026).
     Só a ação SECUNDÁRIA tem visual; primária segue o vermelho existente; decisão negativa/destrutiva/navegação NÃO têm tokens (visual pendente). Docs: docs/fn-acoes-contrato.md. */
  --fep-botao-sec-bg:linear-gradient(180deg,#FCFCFD 0%,#F3F5F6 34%,#E7EBEE 64%,#D5DADF 100%);
  --fep-botao-sec-bg-hover:linear-gradient(180deg,#FFFFFF 0%,#F8FAFB 34%,#EDF0F3 64%,#DDE2E6 100%);
  --fep-botao-sec-bg-active:linear-gradient(180deg,#D0D5DA 0%,#DBDFE3 100%);
  --fep-botao-sec-borda:#AEB6BE;
  --fep-botao-sec-borda-hover:#939CA6;
  --fep-botao-sec-borda-foco:#24282D;
  --fep-botao-sec-texto:#24282D;
  --fep-botao-sec-sombra:inset 0 1px 0 #FFFFFF, inset 0 -1px 0 rgba(95,108,121,.24), 0 1px 2px rgba(26,30,36,.16);
  --fep-botao-sec-sombra-hover:inset 0 1px 0 #FFFFFF, inset 0 -1px 0 rgba(95,108,121,.26), 0 2px 4px rgba(26,30,36,.18);
  --fep-botao-sec-sombra-active:inset 0 1px 3px rgba(26,30,36,.22);
  --fep-botao-sec-foco:0 0 0 3px rgba(36,40,45,.26);
  /* BARRA SUPERIOR — ILUMINAÇÃO CONTEXTUAL (OS de 17/10/2026; decisão da Diretoria D1/D3, versão 3 "retroiluminada uniforme"). Consumidos SÓ por fn-chrome.js.
     A barra é escura nos DOIS temas, por isso estes tokens não têm variante clara/escura: um único valor vale para ambos.
     Cada aba é uma "tecla retroiluminada": PREENCHIMENTO translúcido UNIFORME por toda a superfície retangular (sem foco central), cantos discretos.
     Ouro = abas inativas e toque; laranja = módulo ativo (preenchimento + linha). Níveis = fração do preenchimento pleno em cada estado. */
  --fep-nav-halo-ouro:rgba(255,224,92,.32);        /* preenchimento dourado pleno (toque); em repouso aparece a --fep-nav-nivel-repouso */
  --fep-nav-halo-laranja:rgba(251,146,60,.40);     /* preenchimento laranja pleno (módulo ativo) */
  --fep-nav-nivel-repouso:.66;                     /* dourado permanente nas abas de topo inativas (≈ 21% efetivo) */
  --fep-nav-nivel-sub-toque:.55;                   /* toque num item de submenu (sem luz permanente nos submenus) */
  --fep-nav-nivel-sub-ativa:.85;                   /* item ativo do submenu: preenchimento laranja (≈ 34% efetivo), abaixo da aba de topo ativa */
  /* GENESIS-001 — abertura pós-login (fn-genesis.js); só aditivo */
  --fep-genesis-fundo:#141210;                     /* véu escuro sobre a home durante a abertura */
  --fep-genesis-luz:#E8536B;                       /* linhas e pulsos de conexão */
  --fep-genesis-texto:#EDEAE6;                     /* rótulos das placas */
  --fep-genesis-botao-fundo:rgba(237,234,230,.08); /* botão "Pular animação" */
  --fep-nav-raio:4px;                              /* cantos discretamente arredondados da tecla (substitui o raio zero) */
  --fep-nav-linha:rgb(251,146,60);                 /* linha inferior luminosa do módulo ativo */
  --fep-nav-linha-brilho:rgba(251,146,60,.85);
  --fep-nav-linha-sub:rgba(251,146,60,.95);        /* linha do item ativo do submenu */
  --fep-nav-linha-brilho-sub:rgba(251,146,60,.50);
  --fep-nav-folha-ativa:#E6E1DB;                   /* "folha" (módulo › tela) sobre o laranja: contraste ≥ 4,5:1 (AA) */
  --fep-nav-foco:rgba(240,200,100,.9);             /* foco de teclado nas abas */
}
/* modo escuro automático (preferência do SO) — só quando a página não fixou data-tema="claro" */
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --fep-fundo:#141210; --fep-superficie:#1B1815; --fep-superficie-2:#211E1A;
    --fep-borda:#2A2724; --fep-texto:#EDEAE6; --fep-texto-2:#9A938C; --fep-texto-3:#6B6459;
    --fep-primaria:#E8536B; --fep-primaria-forte:#F0596B; --fep-primaria-suave:#3A1620;
    --fep-sev-critica:#F0596B; --fep-sev-critica-suave:#3A1620;
    --fep-sev-alta:#FB923C;   --fep-sev-alta-suave:#3A2712;
    --fep-sev-media:#E8B84B;  --fep-sev-media-suave:#3A2E12;
    --fep-sev-baixa:#60A5FA;  --fep-sev-baixa-suave:#152238;
    --fep-sev-normal:#3FCB82; --fep-sev-normal-suave:#123526;
    --fep-gargalo:#A78BFA; --fep-gargalo-suave:#241C3A;
    --fep-hover:rgba(255,255,255,.06); --fep-ativo:rgba(255,255,255,.10);
    --fep-foco:0 0 0 3px rgba(232,83,107,.35);
    --fep-cat-1:#E8536B; --fep-cat-2:#60A5FA; --fep-cat-3:#3FCB82; --fep-cat-4:#E8B84B;
    --fep-cat-5:#A78BFA; --fep-cat-6:#22D3EE; --fep-cat-7:#F472B6; --fep-cat-8:#A8A29E;
    --fep-campo-acao-bg:#2B2616; --fep-campo-acao-borda:#4A4222;
    --fep-campo-auto-bg:var(--fep-superficie); --fep-campo-leitura-bg:#1F1C19; --fep-campo-leitura-texto:#A39C95;
    --fep-botao-sec-bg:linear-gradient(180deg,#B2B7BE 0%,#A3A9B0 36%,#969CA3 64%,#8A9098 100%);
    --fep-botao-sec-bg-hover:linear-gradient(180deg,#C2C7CD 0%,#B3B9BF 36%,#A7ADB3 64%,#9AA0A7 100%);
    --fep-botao-sec-bg-active:linear-gradient(180deg,#7E848B 0%,#868C93 100%);
    --fep-botao-sec-borda:#C7CCD2;
    --fep-botao-sec-borda-hover:#DDE1E5;
    --fep-botao-sec-borda-foco:#F4F5F6;
    --fep-botao-sec-texto:#101215;
    --fep-botao-sec-sombra:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.18), 0 1px 3px rgba(0,0,0,.5);
    --fep-botao-sec-sombra-hover:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.2), 0 2px 5px rgba(0,0,0,.5);
    --fep-botao-sec-sombra-active:inset 0 1px 3px rgba(0,0,0,.4);
    --fep-botao-sec-foco:0 0 0 3px rgba(244,245,246,.35);
  }
}
/* modo escuro fixado por preferência do perfil (data-tema="escuro") — vence a preferência do SO nos dois sentidos */
:root[data-tema="escuro"] {
  --fep-fundo:#141210; --fep-superficie:#1B1815; --fep-superficie-2:#211E1A;
  --fep-borda:#2A2724; --fep-texto:#EDEAE6; --fep-texto-2:#9A938C; --fep-texto-3:#6B6459;
  --fep-primaria:#E8536B; --fep-primaria-forte:#F0596B; --fep-primaria-suave:#3A1620;
  --fep-sev-critica:#F0596B; --fep-sev-critica-suave:#3A1620;
  --fep-sev-alta:#FB923C;   --fep-sev-alta-suave:#3A2712;
  --fep-sev-media:#E8B84B;  --fep-sev-media-suave:#3A2E12;
  --fep-sev-baixa:#60A5FA;  --fep-sev-baixa-suave:#152238;
  --fep-sev-normal:#3FCB82; --fep-sev-normal-suave:#123526;
  --fep-gargalo:#A78BFA; --fep-gargalo-suave:#241C3A;
  --fep-hover:rgba(255,255,255,.06); --fep-ativo:rgba(255,255,255,.10);
  --fep-foco:0 0 0 3px rgba(232,83,107,.35);
  --fep-cat-1:#E8536B; --fep-cat-2:#60A5FA; --fep-cat-3:#3FCB82; --fep-cat-4:#E8B84B;
  --fep-cat-5:#A78BFA; --fep-cat-6:#22D3EE; --fep-cat-7:#F472B6; --fep-cat-8:#A8A29E;
  --fep-campo-acao-bg:#2B2616; --fep-campo-acao-borda:#4A4222;
  --fep-campo-auto-bg:var(--fep-superficie); --fep-campo-leitura-bg:#1F1C19; --fep-campo-leitura-texto:#A39C95;
  --fep-botao-sec-bg:linear-gradient(180deg,#B2B7BE 0%,#A3A9B0 36%,#969CA3 64%,#8A9098 100%);
  --fep-botao-sec-bg-hover:linear-gradient(180deg,#C2C7CD 0%,#B3B9BF 36%,#A7ADB3 64%,#9AA0A7 100%);
  --fep-botao-sec-bg-active:linear-gradient(180deg,#7E848B 0%,#868C93 100%);
  --fep-botao-sec-borda:#C7CCD2;
  --fep-botao-sec-borda-hover:#DDE1E5;
  --fep-botao-sec-borda-foco:#F4F5F6;
  --fep-botao-sec-texto:#101215;
  --fep-botao-sec-sombra:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.18), 0 1px 3px rgba(0,0,0,.5);
  --fep-botao-sec-sombra-hover:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.2), 0 2px 5px rgba(0,0,0,.5);
  --fep-botao-sec-sombra-active:inset 0 1px 3px rgba(0,0,0,.4);
  --fep-botao-sec-foco:0 0 0 3px rgba(244,245,246,.35);
}