/* ============================================================
   BRAIN — camada de marca
   Valores lidos direto de braintecnologia.com.br em 07/08/2026.
   Este é o único arquivo que muda quando a identidade muda.
   ============================================================ */

:root {
  /* ---------- PALETA OFICIAL ---------- */
  --marca-azul:    #174580;  /* azul Brain — botões e ações principais */
  --marca-navy:    #08274E;  /* navy das seções escuras do site */
  --marca-realce:  #3D8FE0;  /* azul clareado: indicadores sobre fundo navy.
                                Derivado do #174580 — o azul original não
                                separa do navy e o item ativo sumiria. */
  --papel:         #F6F6F6;  /* cinza de fundo do site */
  --superficie:    #FFFFFF;
  --tinta:         #101418;
  --tinta-fraca:   #5C6670;
  --linha:         #DFE3E8;

  /* Situações — cor com significado operacional.
     A equipe aprende a ler o parque por cor antes de ler o texto. */
  --ok:       #12805E;   /* disponível */
  --campo:    #174580;   /* no cliente — o próprio azul da marca */
  --atencao:  #B06A00;   /* preparação, manutenção, triagem */
  --critico:  #A32626;   /* baixado, extraviado */
  --transito: #5B4BA6;   /* em trânsito */
  --neutro:   #67707A;

  /* ---------- LOGO ---------- */
  /* Baixados por `node src/logos.js`. O logo cheio é branco (o site usa
     ele sobre fundo escuro), então cai certo no cabeçalho navy. */
  --logo-url: url('/marca/logo.svg');
  --logo-largura: 74px;
  --logo-altura: 24px;

  /* ---------- TIPOGRAFIA ---------- */
  /* Inter é a fonte do site. Não carrego de servidor externo: o depósito
     tem rede ruim e requisição a terceiro é discussão a mais em LGPD.
     Onde a Inter existir na máquina, usa; senão cai na fonte do sistema. */
  --sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;

  --carvao: var(--marca-navy);
  --carvao-claro: #123A6B;
  --r: 6px;
  --r-botao: 22px;    /* o site usa cápsula: 23–29px */
}

/* ---------- cabeçalho ---------- */
.topo { background: var(--marca-navy); }
.topo .logotipo {
  display: inline-block; width: 0; height: var(--logo-altura);
  background: var(--logo-url, none) left center / contain no-repeat;
  vertical-align: middle; transition: width .15s;
}
/* A classe com-logo só entra depois que o arquivo carregou de fato.
   Sem ela, o cabeçalho mostra "BRAIN · ativos" em texto e nada quebra. */
body.com-logo .topo .logotipo { width: var(--logo-largura); margin-right: 10px; }
body.com-logo .topo .marca { font-size: 0; }
body.com-logo .topo .marca span { font-size: 12px; letter-spacing: .12em; color: #8FAACB; }

/* ---------- navegação ---------- */
.nav { background: var(--marca-navy); }
.nav a.atual { border-color: var(--marca-realce); background: #0C3160; color: #fff; }

/* ---------- ações ---------- */
.btn {
  background: var(--marca-azul); border-color: var(--marca-azul);
  border-radius: var(--r-botao); font-weight: 500;
}
.btn.secundario { background: transparent; border-color: var(--linha); color: var(--tinta); }
.btn.pequeno { border-radius: var(--r-botao); }
a { color: var(--marca-azul); }
:focus-visible { outline: 2px solid var(--marca-realce); outline-offset: 2px; }

/* ---------- cartões ---------- */
.cartao, .caixa, .linha { border-radius: var(--r); }
.abas button.atual { border-bottom-color: var(--marca-azul); }

/* ---------- tela de entrada ---------- */
/* O logo cheio é branco (feito para fundo escuro). A entrada tem fundo
   claro, então aqui entra o símbolo colorido, que é a versão certa. */
.login .marca { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--marca-navy); }
.login .marca .logotipo-login { display: none; }
body.com-logo .login .marca .logotipo-login {
  display: block; width: 46px; height: 53px;
  background: url('/marca/logo-mini.svg') center / contain no-repeat;
}
.login .risca { background: var(--marca-azul); height: 3px; border-radius: 2px; }
.login .legenda { color: var(--tinta-fraca); }
