/* =====================================================================
 *  KRIGS - TOKENS OFICIAIS DA PLATAFORMA
 *  Documento 04 (Design System), secao 2.
 *
 *  Copie este arquivo para o sistema novo SEM ALTERAR NENHUM VALOR.
 *  E o unico arquivo da plataforma onde cor literal e permitida - um
 *  teste de convencao reprova hexadecimal fora daqui.
 * ===================================================================== */

:root{
  /* ---- Azul KRIGS: a cor da plataforma ---------------------------- */
  --azul:        #0d47a1;   /* primaria: titulos, destaques, fios de relatorio */
  --azul-2:      #1565c0;   /* acao: botao primario, links                     */
  --azul-claro:  #e3f0ff;   /* realce: fundo de destaque, anel de foco         */
  --azul-700:    #0a3a86;   /* superficie escura intermediaria                 */
  --azul-900:    #061a40;   /* superficie escura profunda                      */

  /* ---- Estados ---------------------------------------------------- */
  --verde:          #2e7d32;   --verde-claro:    #e8f5e9;
  --amarelo:        #f9a825;   --amarelo-claro:  #fff4d6;
  --vermelho:       #c62828;   --vermelho-claro: #fdecea;
  --laranja:        #e8590c;   --laranja-claro:  #fff1e6;

  /* ---- Neutros ---------------------------------------------------- */
  --texto:   #1f2733;   /* texto principal              */
  --cinza:   #5b6470;   /* texto secundario             */
  --cinza-2: #8a929c;   /* auxiliar, desabilitado       */
  --linha:   #e2e6ea;   /* bordas e divisores           */
  --bg:      #f4f6f9;   /* fundo da pagina              */
  --branco:  #ffffff;   /* fundo de superficie          */

  /* ---- Elevacao e forma -------------------------------------------- */
  --sombra:    0 1px 3px rgba(16,24,40,.08), 0 1px 2px rgba(16,24,40,.06);
  --sombra-lg: 0 10px 25px -5px rgba(16,24,40,.15), 0 8px 10px -6px rgba(16,24,40,.10);
  --raio:      10px;   /* cartoes, paineis  */
  --raio-sm:   8px;    /* botoes, campos    */
  --raio-pill: 20px;   /* selos             */

  /* ---- Tipografia --------------------------------------------------- */
  --fonte: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* ---- Gradientes oficiais (os tres, e apenas estes) ---------------- */
  --grad-institucional: linear-gradient(120deg,#06183b 0%,#0a2f6e 55%,#0d3f8f 100%);
  --grad-entrada:       linear-gradient(135deg,#061a40 0%,#0a2f6e 60%,#0d3f8f 100%);
  --grad-placa:         linear-gradient(135deg,#0a2f6e,#0d3f8f);
}

/* ---- Tema escuro: OPCIONAL por produto, mas quando existe e este ---
 * Nunca uma segunda folha de estilo: apenas os tokens mudam.
 * Nao se aplica a tela de entrada nem a impressao.
 * ------------------------------------------------------------------- */
:root[data-theme="dark"]{
  --texto:   #e5edf7;
  --cinza:   #94a3b8;   --cinza-2: #7c8ba1;
  --linha:   #2b3a52;
  --bg:      #0b1220;   --branco:  #151f30;
  --sombra:    0 1px 3px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.35);
  --sombra-lg: 0 10px 25px -5px rgba(0,0,0,.6), 0 8px 12px -6px rgba(0,0,0,.5);
}

/* ---- Moldura oficial da plataforma (KFROTA - KRIGS-STANDARD §20) ------
 * Copiado de KFROTA/public/css/app.css. Nao aproximar: se o KFROTA mudar,
 * este bloco muda junto.
 * Existe aqui porque a moldura usa medidas e superficies escuras que o
 * Documento 04 nao nomeia - sem estes tokens, o app.css precisaria de cor
 * literal, que o teste de convencao reprova.
 * A lateral e escura nos dois temas: este bloco NAO tem versao escura. */
:root{
  --nav-w:       248px;                 /* largura do menu lateral - fixa */
  --topo-h:      60px;                  /* altura da barra superior */
  --nav-fundo-1: #0b1220;               /* topo do gradiente da lateral */
  --nav-fundo-2: #0e1830;               /* base do gradiente da lateral */
  --nav-texto:   #cbd5e1;               /* item em repouso */
  --nav-apagado: #475569;               /* categoria e rodape da lateral */
  --nav-marca:   #94a3b8;               /* nome da empresa e "KRIGS BRASIL LTDA" */
  --nav-linha:   rgba(255,255,255,.08); /* divisoria do topo e do rodape */
  --nav-hover:   rgba(255,255,255,.06); /* fundo do item sob o cursor */
  --nav-ativo-s: 0 4px 12px rgba(21,101,192,.4);   /* sombra do item selecionado */
}

/* ---- Bloco proprio do K-RH -------------------------------------------
 * GAP DO ARQUIVO OFICIAL: o bloco [data-theme="dark"] acima inverte
 * --texto, --cinza, --linha, --bg e --branco, mas NAO inverte
 * --azul-claro. Quem usar --azul-claro como fundo de um elemento com
 * texto em --texto fica com texto claro sobre fundo claro no modo
 * escuro - foi o que aconteceu com o seletor de empresa.
 *
 * Nao alteramos a paleta oficial por conta propria: isso e decisao de
 * plataforma, e mexeria em KFROTA e KEPI junto. Enquanto nao for
 * levado adiante, o K-RH usa token proprio, com as duas versoes.
 * ------------------------------------------------------------------- */
:root{
  --krh-realce-fundo: #e3f0ff;   /* = --azul-claro no tema claro */
  --krh-realce-linha: #bfdbfe;

  /* ---- Superficies de lista (krh-ui.css) --------------------------------
   * O arquivo oficial resolve a tabela com cor literal (#f7f9fc no cabecalho,
   * #fafcff no hover). Cor literal nao inverte: no tema escuro aquilo vira
   * faixa branca dentro de uma tabela escura. Estes tokens sao a mesma
   * intencao com as duas versoes. */
  --krh-superficie-2: #f5f7fa;   /* cabecalho de tabela, barra da lista     */
  --krh-faixa:        #fafbfd;   /* zebra - so em tabela larga              */
  --krh-hover:        #eff5fd;   /* linha sob o cursor                      */
  --krh-linha-suave:  #edf0f4;   /* fio entre linhas: mais leve que --linha */
  --krh-total-fundo:  #dbe4f2;   /* linha de total                          */

  /* Anel de foco. O oficial usa --azul-claro (#e3f0ff), que sobre branco da
   * 1,2:1 - quem enxerga pouco nao ve onde esta o teclado. Este da 5,6:1. */
  --krh-foco: #1565c0;

  /* Numero grande do indicador. Igual ao --azul no claro; no escuro o --azul
   * (#0d47a1) sobre #151f30 fica em 1,5:1, ou seja, invisivel. */
  --krh-num: #0d47a1;

  /* Texto sobre --krh-realce-fundo. O par existia pela metade: o fundo
   * tinha as duas versoes e a letra ficava em --azul-2 (#1565c0) nos dois
   * temas. No escuro isso e azul escuro sobre azul escuro, 2,66:1 - a
   * conferencia de tela pegou justamente na frase "mostrando 500 de 501",
   * que e um aviso, e aviso ilegivel nao avisa nada. */
  --krh-realce-texto: #0d47a1;

  /* ---- Selos: fundo e texto, aos pares -------------------------------- */
  --krh-selo-neutro-fundo:   #eef1f5;  --krh-selo-neutro-texto:   #4a5462;
  --krh-selo-verde-fundo:    #e8f5e9;  --krh-selo-verde-texto:    #1b5e20;
  --krh-selo-amarelo-fundo:  #fff4d6;  --krh-selo-amarelo-texto:  #7a5000;
  --krh-selo-vermelho-fundo: #fdecea;  --krh-selo-vermelho-texto: #a52020;
  --krh-selo-azul-fundo:     #e3f0ff;  --krh-selo-azul-texto:     #0d47a1;

  /* ---- Avisos --------------------------------------------------------- */
  --krh-ok-fundo:   #e8f5e9;  --krh-ok-linha:   #bfe3c0;  --krh-ok-texto:   #1b5e20;
  --krh-erro-fundo: #fdecea;  --krh-erro-linha: #f3c2bd;  --krh-erro-texto: #922b21;

  /* ---- Formulario e botao secundario ---------------------------------- */
  --krh-borda-campo: #cfd6df;
  --krh-sec-linha:   #c5d4ec;
  --krh-sec-hover:   #f1f6ff;

  /* Sombra do cabecalho quando ele gruda: e o unico sinal de que a tabela
   * rolou por baixo. Sem token oficial equivalente. */
  --krh-sombra-fixa: 0 4px 10px -6px rgba(16,24,40,.35);

  /* Veu e sombra da camada (gaveta e modal). O arquivo oficial resolve o
   * ::backdrop do `dialog.modal` com cor literal; a camada do K-RH usa
   * token para nao repetir hexadecimal fora daqui. */
  --krh-veu:            rgba(16,24,40,.5);
  --krh-camada-sombra:  -18px 0 48px -18px rgba(16,24,40,.38);

  /* ---- O PAPEL DO DOCUMENTO -------------------------------------------
   * A folha do editor NAO e superficie de tela: e papel. Ela nao segue o
   * tema, e por isso estes quatro nao tem par no bloco escuro abaixo.
   *
   * POR QUE ISTO IMPORTA, e nao e capricho: o corpo do documento chega do
   * arquivo original com a cor escrita dentro dele (o Regulamento Interno
   * traz 31 marcas de cor). Se a folha virasse azul-marinho no tema
   * escuro, o texto preto que veio do papel ficaria preto sobre
   * azul-marinho, e a pessoa assinaria um documento que nao consegue ler.
   * Papel e branco e tinta e escura nos dois temas, como sai na impressora.
   *
   * A TINTA E MAIS ESCURA QUE --texto de proposito: --texto (#1f2733) e
   * cinza-azulado, escolhido para tela; documento impresso sai em tinta
   * quase preta, e e essa a referencia que o dono compara com o Word.
   * ------------------------------------------------------------------- */
  --krh-papel:        #ffffff;   /* a folha                                */
  --krh-papel-tinta:  #16181c;   /* o texto que nao traz cor propria       */
  --krh-papel-linha:  #b6bcc4;   /* fio de tabela e marca de quebra        */
  --krh-papel-mesa:   #71767f;   /* a mesa em volta da folha em tela cheia */
}
:root[data-theme="dark"]{
  --krh-realce-fundo: #12263f;
  --krh-realce-linha: #24405f;
  --krh-realce-texto: #9ec7ff;   /* sobre #12263f da 7,4:1 */

  --krh-superficie-2: #1b2434;
  --krh-faixa:        #131d2c;
  --krh-hover:        #1d2a3d;
  --krh-linha-suave:  #1f2c40;
  --krh-total-fundo:  #1c2c44;

  --krh-foco: #7cb1ff;
  --krh-num:  #7fb5ff;

  --krh-selo-neutro-fundo:   #223046;  --krh-selo-neutro-texto:   #bccadb;
  --krh-selo-verde-fundo:    #12301c;  --krh-selo-verde-texto:    #7fd694;
  --krh-selo-amarelo-fundo:  #332608;  --krh-selo-amarelo-texto:  #f2c14e;
  --krh-selo-vermelho-fundo: #3a1717;  --krh-selo-vermelho-texto: #ff9d94;
  --krh-selo-azul-fundo:     #12263f;  --krh-selo-azul-texto:     #93c5fd;

  --krh-ok-fundo:   #12301c;  --krh-ok-linha:   #1f5130;  --krh-ok-texto:   #8fe0a3;
  --krh-erro-fundo: #3a1717;  --krh-erro-linha: #6b2626;  --krh-erro-texto: #ffa79e;

  --krh-borda-campo: #33425c;
  --krh-sec-linha:   #33425c;
  --krh-sec-hover:   #1d2a3d;

  --krh-sombra-fixa: 0 4px 12px -6px rgba(0,0,0,.75);

  --krh-veu:           rgba(2,6,16,.66);
  --krh-camada-sombra: -18px 0 48px -18px rgba(0,0,0,.8);
}
