/* Ajustes visuais específicos do GR Controle de Pedidos entram aqui. */ /* Identidade visual: paleta simples inspirada em metal/aço (mesma do logo, app/static/img/logo.svg) — azul-aço como cor principal, laranja queimado (galvanização/oxidação) só como acento em poucos lugares. Tema dark (data-bs-theme="dark" no , ver base.html/login.html): mesmo hue do azul-aço, com uma variante mais clara (--gr-azul-aco-claro) pra manter contraste legível de texto/bordas sobre fundo escuro — a variante escura original continua servindo de fundo (navbar, botões). */ :root { --gr-azul-aco: #1f3a5f; --gr-azul-aco-claro: #6f9bc4; --gr-laranja: #e07b39; } .navbar { background-color: var(--gr-azul-aco); } .btn-primary { --bs-btn-bg: var(--gr-azul-aco); --bs-btn-border-color: var(--gr-azul-aco); --bs-btn-hover-bg: var(--gr-laranja); --bs-btn-hover-border-color: var(--gr-laranja); --bs-btn-active-bg: var(--gr-laranja); --bs-btn-active-border-color: var(--gr-laranja); } /* Fundo escuro com leve tom azulado (combinando com o azul-aço da marca, em vez de um cinza/preto neutro genérico) — dá contraste com os cards e campos de formulário do tema dark do Bootstrap sem fugir da identidade. */ body { background-color: #131a22; } /* Melhora o contraste das telas de edição (cadastros e pedido): título da página com linha de destaque, subtítulos de seção com a cor da marca em vez do cinza genérico do Bootstrap, cabeçalho das grades com leve contraste — uso sóbrio, sem colorir o conteúdo em si. Usa a variante clara do azul-aço pra manter contraste sobre o fundo escuro. */ main h1 { padding-bottom: 0.5rem; border-bottom: 2px solid var(--gr-azul-aco-claro); } main h2.text-muted { color: var(--gr-azul-aco-claro) !important; } .table thead th { background-color: rgba(111, 155, 196, 0.12); border-bottom: 2px solid var(--gr-azul-aco-claro); } /* Não usa a largura total da tela — mais próximo do layout do sistema antigo, principalmente em monitores largos. Ainda dá espaço suficiente pra grade de itens do pedido (12 colunas) não quebrar linha. */ .navbar > .container-fluid, main.container-fluid { max-width: 1600px; margin-left: auto; margin-right: auto; } /* Dropdowns de busca (cliente/produto) são position: absolute sem largura própria — por padrão encolhem/crescem pro tamanho do conteúdo, e um nome comprido pode empurrar a caixa pra fora da tela em telas estreitas (celular), forçando rolagem horizontal da página inteira. Trava na largura do campo de busca (elemento pai, position: relative). */ .list-group.position-absolute { width: 100%; max-width: 100%; }