/* ═══════════════════════════════════════════════════════════════════════ TRIDMINAS — marca.css Tokens visuais compartilhados pelos sistemas. Este arquivo NÃO reestiliza nada sozinho: ele só declara variáveis. Cada sistema decide onde usá-las. Isso é de propósito — os seis foram construídos com CSS próprio, e sobrescrever regras à força quebraria telas que ninguém está olhando agora. Uso: .meu-botao { background: var(--trid-azul); font-family: var(--trid-fonte); } ═══════════════════════════════════════════════════════════════════════ */ :root{ /* ─── cores da marca ─── */ --trid-azul: #1A3A5C; /* azul institucional, o do favicon */ --trid-azul-escuro: #0D1218; /* fundo do portal */ --trid-laranja: #F07030; /* destaque, o "T" do favicon */ --trid-azul-claro: #A2C0FE; /* elipse clara do símbolo */ --trid-azul-medio: #5A8CFD; --trid-azul-forte: #1A50D7; /* ─── superfícies e traços (tema escuro) ─── */ --trid-painel: #141C24; --trid-painel-2: #0F161D; --trid-linha: #24313D; --trid-linha-forte: #354757; /* ─── texto ─── */ --trid-texto: #E6EDF3; --trid-texto-fraco: #8DA0B0; /* ─── estados ─── */ --trid-ok: #4FC08D; --trid-aviso: #F2C230; --trid-erro: #E86A6A; /* ─── tipografia ─── */ --trid-fonte: "IBM Plex Sans", system-ui, -apple-system, sans-serif; --trid-fonte-titulo: "Archivo", "IBM Plex Sans", sans-serif; --trid-fonte-mono: "IBM Plex Mono", ui-monospace, monospace; /* ─── medidas ─── */ --trid-raio: 14px; --trid-raio-sm: 8px; --trid-largura: 1180px; } /* Marca no cabeçalho. A logo é branca sobre fundo escuro; em fundo claro use a versão escura do kit. */ .trid-logo{ height:38px; width:auto; max-width:260px; object-fit:contain; display:block; } @media (max-width:640px){ .trid-logo{ height:30px; max-width:170px; } } /* ─── marcador de versão ─────────────────────────────────────────────── Serve para responder "o que está no ar é o que eu publiquei?" sem precisar lembrar quais funcionalidades são novas. Discreto por padrão, legível ao passar o mouse. Incremente ao publicar. */ .trid-build{ /* left:66px passa do trilho de ícones (56px de largura) dos sistemas com shell lateral. O canto inferior direito está ocupado pelos avisos. */ position:fixed; left:66px; bottom:8px; z-index:9999; font-family:var(--trid-fonte-mono); font-size:10px; letter-spacing:.06em; color:var(--trid-texto-fraco); opacity:.32; pointer-events:none; user-select:none; transition:opacity .2s; } @media (hover:hover){ .trid-build:hover{ opacity:.9 } } @media print{ .trid-build{ display:none } } /* Variante de rodapé: sai do flutuante e entra no fim do documento. Serve para páginas que rolam normalmente (Carreiras, Portal). Nos sistemas cujo shell tem height:100vh e rolagem interna — Gestão, Financeiro, EPI, Ferramentas — o fixo é necessário: um elemento no fim do documento ficaria fora da área visível, já que o body não rola. */ .trid-build--rodape{ position:static; left:auto; bottom:auto; margin-top:auto; /* empurra para o fim da coluna */ padding:18px 20px 14px; opacity:.34; } /* O margin-top:auto acima só funciona se o pai for uma coluna flexível de altura mínima igual à janela. Sem isto, position:static apenas coloca o marcador depois do conteúdo — que numa página curta é o meio da tela, não o rodapé. Aplique a classe no . */ body.trid-pagina{ min-height:100vh; display:flex; flex-direction:column; }