/* ERP PRISM4 (PRISM4 Serviços e Soluções) — visual do sistema (versão HTML).
   Paleta (a mesma do login e do site):
     escuro #09090B · destaque #2563EB (hover #1D4ED8) · esmeralda #10B981
     fundo #F8FAFC · painel #FFFFFF · texto #111827 · suave #6B7280 · borda #E5E7EB / #D1D5DB
   Tipografia: Inter (se instalada) → Segoe UI Variable → Segoe UI. */
:root {
  --marinho: #111827; --marinho-esc: #09090b; --azul: #2563eb; --agua: #10b981; --agua-claro: #ecfdf5;
  --fundo: #f8fafc; --painel: #ffffff; --texto: #111827; --suave: #6b7280; --borda: #e5e7eb; --borda-forte: #d1d5db;
  --primaria: #2563eb; --primaria-esc: #1d4ed8; --ok: #047857; --ok-fundo: #ecfdf5; --erro: #b91c1c; --erro-fundo: #fef2f2;
  --aviso: #92400e; --aviso-fundo: #fffbeb; --deb: #1d4ed8; --cred: #b91c1c;
  --gradiente: linear-gradient(135deg, #2563eb 0%, #3b82f6 55%, #10b981 100%);
  --sombra: 0 1px 2px rgba(17, 24, 39, .04), 0 4px 14px -6px rgba(17, 24, 39, .08);
  --raio: 12px; --raio-p: 8px;
  --fonte: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font: 14px/1.5 var(--fonte); color: var(--texto); background: var(--fundo); -webkit-font-smoothing: antialiased; }
a { color: var(--primaria); text-decoration: none; }
a:hover { text-decoration: underline; }
[hidden] { display: none !important; }

/* ------------------------------------------------------------ topo: barra de título + faixa de abas com botões grandes
   (organização de menu em faixa, como nos sistemas contábeis de mesa; marca e ícones próprios do PRISM4) */
header.topo { position: sticky; top: 0; z-index: 20; background: #fff; box-shadow: 0 1px 3px rgba(15, 39, 66, .12); }
.barra-titulo { display: flex; align-items: center; gap: 14px; padding: 3px 14px 3px 6px; background: #f8fafc; border-bottom: 1px solid #e5e7eb; min-height: 36px; }
.botao-app { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: -2px 0 -14px; border-radius: 50%; background: #fff;
  border: 1px solid var(--borda-forte); box-shadow: 0 1px 4px rgba(15, 39, 66, .18); position: relative; z-index: 2; }
.botao-app .logo-app { width: 30px; height: auto; display: block; }
.titulo-app { flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 13px; color: var(--primaria); letter-spacing: .02em; }
.titulo-marca { font-weight: 700; color: var(--marinho); letter-spacing: .08em; }
.modulos-app { display: inline-flex; border: 1px solid var(--borda-forte); border-radius: 14px; overflow: hidden; background: #fff; }
.modulo-app { padding: 3px 12px; font-size: 12.5px; color: var(--suave); }
.modulo-app + .modulo-app { border-left: 1px solid var(--borda-forte); }
.modulo-app:hover { text-decoration: none; color: var(--primaria); background: #eff6ff; }
.modulo-app.ativo { background: var(--marinho); color: #fff; font-weight: 600; }
.empresa-ativa { display: flex; align-items: center; gap: 6px; }
.empresa-ativa span { font-size: 11px; color: var(--suave); }
.empresa-ativa select { width: 260px; max-width: 30vw; padding: 3px 6px; font-size: 12.5px; }
header.topo .direita { display: flex; align-items: center; gap: 12px; font-size: 12.5px; }
header.topo .direita > a { color: var(--marinho); }
.busca-menu { display: flex; align-items: center; border: 1px solid var(--borda-forte); background: #fff; color: var(--suave); padding-right: 6px; }
.busca-menu input { border: 0; outline: 0; width: 230px; padding: 4px 7px; font-size: 12.5px; font-style: italic; background: transparent; }
.busca-menu input.sem-resultado { color: var(--erro); }
.busca-menu:focus-within { border-color: var(--azul); }
.usuario { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.avatar { width: 22px; height: 22px; border-radius: 50%; background: var(--gradiente); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; }
a.sair { color: var(--erro) !important; }
.status-banco { font-size: 11.5px; color: var(--ok); background: var(--ok-fundo); border-radius: 10px; padding: 1px 8px; white-space: nowrap; }
.status-banco.alerta { background: var(--aviso-fundo); color: var(--aviso); }
.faixa-abas { display: flex; gap: 2px; padding: 4px 10px 0 52px; background: #f8fafc; border-bottom: 1px solid #e5e7eb; }
.faixa-aba { border: 1px solid transparent; border-bottom: 0; background: none; padding: 5px 12px 6px; font: inherit; font-size: 12.5px; color: var(--texto); cursor: pointer; border-radius: 3px 3px 0 0; margin-bottom: -1px; }
.faixa-aba:hover { background: #fff; color: var(--primaria); }
.faixa-aba.ativa { background: #fff; border-color: #e5e7eb; color: var(--marinho); font-weight: 600; box-shadow: inset 0 2px 0 var(--azul); }
.faixa { display: flex; align-items: stretch; padding: 4px 6px 0; background: #fff; border-bottom: 1px solid #e5e7eb; overflow-x: auto; min-height: 96px; }
.faixa-grupo { display: flex; flex-direction: column; border-right: 1px solid #e5e7eb; padding: 0 4px; }
.faixa-botoes { display: flex; align-items: flex-start; flex: 1; }
.faixa-botao { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 62px; max-width: 128px; padding: 4px 6px 3px; border: 1px solid transparent; border-radius: 3px;
  color: var(--texto); font-size: 12px; line-height: 1.2; text-align: center; }
.faixa-botao svg { flex: 0 0 auto; }
.faixa-botao span { white-space: nowrap; }
.faixa-botao:hover { text-decoration: none; background: #eff6ff; border-color: #bfdbfe; }
.faixa-botao.ativo { background: #dbeafe; border-color: #93c5fd; }
.faixa-nome { text-align: center; font-size: 11.5px; color: var(--suave); padding: 2px 0 3px; }
.abas-trabalho { display: flex; align-items: flex-end; gap: 2px; padding: 5px 8px 0; background: #f8fafc; border-bottom: 1px solid #e5e7eb; overflow-x: auto; }
.aba-t { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: #f8fafc; border: 1px solid #e5e7eb; border-bottom: 0; border-radius: 3px 3px 0 0;
  font-size: 13px; color: var(--marinho); white-space: nowrap; margin-bottom: -1px; }
.aba-t a { color: inherit; display: inline-flex; align-items: center; gap: 6px; }
.aba-t a:hover, a.aba-t:hover { text-decoration: none; color: var(--primaria); }
.aba-t.principal { font-size: 15px; color: var(--suave); padding: 6px 18px; }
.aba-t.ativa { background: #fff; color: var(--marinho); font-weight: 600; }
.aba-t.principal.ativa { color: var(--marinho); }
.fechar-aba { border: 0; background: none; color: var(--suave); cursor: pointer; font-size: 15px; line-height: 1; padding: 0 0 0 2px; }
.fechar-aba:hover { color: var(--erro); }

/* ------------------------------------------------------------ corpo: coluna de links (só na tela Principal) + conteúdo */
.corpo { display: grid; grid-template-columns: 170px minmax(0, 1fr); min-height: calc(100vh - 180px); }
body.sem-lateral .corpo { grid-template-columns: minmax(0, 1fr); }
body.tela-login .corpo { display: block; min-height: 100vh; }
nav.lateral { background: #f8fafc; border-right: 1px solid var(--borda); padding: 0; }
nav.lateral a { display: block; padding: 18px 8px 18px 8px; font-size: 13px; color: var(--suave); border-bottom: 1px solid #e5e7eb; }
nav.lateral a.forte { color: var(--primaria); font-weight: 600; }
nav.lateral a:hover { background: #fff; text-decoration: none; color: var(--marinho); }
main { padding: 18px 24px 48px; max-width: 1500px; width: 100%; }
body:not(.sem-lateral):not(.tela-login) main { padding: 0 0 40px; max-width: none; }

/* ------------------------------------------------------------ tela Principal */
.principal .atalhos-topo { display: flex; align-items: stretch; background: #7f95a8; min-height: 58px; }
.atalho-bloco { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 92px; background: var(--laranja, #e2672b); color: #fff; font-size: 12.5px; border-right: 1px solid rgba(255, 255, 255, .25); }
.atalho-bloco:hover { background: #c9581f; text-decoration: none; }
.atalho-bloco svg { width: 26px; height: 26px; filter: brightness(0) invert(1); }
.atalhos-info { display: flex; flex-direction: column; justify-content: flex-end; padding: 6px 12px; color: #fff; font-size: 12.5px; }
.atalhos-info b { font-size: 14px; }
.faixa-aviso { display: flex; align-items: center; gap: 16px; background: #10c3a0; color: #fff; padding: 12px 18px; position: relative; }
.faixa-aviso-texto { flex: 1; font-size: 14px; line-height: 1.5; }
.faixa-aviso-botao { background: #2563eb !important; color: #fff !important; padding: 9px 30px; font-weight: 600; border-radius: 2px; border: 0; }
.faixa-aviso-fechar { position: absolute; top: 2px; right: 6px; border: 0; background: none; color: #fff; font-size: 16px; cursor: pointer; }
.principal-corpo { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 0; align-items: start; }
.banner { display: flex; align-items: center; gap: 10px; background: #09090b; background-image: linear-gradient(120deg, #09090b 0%, #17385c 55%, #2563eb 130%); color: #fff; min-height: 330px; padding: 30px 30px 30px 40px; overflow: hidden; }
.banner-texto { flex: 1; max-width: 470px; }
.banner-logo { height: 46px; width: auto; background: #fff; border-radius: 6px; padding: 5px 8px; margin-bottom: 16px; }
.banner h2 { color: #fff; font-size: 31px; line-height: 1.15; margin: 0 0 14px; }
.banner h2 span { color: #ff8a4c; }
.banner p { font-size: 17px; line-height: 1.5; margin: 0 0 22px; opacity: .95; }
.banner-botao { background: #2563eb !important; color: #fff !important; font-weight: 700; font-size: 17px; letter-spacing: .02em; padding: 10px 22px; border-radius: 2px; }
.banner-arte { width: 300px; max-width: 42%; height: auto; flex: 0 0 auto; }
.cartao-noticias { background: #f8fafc; margin: 0 10px; padding: 12px 14px; border: 1px solid #e1e6ec; }
.cartao-noticias h3 { margin: 0 0 8px; font-size: 13px; color: var(--marinho); }
.noticia-linha { display: block; padding: 7px 0; border-top: 1px solid #e5e7eb; color: var(--texto); font-size: 12.5px; }
.noticia-linha b { display: block; color: var(--marinho); }
.noticia-linha span { color: var(--suave); }
.noticia-linha:hover { text-decoration: none; }
.noticia-linha:hover b { color: var(--laranja-esc, #c9581f); }
.principal .indicadores { padding: 16px 18px 0; }
body.tela-login main { padding: 0; max-width: none; }

/* ------------------------------------------------------------ página de abertura e login
   Formato em duas partes: à esquerda o formulário em fundo liso (logo no topo, campos com rótulo, botão de largura
   total e links); à direita um painel de apresentação (título com destaque, benefícios e o produto com os módulos
   em órbita). No celular fica só o formulário.
   Paleta: fundo #FFFFFF · painel #09090B→#1D4ED8 · destaque #2563EB (hover #1D4ED8) · esmeralda #10B981 · texto #111827 · suave #6B7280 · borda #D1D5DB */
.login-pagina {
  --lg-acento: #2563eb; --lg-acento-esc: #1d4ed8; --lg-esmeralda: #10b981; --lg-texto: #111827; --lg-suave: #6b7280; --lg-borda: #d1d5db;
  font-family: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
  display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; background: #fff; color: var(--lg-texto);
}

/* ---- esquerda: formulário */
.login-lado { display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 28px 20px 20px; gap: 28px; }
.login-form { width: 100%; max-width: 420px; animation: login-entrar .45s ease; }
@keyframes login-entrar { from { opacity: 0; transform: translateY(10px); } }
.login-logo { display: flex; justify-content: center; align-items: center; gap: 10px; margin: 6px 0 34px; font-size: 24px; font-weight: 800; letter-spacing: .02em; color: var(--lg-texto) !important; text-decoration: none !important; }
.login-logo img { height: 118px; width: auto; max-width: 260px; object-fit: contain; } /* logo completo (com a assinatura) */
.login-logo small, .titulo-marca small, .hub-marca small { font-size: 10.5px; font-weight: 700; letter-spacing: .14em; padding: 2px 6px; border-radius: 6px; vertical-align: 3px; }
.login-logo small { background: #eff6ff; color: var(--lg-acento); }
.titulo-marca small { background: #eff6ff; color: var(--azul); }
.hub-marca small { background: rgba(255, 255, 255, .16); }
.logo-grande { width: 150px; height: auto; margin: 0 0 18px; }
.login-ola { margin: 0; color: var(--lg-suave); font-size: 14px; }
.login-form h1 { font-size: 26px; font-weight: 800; color: var(--lg-texto); margin: 2px 0 6px; letter-spacing: -.02em; }
.login-desc { margin: 0 0 22px; color: var(--lg-suave); font-size: 14px; }
.login-form form { display: flex; flex-direction: column; gap: 18px; }
.login-form .campo { gap: 6px; }
.login-form .campo label { font-size: 13.5px; font-weight: 600; color: var(--lg-texto); }
.obrig { color: #dc2626; }
.login-form input:not([type=checkbox]) { padding: 12px 14px; font-size: 15px; border-radius: 10px; border: 1px solid var(--lg-borda); background: #fff; color: var(--lg-texto); transition: border-color .15s, box-shadow .15s; }
.login-form input:not([type=checkbox]):hover { border-color: #9ca3af; }
.login-form input:not([type=checkbox]):focus { outline: 0; border-color: var(--lg-acento); box-shadow: 0 0 0 4px rgba(37, 99, 235, .15); }
.login-form input[type=checkbox] { accent-color: var(--lg-acento); width: 16px; height: 16px; }
.login-form .senha-caixa .olho { right: 6px; }
.login-form a { color: var(--lg-acento); font-weight: 600; }
.caps { margin-top: 6px; font-size: 12px; font-weight: 600; color: #8a5a00; background: #fff4d6; border-radius: 8px; padding: 4px 8px; display: inline-block; }
.caps[hidden] { display: none; }
.login-opcoes { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13.5px; }
.login-opcoes .chk { display: inline-flex; gap: 8px; align-items: center; color: var(--lg-suave); }
/* botão principal de largura total */
button.entrar { margin-top: 4px; padding: 13px; font-size: 15.5px; font-weight: 700; color: #fff; background: var(--lg-acento, #2563eb); border: 0; border-radius: 10px;
  box-shadow: 0 10px 22px -12px rgba(37, 99, 235, .9); transition: transform .15s, box-shadow .2s, background .2s; display: inline-flex; justify-content: center; align-items: center; gap: 10px; }
button.entrar:hover { background: var(--lg-acento-esc, #1d4ed8); transform: translateY(-1px); box-shadow: 0 14px 28px -12px rgba(37, 99, 235, 1); }
button.entrar:focus-visible { outline: 0; box-shadow: 0 0 0 4px rgba(37, 99, 235, .35); }
button.entrar.carregando::before { content: ""; width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: girar .7s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
.tremer { animation: tremer .4s ease; }
@keyframes tremer { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.login-links { margin-top: 14px; display: flex; justify-content: space-between; }
.login-pasta { margin-top: 20px; padding-top: 14px; border-top: 1px solid #eef0f3; font-size: 12px; color: var(--lg-suave); }
.login-form .passo { border-radius: 10px; background: #f8fafc; border-color: #e5e7eb; }
/* links abaixo do formulário: ainda não é cliente / escritório contábil */
.login-extra { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 26px; font-size: 13.5px; color: var(--lg-suave); text-align: center; }
.login-rodape { width: 100%; max-width: 420px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-size: 12px; color: var(--lg-suave); }
.login-seguro { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; background: #ecfdf5; color: #047857; font-size: 12.5px; }
.login-seguro svg { flex: 0 0 auto; width: 16px; height: 16px; }

/* ---- direita: painel de apresentação (só a partir de 1024px) */
.login-promo { display: none; position: relative; overflow: hidden; isolation: isolate; color: #fff;
  background: radial-gradient(900px 520px at 100% 0%, rgba(37, 99, 235, .85), transparent 60%), radial-gradient(700px 420px at 0% 100%, rgba(16, 185, 129, .35), transparent 60%), linear-gradient(160deg, #0b1220 0%, #09090b 55%, #0f1d4a 100%); }
.login-promo::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 40px 40px; -webkit-mask-image: radial-gradient(ellipse at 60% 40%, #000 20%, transparent 75%); mask-image: radial-gradient(ellipse at 60% 40%, #000 20%, transparent 75%); }
.login-brilho { position: absolute; z-index: -1; right: -120px; top: -120px; width: 380px; height: 380px; border-radius: 50%; background: radial-gradient(circle, rgba(251, 191, 36, .55), rgba(251, 191, 36, 0) 70%); filter: blur(10px); animation: login-flutuar 20s ease-in-out infinite; }
@keyframes login-flutuar { 50% { transform: translate(-30px, 30px) scale(1.06); } }
.login-promo-texto { max-width: 560px; }
.login-selo { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; padding: 6px 14px; border-radius: 999px;
  background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); color: #e4e4e7; }
.login-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--lg-esmeralda); box-shadow: 0 0 0 4px rgba(16,185,129,.22); }
.login-titulo { font-size: clamp(34px, 3.6vw, 54px); font-weight: 800; line-height: 1.05; letter-spacing: -.03em; margin: 18px 0 0; color: #fff; }
.login-titulo em { font-style: normal; color: #fbbf24; }
.login-sub { font-size: 17px; line-height: 1.6; color: #cbd5e1; margin: 16px 0 0; }
.login-sub b { color: #fff; }
/* produto com os módulos em órbita */
.lg-orbita { position: relative; width: min(560px, 100%); aspect-ratio: 1.35; margin: 26px auto 0; display: grid; place-items: center; }
.lg-anel { position: absolute; inset: 6% 2%; border-radius: 50%; border: 1px dashed rgba(255,255,255,.18); }
.lg-mock { position: relative; z-index: 1; width: 66%; padding: 14px; border-radius: 16px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); }
.lg-mock-topo { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #a1a1aa; margin-bottom: 12px; }
.lg-mock-topo span { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.2); }
.lg-mock-topo b { margin-left: 8px; font-weight: 600; color: #e4e4e7; }
.lg-mock-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.lg-mock-kpis div { padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.lg-mock-kpis small { display: block; font-size: 10.5px; color: #a1a1aa; margin-bottom: 6px; }
.lg-mock-kpis i { display: block; height: 5px; border-radius: 6px; background: linear-gradient(90deg, var(--lg-acento), #60a5fa); }
.lg-mock-kpis div:nth-child(2) i { background: linear-gradient(90deg, var(--lg-esmeralda), #34d399); }
.lg-mock-kpis div:nth-child(3) i { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.lg-mock-grafico { position: relative; display: flex; align-items: flex-end; gap: 10px; height: 96px; padding: 0 4px 16px; }
.lg-mock-grafico span { position: relative; flex: 1; border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg, rgba(96,165,250,.8), rgba(37,99,235,.25)); }
.lg-mock-grafico em { position: absolute; bottom: -16px; left: 0; right: 0; text-align: center; font-style: normal; font-size: 10px; color: #71717a; }
.lg-mock-grafico svg { position: absolute; inset: 0 4px 16px; width: calc(100% - 8px); height: calc(100% - 16px); }
.lg-bolha { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px 9px 10px; border-radius: 999px; background: #fff; color: var(--lg-acento);
  box-shadow: 0 12px 30px -10px rgba(0,0,0,.6), 0 0 0 6px rgba(255,255,255,.08); font-size: 13px; animation: lg-boiar 6s ease-in-out infinite; }
.lg-bolha em { font-style: normal; font-weight: 700; color: var(--lg-texto); }
.lg-bolha.b0 { left: 0; top: 10%; } .lg-bolha.b1 { right: 0; top: 4%; animation-delay: -1.5s; }
.lg-bolha.b2 { left: 2%; bottom: 8%; animation-delay: -3s; } .lg-bolha.b3 { right: 2%; bottom: 14%; animation-delay: -4.5s; }
.lg-bolha.b1 { color: var(--lg-esmeralda); } .lg-bolha.b2 { color: #d97706; } .lg-bolha.b3 { color: #6366f1; }
@keyframes lg-boiar { 50% { transform: translateY(-10px); } }
.login-garantias { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 13px; color: #cbd5e1; }
.login-garantias li { display: inline-flex; align-items: center; gap: 6px; } .login-garantias svg { color: #34d399; }

@media (min-width: 640px) { .login-lado { padding: 36px 32px 24px; } }
@media (min-width: 1024px) {
  .login-pagina { grid-template-columns: minmax(440px, 5fr) 7fr; }
  .login-lado { padding: 40px 56px 28px; }
  .login-promo { display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 56px 64px 40px; min-height: 100vh; }
}
@media (min-width: 1024px) and (max-height: 820px) { .lg-orbita { width: min(440px, 100%); margin-top: 14px; } .login-titulo { font-size: 40px; } }
@media (prefers-reduced-motion: reduce) { .login-brilho, .login-form, .lg-bolha, .tremer { animation: none; } }
.passo { background: #f5f8fb; border: 1px solid var(--borda); border-radius: 6px; padding: 9px 12px; margin-bottom: 8px; font-size: 13px; }
.chave { font: 600 22px/1.4 Consolas, monospace; letter-spacing: .08em; text-align: center; padding: 16px; border: 2px dashed var(--agua); border-radius: 8px; background: var(--agua-claro); color: var(--marinho); margin: 10px 0; }

/* senha com "olhinho" e indicador da regra */
.senha-caixa { position: relative; display: flex; }
.senha-caixa input { flex: 1; padding-right: 40px; width: 100%; }
.senha-caixa .olho { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: var(--suave); padding: 6px 8px; cursor: pointer; }
.senha-caixa .olho:hover { color: var(--marinho); background: none; }
.forca { font-size: 12px; color: var(--suave); margin-top: -6px; }
.forca.fraca { color: var(--erro); } .forca.boa { color: var(--ok); }

/* ------------------------------------------------------------ elementos gerais */
h1 { font-size: 21px; margin: 2px 0 16px; color: var(--marinho); }
h2 { font-size: 16px; margin: 24px 0 10px; color: var(--marinho); }
.painel { background: var(--painel); border: 1px solid var(--borda); border-radius: 8px; padding: 16px 18px; margin-bottom: 16px; box-shadow: var(--sombra); }
.linha { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.campo { display: flex; flex-direction: column; gap: 4px; }
.campo label, label.rot, span.rot { font-size: 12px; color: var(--suave); }
input, select, textarea { font: inherit; padding: 6px 8px; border: 1px solid var(--borda-forte); border-radius: 5px; background: #fff; color: var(--texto); }
input:focus, select:focus, textarea:focus { outline: 2px solid #bfdbfe; border-color: var(--azul); }
input[readonly] { background: #f0f4f8; }
textarea { min-height: 70px; }
.chk { display: flex; align-items: center; gap: 6px; }
button, .botao { font: inherit; padding: 7px 14px; border-radius: 5px; border: 1px solid var(--primaria); background: var(--primaria); color: #fff; cursor: pointer; display: inline-block; }
button:hover, .botao:hover { background: var(--primaria-esc); border-color: var(--primaria-esc); text-decoration: none; }
button:disabled { opacity: .6; cursor: wait; }
button.sec, .botao.sec { background: #fff; color: var(--primaria); }
button.sec:hover, .botao.sec:hover { background: #eef4fb; }
button.perigo { background: #fff; color: var(--erro); border-color: var(--erro); }
button.perigo:hover { background: var(--erro-fundo); }
button.peq, .botao.peq { padding: 2px 8px; font-size: 12px; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { padding: 6px 9px; border-bottom: 1px solid #eef0f3; text-align: left; vertical-align: top; }
th { background: #f8fafc; font-size: 12px; color: var(--suave); font-weight: 600; position: sticky; top: 0; }
tr:hover td { background: #f9fafb; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sint td { font-weight: 600; }
.inativa td { color: #9aa5b1; }
.deb { color: var(--deb); } .cred { color: var(--cred); }
.etq { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.etq.aberto { background: var(--aviso-fundo); color: var(--aviso); }
.etq.liberado, .etq.ok { background: var(--ok-fundo); color: var(--ok); }
.etq.uso { background: #dbeafe; color: var(--primaria); }
.etq.pend { background: var(--erro-fundo); color: var(--erro); }
.aviso { padding: 10px 13px; border-radius: 6px; margin-bottom: 12px; border: 1px solid; }
.aviso.ok { background: var(--ok-fundo); border-color: #a6dfc0; color: var(--ok); }
.aviso.erro { background: var(--erro-fundo); border-color: #f5b5ae; color: var(--erro); }
.aviso.info { background: var(--aviso-fundo); border-color: #f0d58c; color: var(--aviso); }
.suave { color: var(--suave); font-size: 12px; }
.acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.grade-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px 14px; }
.grade-form .largo { grid-column: span 2; }
.totais { display: flex; gap: 22px; font-variant-numeric: tabular-nums; flex-wrap: wrap; }
.dif-zero { color: var(--ok); } .dif-nao { color: var(--erro); }
.recuo { display: inline-block; }
.rolavel { max-height: 70vh; overflow: auto; border: 1px solid var(--borda); border-radius: 8px; }
form.inline { display: inline; }
.nowrap { white-space: nowrap; }
code { background: #eef2f6; border-radius: 3px; padding: 1px 4px; font-size: 12px; }

/* painel da empresa e início */
.cab-empresa { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; border-left: 4px solid var(--agua); }
.nome-empresa { font-size: 19px; font-weight: 600; margin: 2px 0; color: var(--marinho); }
.cols { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 22px; }
.painel-tab { border: 1px solid var(--borda); border-radius: 8px; overflow: hidden; }
.atalhos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.atalhos a { display: block; background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 11px 13px; color: var(--texto); box-shadow: var(--sombra); }
.atalhos a:hover { border-color: var(--azul); text-decoration: none; background: #f7fbff; }
.atalhos b { display: block; color: var(--marinho); }
.atalhos span { font-size: 12px; color: var(--suave); }
.pendencias { background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 10px 14px 10px 30px; margin: 0; }
.pendencias li { margin: 4px 0; }
.boas-vindas { background: var(--gradiente); color: #fff; border-radius: 10px; padding: 20px 24px; margin-bottom: 18px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: center; }
.boas-vindas h1 { color: #fff; margin: 0 0 4px; }
.boas-vindas p { margin: 0; opacity: .92; }
.indicadores { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.indicador { background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 12px 14px; box-shadow: var(--sombra); color: var(--texto); }
.indicador:hover { text-decoration: none; border-color: var(--azul); }
.indicador .n { font-size: 24px; font-weight: 700; color: var(--marinho); }
.indicador .r { font-size: 12px; color: var(--suave); }
.noticias { display: grid; gap: 10px; }
.noticia { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 12px 14px; color: var(--texto); box-shadow: var(--sombra); }
.noticia:hover { border-color: var(--agua); text-decoration: none; }
.noticia .fonte { flex: 0 0 42px; height: 42px; border-radius: 8px; background: var(--agua-claro); color: var(--marinho); font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.noticia b { display: block; color: var(--marinho); }
.noticia span { font-size: 12px; color: var(--suave); }
.reservado { border: 2px dashed var(--borda-forte); border-radius: 8px; padding: 14px; color: var(--suave); background: #fbfcfe; font-size: 13px; }
.em-construcao { border-left: 4px solid var(--aviso); }
.selo { display: inline-block; background: var(--aviso-fundo); color: var(--aviso); font-weight: 700; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; border-radius: 10px; padding: 2px 10px; margin-bottom: 6px; }
.opcoes-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.opcao { display: block; background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 14px 16px; color: var(--texto); box-shadow: var(--sombra); }
.opcao:hover { border-color: var(--azul); text-decoration: none; }
.opcao b { display: block; color: var(--marinho); margin-bottom: 3px; }
.opcao span { font-size: 12px; color: var(--suave); }

/* análise gráfica (paleta categórica validada: série 1 azul #2a78d6, série 2 laranja #eb6834) */
.grafico-caixa { position: relative; }
svg.grafico { width: 100%; height: auto; display: block; }
svg.grafico .grade { stroke: #e8edf2; stroke-width: 1; }
svg.grafico .base { stroke: #9aa8b6; stroke-width: 1; }
svg.grafico .eixo { font-size: 11px; fill: var(--suave); }
svg.grafico .barra.receitas { fill: #2a78d6; }
svg.grafico .barra.despesas { fill: #eb6834; }
svg.grafico .alvo { fill: transparent; cursor: crosshair; }
svg.grafico .alvo.ativo { fill: rgba(23, 56, 92, .05); }
.legenda { display: flex; gap: 18px; align-items: center; margin-bottom: 8px; font-size: 13px; flex-wrap: wrap; }
.legenda span { display: inline-flex; align-items: center; gap: 6px; }
.amostra { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }
.amostra.receitas { background: #2a78d6; } .amostra.despesas { background: #eb6834; }
.dica { position: absolute; pointer-events: none; background: #fff; border: 1px solid var(--borda); border-radius: 6px; box-shadow: var(--sombra);
  padding: 8px 10px; font-size: 12px; min-width: 190px; color: var(--texto); }
.dica div { display: flex; align-items: center; gap: 6px; margin-top: 3px; }
.dica div span { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; }

/* ------------------------------------------------------------ livros e relatórios (modo relatório e impressão) */
body.modo-relatorio { background: #fff; }
body.modo-relatorio header.topo, body.modo-relatorio nav.lateral { display: none !important; }
body.modo-relatorio .corpo { display: block; }
body.modo-relatorio main { max-width: 1200px; margin: 0 auto; padding: 14px 18px 40px; }
.rel { font: 11px/1.35 "Segoe UI", Arial, sans-serif; color: #111; }
.rel .barra-rel { display: flex; gap: 8px; margin-bottom: 14px; align-items: center; flex-wrap: wrap; font-size: 13px; position: sticky; top: 0; background: #fff; padding: 8px 0; z-index: 5; border-bottom: 1px solid var(--borda); }
.rel .barra-rel .logo-rel { height: 26px; margin-right: 8px; }
.rel header.cab { border-bottom: 1.5px solid #111; margin-bottom: 6px; padding-bottom: 4px; }
.rel header.cab .t { font-size: 14px; font-weight: 700; }
.rel header.cab .l { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rel table { width: 100%; border-collapse: collapse; background: #fff; }
.rel th, .rel td { padding: 2px 5px; border-bottom: .5px solid #ccc; vertical-align: top; text-align: left; font-size: 11px; }
.rel th { background: #eef2f6; font-weight: 600; color: #111; position: static; }
.rel thead { display: table-header-group; }
.rel tr:hover td { background: transparent; }
.rel .sint td { font-weight: 700; }
.rel .tot td { font-weight: 700; border-top: 1px solid #111; border-bottom: 1.5px solid #111; }
.rel .conta-cab td { background: #f4f6f8; font-weight: 700; border-top: 1px solid #888; }
.rel .sep td { border-top: 1px solid #888; }
.rel .ass { display: flex; gap: 60px; margin-top: 50px; page-break-inside: avoid; }
.rel .ass div { flex: 1; border-top: 1px solid #111; padding-top: 3px; text-align: center; }
.rel .termo { padding: 60px 20px 20px; font-size: 13px; line-height: 1.7; page-break-after: always; }
.rel .termo h2 { text-align: center; font-size: 16px; color: #111; }
.rel .holerite { border: 1px solid #333; padding: 10px 12px; margin-bottom: 14px; font-size: 12px; page-break-inside: avoid; }
.rel .holerite.segundo { page-break-after: always; }
.rel .hol-cab { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #333; padding-bottom: 6px; margin-bottom: 6px; }
.rel .hol-titulo { text-align: right; font-weight: 700; font-size: 13px; }
.rel .hol-titulo span { font-weight: 400; font-size: 12px; }
.rel .hol-func, .rel .hol-bases { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 4px 0 8px; }
.rel .hol-bases { border-top: 1px solid #999; padding-top: 6px; margin-top: 6px; }
.rel .holerite table { margin: 0; }
.rel .hol-assina { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-top: 18px; font-size: 11.5px; }
.rel .notas { font-size: 12.5px; line-height: 1.6; color: #111; }
.rel .notas h3 { font-size: 13px; margin: 16px 0 4px; page-break-after: avoid; }
.rel .notas p { margin: 0 0 6px; text-align: justify; }
.rel .quebra { page-break-before: always; }
.rel h3 { font-size: 13px; margin: 18px 0 6px; }
/* Financeiro (cartões de totais e painel, como no Conta Azul) */
.fin-mes { display: flex; align-items: center; gap: 6px; align-self: end; }
.fin-mes b { min-width: 150px; text-align: center; font-size: 13px; }
.fin-mes .botao { padding: 4px 10px; }
.fin-cartoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border: 1px solid var(--borda); border-radius: 8px; overflow: hidden; margin: 0 0 12px; background: #fff; }
.fin-cartao { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 10px 8px; border-right: 1px solid var(--borda); text-decoration: none; color: inherit; }
.fin-cartao:last-child { border-right: 0; }
.fin-cartao span { font-size: 12px; color: var(--suave); }
.fin-cartao b { font-size: 17px; font-variant-numeric: tabular-nums; }
.fin-cartao small { font-size: 11px; color: var(--suave); }
.fin-cartao.sel { box-shadow: inset 0 -3px 0 var(--primaria); }
.fin-cartao b.azul { color: var(--primaria); }
.verde { color: #1e9e57; } .vermelho { color: #d64532; }
.fin-painel { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin: 12px 0; }
.fin-bloco { background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; }
.fin-bloco h3 { margin: 0 0 8px; font-size: 14px; }
.fin-bloco .fin-cartoes { margin: 0; }
.fin-saldo { display: flex; flex-direction: column; align-items: center; margin-bottom: 6px; }
.fin-saldo b { font-size: 20px; }
tr.fin-baixa td { background: #f8fafc; font-size: 12px; }
table.fin-conc td { vertical-align: top; }
tr.fin-vazio td { color: #a7b1bc; }
table.fin-itens td { padding: 3px 4px; }
table.fin-itens select, table.fin-itens input { width: 100%; box-sizing: border-box; }
.fin-rels { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin-bottom: 8px; }
.fin-rel { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 8px; background: #fff; text-decoration: none; color: inherit; }
.fin-rel:hover { border-color: var(--primaria); box-shadow: 0 1px 4px rgba(31, 111, 209, .15); }
.fin-rel b { color: var(--primaria); font-size: 13px; }
.fin-rel span { font-size: 12px; color: var(--suave); }
@media print { .no-print { display: none !important; } }
tr.fin-hoje td { background: #eef5ff; }
table.fin-dre th, table.fin-dre td { white-space: nowrap; }
tr.fin-dre-titulo td { background: #eef1f5; font-weight: 700; }
tr.fin-dre-G td { font-weight: 600; }
tr.fin-dre-C td:first-child { padding-left: 22px; }
tr.fin-dre-S td { font-weight: 700; border-top: 1px solid #b9c2cc; }
tr.fin-dre-R td { font-weight: 700; background: #eef1f5; border-top: 2px solid #8a96a3; }
.fin-sug { margin: 0 0 4px; font-size: 12px; }
.fin-novo { margin: 4px 0; font-size: 12px; }
.fin-novo summary { cursor: pointer; color: var(--primaria); }
.fin-novo form { margin-top: 6px; padding: 8px; background: #f8fafc; border-radius: 6px; }
/* Balanço patrimonial (modelo do Relatório Executivo de Encerramento) */
.rel .bp-titulo { font-size: 16px; margin: 14px 0 2px; color: #111; }
.rel table.bp { margin: 10px 0 18px; }
.rel table.bp th { background: #fff; border-bottom: 1.5px solid #d5dbe2; font-size: 11.5px; padding: 6px; }
.rel table.bp th.num, .rel table.bp td.num { width: 17%; text-align: right; white-space: nowrap; }
.rel table.bp td { padding: 4px 6px; border-bottom: .5px solid #dde2e8; font-size: 11px; }
.rel table.bp .bp-grupo td { background: #eef1f5; font-weight: 700; text-transform: uppercase; }
.rel table.bp .bp-sub td { font-weight: 700; }
.rel table.bp .bp-conta td:first-child { padding-left: 16px; color: #333; }
.rel table.bp .bp-total td { background: #eef1f5; font-weight: 700; border-top: 1px solid #b9c2cc; }
.rel .bp-passivo { page-break-inside: avoid; }
@media print {
  header.topo, nav.lateral, .barra-rel, #erro-acao { display: none !important; }
  .corpo { display: block !important; }
  main { padding: 0 !important; max-width: none !important; }
  body { background: #fff; }
  .rel tr { page-break-inside: avoid; }
}

table.lista-lanc td.hist { min-width: 260px; }
table.lista-lanc td.conta { max-width: 220px; }

@media (max-width: 1000px) { .cols { grid-template-columns: 1fr; } }
@media (max-width: 1100px) { .principal-corpo { grid-template-columns: 1fr; } .cartao-noticias { margin: 10px; } .titulo-marca { display: none; } .busca-menu input { width: 150px; } }
@media (max-width: 860px) {
  .corpo { grid-template-columns: 1fr; }
  nav.lateral { display: flex; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--borda); }
  nav.lateral a { padding: 8px 12px; border-bottom: 0; }
  main { padding: 14px; }
  .grade-form .largo { grid-column: auto; }
  .barra-titulo { flex-wrap: wrap; }
  header.topo .direita { width: 100%; flex-wrap: wrap; }
  .faixa-abas { padding-left: 10px; overflow-x: auto; }
  .banner-arte { display: none; }
  .principal .atalhos-topo { flex-wrap: wrap; }
  .atalho-bloco { flex: 1 1 25%; width: auto; padding: 6px 0; }
  .atalhos-info { flex: 1 1 100%; }
  .faixa-aviso { flex-wrap: wrap; }
  .banner { padding: 22px 18px; min-height: 0; }
  .empresa-ativa select { width: 100%; max-width: none; }
  .busca-menu input { width: 120px; }
  .banner h2 { font-size: 24px; }
}

/* ------------------------------------------------------------ HUB (Central de Sistemas): página principal do PRISM4.
   Barra lateral escura, indicadores que filtram, busca, áreas e cartões dos módulos (telas/hub.js). */
.voltar-hub { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 14px; background: var(--marinho); color: #fff !important; font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.voltar-hub:hover { text-decoration: none; background: var(--azul); }
body.modo-hub { background: #f8fafc; }
body.modo-hub .corpo { grid-template-columns: 250px minmax(0, 1fr); min-height: 100vh; }
body.modo-hub.hub-recolhido .corpo { grid-template-columns: 74px minmax(0, 1fr); }
body.modo-hub main { padding: 0 0 48px !important; max-width: none; }
body.modo-hub nav.lateral { background: #09090b; border-right: 0; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; color: #d4d4d8; }
body.modo-hub nav.lateral a { border-bottom: 0; }
.hub-marca { display: flex; align-items: center; gap: 10px; padding: 20px 16px 18px 20px; color: #fff; font-size: 18px; letter-spacing: .02em; }
.hub-marca img { width: 32px; height: 32px; object-fit: contain; background: #fff; border-radius: 8px; padding: 3px; }
.hub-marca span { flex: 1; white-space: nowrap; }
.hub-recolher { border: 0; background: #1c1c20; color: #d4d4d8; width: 28px; height: 28px; border-radius: 7px; cursor: pointer; font-size: 15px; }
.hub-recolher:hover { background: #27272a; color: #fff; }
.hub-menu { flex: 1; padding: 6px 12px; }
.hub-secao { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: #71717a; padding: 16px 12px 6px; }
body.modo-hub nav.lateral a.hub-nav { display: flex; align-items: center; gap: 12px; padding: 11px 12px; margin: 2px 0; border-radius: 10px; color: #e4e4e7; font-size: 14.5px; }
body.modo-hub nav.lateral a.hub-nav:hover { background: #18181b; color: #fff; text-decoration: none; }
body.modo-hub nav.lateral a.hub-nav.ativo { background: #2563eb; color: #fff; font-weight: 600; box-shadow: 0 4px 14px rgba(37, 99, 235, .35); }
.hub-nav-ic { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.hub-nav-ic svg { background: #fff; border-radius: 5px; padding: 1px; }
.hub-nav.ativo .hub-nav-ic svg, .hub-nav-ic svg[viewBox="0 0 20 20"] { background: none; padding: 0; }
.hub-rodape { border-top: 1px solid #27272a; padding: 16px 16px 18px; display: flex; flex-direction: column; gap: 2px; }
.hub-rodape b { color: #fff; font-size: 14px; }
.hub-rodape span { font-size: 12px; color: #a1a1aa; margin-bottom: 10px; }
body.modo-hub nav.lateral a.hub-sair { align-self: flex-start; padding: 6px 14px; border: 1px solid #3f3f46; border-radius: 8px; color: #fff; font-size: 13px; font-weight: 600; }
body.modo-hub nav.lateral a.hub-sair:hover { background: #18181b; text-decoration: none; }
body.hub-recolhido .hub-marca span, body.hub-recolhido .hub-nav-rot, body.hub-recolhido .hub-secao, body.hub-recolhido .hub-rodape b, body.hub-recolhido .hub-rodape span { display: none; }
body.hub-recolhido .hub-marca { flex-direction: column; padding: 16px 8px; }
body.hub-recolhido .hub-recolher { transform: rotate(180deg); }
body.hub-recolhido .hub-menu { padding: 6px 10px; }
body.hub-recolhido nav.lateral a.hub-nav { justify-content: center; padding: 11px 0; }
body.hub-recolhido .hub-rodape { align-items: center; padding: 12px 6px; }
.hub-cab { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding: 16px 32px; background: #fff; border-bottom: 1px solid #e5e7eb; position: sticky; top: 0; z-index: 10; }
.hub-cab h1 { margin: 0; font-size: 24px; color: #111827; }
.hub-cab p { margin: 2px 0 0; color: #6b7280; font-size: 13.5px; }
.hub-cab-dir { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hub-empresa { display: flex; flex-direction: column; gap: 2px; font-size: 11px; color: #6b7280; }
.hub-empresa select { min-width: 240px; max-width: 34vw; padding: 5px 8px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; }
.hub-quem { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.hub-quem b { font-size: 14px; color: #111827; }
.hub-quem span { font-size: 12px; color: #6b7280; }
.hub-avatar { width: 38px; height: 38px; border-radius: 50%; background: #2563eb; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
.hub-sair-topo { padding: 7px 16px; border: 1px solid #f0b4b0; border-radius: 9px; background: #fff5f4; color: var(--erro) !important; font-weight: 700; font-size: 13.5px; }
.hub-sair-topo:hover { text-decoration: none; background: #fdecea; }
.hub-conteudo { padding: 24px 32px; }
.hub-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.hub-kpi { text-align: left; font: inherit; cursor: pointer; background: #fff; border: 1px solid #e5e7eb; border-left: 4px solid #9aa7bb; border-radius: 12px; padding: 13px 16px; box-shadow: 0 1px 2px rgba(17, 24, 39, .05); display: flex; flex-direction: column; gap: 3px; }
.hub-kpi span { font-size: 12.5px; color: #374151; }
.hub-kpi small { color: #9aa7bb; font-size: 10.5px; }
.hub-kpi b { font-size: 24px; color: #111827; line-height: 1.1; }
.hub-kpi b.menor { font-size: 17px; padding-top: 4px; }
.hub-kpi.azul { border-left-color: #2563eb; } .hub-kpi.verde { border-left-color: #1f9d55; } .hub-kpi.laranja { border-left-color: #e8772e; } .hub-kpi.amarelo { border-left-color: #e2b33c; }
.hub-kpi.cinza { cursor: default; }
button.hub-kpi:hover { box-shadow: 0 4px 14px rgba(17, 24, 39, .08); }
.hub-kpi.sel { background: #eff6ff; border-color: #93c5fd; box-shadow: 0 0 0 1px #93c5fd; }
.hub-busca { display: flex; align-items: center; gap: 8px; max-width: 440px; margin: 20px 0 6px; padding: 0 14px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; color: #9ca3af; }
.hub-busca:focus-within { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .15); }
.hub-busca input { flex: 1; border: 0; outline: 0; padding: 12px 0; font-size: 14.5px; background: transparent; }
.hub-titulo-secao { font-size: 14px; text-transform: uppercase; letter-spacing: .06em; color: #374151; margin: 22px 0 12px; }
.hub-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.hub-chip { font: inherit; font-size: 13.5px; cursor: pointer; padding: 7px 16px; border-radius: 20px; border: 1px solid #e5e7eb; background: #fff; color: #374151; }
.hub-chip:hover { border-color: #93c5fd; color: #2563eb; }
.hub-chip.sel { background: #2563eb; border-color: #2563eb; color: #fff; font-weight: 600; }
.hub-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
.hub-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; padding: 20px; display: flex; flex-direction: column; box-shadow: 0 1px 2px rgba(17, 24, 39, .05); transition: box-shadow .15s, transform .15s; }
.hub-card:hover { box-shadow: 0 8px 24px rgba(17, 24, 39, .10); transform: translateY(-2px); }
.hub-card-topo { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; }
.hub-card-ic { width: 52px; height: 52px; border-radius: 12px; background: #eff6ff; display: inline-flex; align-items: center; justify-content: center; }
.hub-card-ic.grande { width: 72px; height: 72px; flex: 0 0 auto; }
.hub-card-ic.grande svg { width: 44px; height: 44px; }
.hub-card-dir { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.hub-estrela { width: 32px; height: 28px; border: 1px solid #cfd7e3; border-radius: 6px; background: #f6f8fb; color: #b8c2d1; cursor: pointer; font-size: 15px; line-height: 1; }
.hub-estrela:hover { color: #e2b33c; border-color: #e2b33c; }
.hub-estrela.on { color: #e2a400; background: #fff7dc; border-color: #e2b33c; }
.hub-status { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 12px; white-space: nowrap; }
.hub-status::before { content: "● "; font-size: 9px; vertical-align: 1px; }
.hub-status.ativo { background: #e2f5ec; color: #157a55; }
.hub-status.construcao { background: #fff1e5; color: #b4531a; }
.hub-card h3 { margin: 0 0 6px; font-size: 17px; color: #111827; }
.hub-card p { margin: 0 0 14px; color: #6b7280; font-size: 13.5px; flex: 1; }
.hub-tag { align-self: flex-start; font-size: 12px; font-weight: 600; color: #2563eb; background: #eff6ff; padding: 3px 10px; border-radius: 12px; margin-bottom: 16px; }
.hub-acessar { display: block; text-align: center; padding: 11px; border-radius: 10px; background: #2563eb; color: #fff !important; font-weight: 700; font-size: 14.5px; }
.hub-acessar:hover { text-decoration: none; background: #1d4ed8; }
.hub-acessar.sec { background: #fff; color: #2563eb !important; border: 1px solid #bfdbfe; }
.hub-acessar.sec:hover { background: #eff6ff; }
.hub-vazio { color: #6b7280; padding: 30px 0; text-align: center; }
.hub-recentes { display: flex; flex-wrap: wrap; gap: 10px; }
.hub-recentes a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; color: #111827; font-size: 13.5px; }
.hub-recentes a:hover { text-decoration: none; border-color: #93c5fd; color: #2563eb; }
.hub-detalhe { background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; padding: 26px 28px; max-width: 860px; }
.hub-detalhe-topo { display: flex; gap: 18px; align-items: center; margin-bottom: 8px; }
.hub-detalhe h2 { margin: 6px 0 4px; font-size: 22px; color: #111827; }
.hub-detalhe h3 { font-size: 15px; margin: 20px 0 6px; color: #111827; }
.hub-detalhe ul { margin: 0 0 16px; padding-left: 20px; color: #374151; line-height: 1.8; }
@media (max-width: 1100px) { .hub-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  body.modo-hub .corpo, body.modo-hub.hub-recolhido .corpo { grid-template-columns: 1fr; }
  body.modo-hub nav.lateral { position: static; height: auto; }
  .hub-menu { display: flex; flex-wrap: wrap; gap: 4px; } .hub-secao, .hub-rodape { display: none; }
  .hub-cab, .hub-conteudo { padding-left: 16px; padding-right: 16px; }
  .hub-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================================ acabamento moderno (mesma linguagem do login e do site)
   Só muda a aparência: raios, campos, botões, painéis, tabelas e foco. Não vale para os relatórios (.rel), que seguem o modelo dos livros. */
h1 { font-weight: 800; letter-spacing: -.02em; color: var(--texto); }
h2 { font-weight: 700; letter-spacing: -.01em; color: var(--texto); }
.painel { border-radius: var(--raio); border-color: var(--borda); padding: 18px 20px; }
input, select, textarea { border-radius: var(--raio-p); border-color: var(--borda-forte); padding: 7px 10px; transition: border-color .15s, box-shadow .15s; }
input:hover, select:hover, textarea:hover { border-color: #9ca3af; }
input:focus, select:focus, textarea:focus { outline: 0; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(37, 99, 235, .16); }
input[readonly] { background: #f3f4f6; }
input[type=checkbox], input[type=radio] { accent-color: var(--azul); }
button, .botao { border-radius: var(--raio-p); font-weight: 600; padding: 7px 15px; transition: background .15s, border-color .15s, box-shadow .15s; }
button:not(.sec):not(.perigo):not(.olho):not(.fechar-aba):not(.faixa-aba):not(.hub-kpi):not(.hub-chip):not(.hub-estrela):not(.hub-recolher):not(.entrar), .botao:not(.sec) { box-shadow: 0 1px 2px rgba(37, 99, 235, .25); }
button:focus-visible, .botao:focus-visible, a:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(37, 99, 235, .35); }
button.sec, .botao.sec { border-color: var(--borda-forte); color: var(--texto); }
button.sec:hover, .botao.sec:hover { background: #f9fafb; border-color: #9ca3af; color: var(--texto); }
button.peq, .botao.peq { border-radius: 6px; }
table { border-radius: 0; }
th { background: #f9fafb; color: #4b5563; font-weight: 600; letter-spacing: .01em; border-bottom-color: var(--borda); }
td { border-bottom-color: #f0f1f3; }
tr:hover td { background: #f8fafc; }
.rolavel, .painel-tab { border-radius: var(--raio); }
.etq { border-radius: 999px; padding: 2px 9px; }
.aviso { border-radius: var(--raio-p); }
.aviso.ok { border-color: #a7f3d0; } .aviso.erro { border-color: #fecaca; } .aviso.info { border-color: #fde68a; }
.atalhos a, .indicador, .noticia, .opcao, .fin-rel, .fin-bloco, .pendencias, .reservado { border-radius: var(--raio); }
.atalhos a:hover, .indicador:hover, .opcao:hover, .fin-rel:hover { border-color: #93c5fd; box-shadow: 0 6px 18px -10px rgba(37, 99, 235, .45); background: #fff; }
.fin-cartoes { border-radius: var(--raio); }
.boas-vindas { border-radius: 16px; background: #09090b; background-image: radial-gradient(600px 300px at 90% -20%, rgba(37, 99, 235, .45), transparent 70%), radial-gradient(400px 240px at 0% 120%, rgba(16, 185, 129, .22), transparent 70%); }
.cab-empresa { border-left-color: var(--azul); }
.passo { background: #f8fafc; border-radius: var(--raio-p); }
code { background: #f3f4f6; border-radius: 4px; }

/* topo das telas internas (barra de título + faixa de botões) */
header.topo { box-shadow: 0 1px 0 var(--borda), 0 4px 16px -12px rgba(17, 24, 39, .25); }
.barra-titulo { background: #fff; border-bottom-color: var(--borda); }
.titulo-marca { color: var(--texto); }
.modulos-app { border-color: var(--borda); border-radius: 999px; }
.modulo-app + .modulo-app { border-left-color: var(--borda); }
.modulo-app.ativo { background: var(--azul); }
.busca-menu { border-color: var(--borda-forte); border-radius: var(--raio-p); overflow: hidden; }
.busca-menu:focus-within { border-color: var(--azul); box-shadow: 0 0 0 3px rgba(37, 99, 235, .16); }
.faixa-abas { background: #fff; border-bottom-color: var(--borda); }
.faixa-aba { border-radius: 8px 8px 0 0; }
.faixa-aba.ativa { box-shadow: inset 0 2px 0 var(--azul); }
.faixa { border-bottom-color: var(--borda); }
.faixa-grupo { border-right-color: #eef0f3; }
.faixa-botao { border-radius: var(--raio-p); }
.faixa-botao:hover { background: #eff6ff; border-color: #bfdbfe; }
.faixa-botao.ativo { background: #dbeafe; border-color: #93c5fd; }
.abas-trabalho { background: #f1f5f9; border-bottom-color: var(--borda); }
.aba-t { border-color: var(--borda); border-radius: 8px 8px 0 0; background: #f8fafc; }
.aba-t.ativa { background: #fff; box-shadow: inset 0 2px 0 var(--azul); }
.status-banco { border-radius: 999px; }
.avatar { background: var(--azul); }
nav.lateral { background: #fff; }
nav.lateral a { border-bottom-color: #f0f1f3; }
nav.lateral a:hover { background: #f8fafc; color: var(--azul); }
nav.lateral a.forte { color: var(--azul); }

/* tela Principal dos módulos */
.banner { background: #09090b; background-image: radial-gradient(700px 360px at 85% -10%, rgba(37, 99, 235, .45), transparent 70%), radial-gradient(500px 280px at 0% 120%, rgba(16, 185, 129, .20), transparent 70%); border-radius: 0; }
.banner h2 { letter-spacing: -.02em; }
.banner h2 span { color: #60a5fa; }
.banner-botao { border-radius: 12px; background: #2563eb !important; }
.banner-botao:hover { background: #1d4ed8 !important; text-decoration: none; }
.faixa-aviso { background: #ecfdf5; color: #065f46; border-bottom: 1px solid #a7f3d0; }
.faixa-aviso-botao { border-radius: 10px; }
.faixa-aviso-fechar { color: #065f46; }
.cartao-noticias { background: #fff; border-color: var(--borda); border-radius: var(--raio); }

/* HUB: cartões e indicadores com o mesmo raio do site */
.hub-kpi { border-radius: var(--raio); border-left-width: 1px; position: relative; overflow: hidden; }
.hub-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #d1d5db; }
.hub-kpi.azul::before { background: #2563eb; } .hub-kpi.verde::before { background: #10b981; } .hub-kpi.laranja::before { background: #f59e0b; } .hub-kpi.amarelo::before { background: #eab308; }
.hub-card, .hub-detalhe { border-radius: 16px; }
.hub-card:hover { border-color: #bfdbfe; }
.hub-acessar { border-radius: 12px; }
/* atalhos da tela Principal e seletor de módulos (ajustes da revisão visual) */
.modulos-app { border-radius: 10px; }
.principal .atalhos-topo { background: #18181b; }
.atalho-bloco { background: #2563eb; border-right-color: rgba(255, 255, 255, .18); }
.atalho-bloco:hover { background: #1d4ed8; }
.atalhos-info { color: #e4e4e7; }
/* HUB: grupos de módulos (Contabilidade, Controladoria, Integrações) */
.hub-chips { margin-top: 18px; }
.hub-grupo { margin: 8px 0 30px; }
.hub-grupo[hidden] { display: none; }
.hub-grupo-cab { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--borda); }
.hub-grupo-cab h2 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.02em; color: var(--texto); }
.hub-grupo-n { font-size: 12px; font-weight: 700; color: var(--azul); background: #eff6ff; border-radius: 999px; padding: 1px 9px; }
.hub-grupo-cab p { flex: 1 1 100%; margin: 0; color: var(--suave); font-size: 13.5px; }

/* Central do Cliente e Contato */
.cli-cartao { background: #fff; border: 1px solid var(--borda); border-radius: 16px; padding: 22px 24px; margin-bottom: 18px; max-width: 980px; box-shadow: var(--sombra); }
.cli-cartao h2 { margin: 0 0 14px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.cli-cartao h3 { margin: 22px 0 10px; font-size: 14.5px; }
.cli-cartao table { border: 1px solid var(--borda); border-radius: 12px; overflow: hidden; border-collapse: separate; border-spacing: 0; }
.cli-cartao td { vertical-align: middle; }
.cli-mod { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; }
.cli-nota { color: var(--suave); font-size: 13px; margin: 14px 0 0; max-width: 980px; }
.cli-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cli-acoes .hub-acessar { padding: 10px 18px; font-size: 14px; border: 1px solid transparent; cursor: pointer; font-family: inherit; }
.cli-acoes .hub-acessar.sec { border-color: #bfdbfe; }
.cli-acoes button.hub-acessar:not(.sec) { border-color: #2563eb; }
.cli-resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; max-width: 980px; }
.cli-num { background: #fff; border: 1px solid var(--borda); border-radius: 12px; padding: 14px 18px; display: flex; flex-direction: column; }
.cli-num b { font-size: 26px; font-weight: 800; line-height: 1.1; }
.cli-num span { font-size: 12.5px; color: var(--suave); }
.cli-dados { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin: 0; }
.cli-dados div { background: #f8fafc; border: 1px solid var(--borda); border-radius: 12px; padding: 10px 14px; }
.cli-dados dt { font-size: 11.5px; color: var(--suave); text-transform: uppercase; letter-spacing: .06em; }
.cli-dados dd { margin: 2px 0 0; font-weight: 700; }
.cli-opcoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.cli-opcao { border: 1px solid var(--borda); border-radius: 12px; padding: 14px 16px; }
.cli-opcao .cli-acoes { margin-top: 10px; }
.cli-modulos { display: grid; gap: 10px; }
.cli-modulo { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--borda); border-radius: 12px; }
.cli-modulo .hub-card-ic { width: 44px; height: 44px; flex: none; }
.cli-modulo-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cli-modulo-txt span { font-size: 12.5px; color: var(--suave); }
.cli-modulo-dir { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.cli-modulo-dir .hub-acessar { padding: 7px 14px; font-size: 13px; border: 1px solid #bfdbfe; }
.cli-campo { display: inline-flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--suave); margin-bottom: 16px; }
.cli-campo select { min-width: 160px; padding: 8px 10px; font-size: 14px; }
.cli-pag { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.cli-pag-op { border: 1px solid var(--borda); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 4px; }
.cli-pag-op > b { font-size: 16px; margin-top: 8px; }
.cli-pag-op > span:not(.cli-pag-ic) { font-size: 13px; color: var(--suave); }
.cli-pag-ic { width: 48px; height: 48px; border-radius: 12px; background: #eff6ff; display: inline-flex; align-items: center; justify-content: center; }
.cli-canais { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; max-width: 980px; }
.cli-canal { background: #fff; border: 1px solid var(--borda); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 4px; color: var(--texto) !important; box-shadow: var(--sombra); transition: border-color .15s, box-shadow .15s, transform .15s; }
.cli-canal:hover { text-decoration: none; border-color: #93c5fd; box-shadow: 0 10px 24px -14px rgba(37, 99, 235, .5); transform: translateY(-2px); }
.cli-canal b { font-size: 16px; margin-top: 8px; }
.cli-canal span:not(.cli-pag-ic) { font-size: 13px; color: var(--suave); }
.cli-canal em { font-style: normal; font-weight: 700; color: var(--azul); font-size: 13.5px; margin-top: 8px; }
@media (max-width: 860px) { .cli-resumo { grid-template-columns: 1fr; } .cli-modulo { flex-wrap: wrap; } .cli-modulo-dir { width: 100%; justify-content: flex-start; } }
/* ================================================================ botão flutuante do WhatsApp */
.wa-flutua { position: fixed; right: 22px; bottom: 22px; z-index: 80; display: flex; align-items: center; gap: 12px; text-decoration: none; }
.wa-icone { width: 60px; height: 60px; border-radius: 50%; background: #25d366; color: #fff; display: grid; place-items: center; position: relative; isolation: isolate;
  box-shadow: 0 12px 28px -8px rgba(37, 211, 102, .75); transition: transform .2s; }
.wa-icone::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #25d366; z-index: -1; animation: wa-pulso 2.4s ease-out infinite; }
@keyframes wa-pulso { 0% { transform: scale(1); opacity: .55; } 100% { transform: scale(1.75); opacity: 0; } }
.wa-flutua:hover .wa-icone { transform: scale(1.07); }
.wa-balao { background: #fff; color: #111827; font: 600 13.5px var(--fonte); padding: 10px 14px; border-radius: 12px; white-space: nowrap; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .35);
  opacity: 0; transform: translateX(8px); transition: opacity .25s, transform .25s; pointer-events: none; }
.wa-flutua:hover .wa-balao, .wa-flutua:focus-visible .wa-balao, .wa-flutua.mostra .wa-balao { opacity: 1; transform: none; }
.wa-flutua:focus-visible { outline: 0; } .wa-flutua:focus-visible .wa-icone { box-shadow: 0 0 0 4px rgba(37, 211, 102, .45); }
@media (max-width: 640px) { .wa-flutua { right: 16px; bottom: 16px; } .wa-icone { width: 54px; height: 54px; } .wa-balao { display: none; } }
@media (prefers-reduced-motion: reduce) { .wa-icone::before, .hero-logo { animation: none; } }

/* ================================================================ RELATÓRIOS GERENCIAIS (11/11/2026): painéis em tema escuro com efeito de vidro.
   Cores dos gráficos: paleta categórica validada para a superfície escura (#161b2a) em js/graficos.js; tinta de texto
   em tons neutros (nunca a cor da série); status sempre com ícone + rótulo. */
body.modo-ger { background: #070b16; }
body.modo-ger main { max-width: none; padding: 0; }
.ger {
  --g-fundo: #0b1020; --g-vidro: rgba(255, 255, 255, .055); --g-vidro-2: rgba(255, 255, 255, .085); --g-borda: rgba(255, 255, 255, .10);
  --g-texto: #eef1f7; --g-sec: #b4bccb; --g-mudo: #8a93a6; --g-grade: rgba(255, 255, 255, .07); --g-base: rgba(255, 255, 255, .22);
  --g-bom: #0ca30c; --g-alerta: #fab219; --g-critico: #d03b3b;
  position: relative; isolation: isolate; overflow: hidden; color: var(--g-texto); background: var(--g-fundo);
  padding: 22px 26px 30px; min-height: calc(100vh - 170px); font-variant-numeric: lining-nums;
}
.ger-luz { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ger-luz i { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .55; animation: ger-flutua 18s ease-in-out infinite alternate; }
.ger-luz i:nth-child(1) { width: 520px; height: 520px; left: -140px; top: -160px; background: #1d4ed8; }
.ger-luz i:nth-child(2) { width: 460px; height: 460px; right: -120px; top: 120px; background: #0f766e; animation-delay: -6s; }
.ger-luz i:nth-child(3) { width: 380px; height: 380px; left: 38%; bottom: -200px; background: #4338ca; opacity: .35; animation-delay: -12s; }
@keyframes ger-flutua { to { transform: translate(40px, 30px) scale(1.08); } }
.ger a { color: #93c5fd; }
.ger .suave { color: var(--g-mudo); }

/* cabeçalho, filtros (uma linha, acima dos gráficos) e navegação entre painéis */
.ger-cab { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; margin-bottom: 14px; }
.ger-sobre { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #7dd3fc; }
.ger-cab h1 { margin: 4px 0 4px; font-size: 28px; font-weight: 750; letter-spacing: -.02em; color: var(--g-texto); }
.ger-cab p { margin: 0; color: var(--g-sec); max-width: 760px; }
.ger-filtros { display: flex; gap: 10px; flex-wrap: wrap; }
.ger-filtros label { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--g-mudo); }
.ger-filtros select { background: var(--g-vidro-2); color: var(--g-texto); border: 1px solid var(--g-borda); border-radius: 10px; padding: 7px 10px; font: inherit; font-size: 14px; min-width: 120px; }
.ger-filtros select option { background: #111827; color: var(--g-texto); }
.ger-nav { display: flex; gap: 6px; overflow-x: auto; padding: 4px; margin: 0 0 18px; background: var(--g-vidro); border: 1px solid var(--g-borda); border-radius: 14px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); scrollbar-width: thin; }
.ger-nav a { flex: none; padding: 8px 14px; border-radius: 10px; color: var(--g-sec) !important; text-decoration: none !important; font-size: 13.5px; font-weight: 600; transition: background .2s, color .2s; }
.ger-nav a:hover { background: var(--g-vidro-2); color: var(--g-texto) !important; }
.ger-nav a.on { background: linear-gradient(135deg, rgba(57, 135, 229, .9), rgba(25, 158, 112, .85)); color: #fff !important; box-shadow: 0 6px 18px -8px rgba(57, 135, 229, .8); }

/* grade de 12 colunas e cartões de vidro */
.ger-grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.ger-grade > .c12 { grid-column: span 12; } .ger-grade > .c8 { grid-column: span 8; } .ger-grade > .c7 { grid-column: span 7; } .ger-grade > .c6 { grid-column: span 6; }
.ger-grade > .c5 { grid-column: span 5; } .ger-grade > .c4 { grid-column: span 4; }
@media (max-width: 1200px) { .ger-grade > .c4, .ger-grade > .c5, .ger-grade > .c7, .ger-grade > .c8 { grid-column: span 6; } }
@media (max-width: 820px) { .ger-grade > [class*="c"] { grid-column: span 12; } .ger { padding: 16px; } }
.ger-card { background: var(--g-vidro); border: 1px solid var(--g-borda); border-radius: 18px; padding: 16px 18px 14px; min-width: 0;
  backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 20px 40px -24px rgba(0, 0, 0, .7); animation: ger-entra .55s cubic-bezier(.2, .8, .2, 1) both; }
.ger-grade > :nth-child(2) { animation-delay: .05s; } .ger-grade > :nth-child(3) { animation-delay: .1s; } .ger-grade > :nth-child(4) { animation-delay: .15s; }
.ger-grade > :nth-child(5) { animation-delay: .2s; } .ger-grade > :nth-child(n+6) { animation-delay: .25s; }
@keyframes ger-entra { from { opacity: 0; transform: translateY(12px); } }
.ger-card > header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-bottom: 10px; }
.ger-card h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--g-texto); }
.ger-card > header span { font-size: 12px; color: var(--g-mudo); }
.ger-aviso { padding: 12px 16px; border-radius: 14px; background: rgba(250, 178, 25, .12); border: 1px solid rgba(250, 178, 25, .35); color: #fde68a; }
.ger-link { display: inline-block; margin-top: 10px; font-size: 13px; font-weight: 600; }
.ger-rodape { margin: 18px 0 0; font-size: 12px; color: var(--g-mudo); }

/* indicadores (número em destaque) */
.ger-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.ger-kpi { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 3px; padding: 15px 16px 14px; border-radius: 16px; background: var(--g-vidro);
  border: 1px solid var(--g-borda); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); animation: ger-entra .5s cubic-bezier(.2, .8, .2, 1) both; }
.ger-kpi::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 0 3px 3px 0; background: var(--c); }
.ger-kpi::after { content: ""; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%; background: var(--c); opacity: .12; filter: blur(30px); }
.ger-kpi-rot { font-size: 12.5px; color: var(--g-sec); font-weight: 600; }
.ger-kpi-v { font-size: 26px; font-weight: 750; letter-spacing: -.02em; line-height: 1.15; color: var(--g-texto); }
.ger-kpi-sub { font-size: 12px; color: var(--g-mudo); }
.ger-delta { font-size: 12px; font-weight: 700; } .ger-delta small { font-weight: 500; color: var(--g-mudo); }
.ger-delta.bom { color: #4ade80; } .ger-delta.ruim { color: #f87171; } .ger-delta b { font-size: 10px; margin-right: 3px; }
.ger-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--g-texto); white-space: nowrap; }
.ger-status b { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; font-size: 10px; color: #0b0b0b; }
.ger-status.bom b { background: var(--g-bom); color: #fff; } .ger-status.alerta b { background: var(--g-alerta); } .ger-status.critico b { background: var(--g-critico); color: #fff; }
.ger-kpi .ger-status { margin-top: 4px; }
.ger-kpi .g-spark { margin-top: 6px; }
.ger-mini { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--g-sec); margin-top: 6px; } .ger-mini b { color: var(--g-texto); }

/* tabelas dos painéis */
.ger-rola { overflow-x: auto; }
.ger-tab { width: 100%; border-collapse: collapse; font-size: 13px; color: var(--g-texto); background: none; }
.ger-tab th { text-align: left; font-weight: 600; font-size: 12px; color: var(--g-mudo); padding: 7px 8px; border-bottom: 1px solid var(--g-borda); background: none; white-space: nowrap; position: static; }
.ger-tab td { padding: 7px 8px; border-bottom: 1px solid var(--g-grade); }
.ger-tab .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ger-tab tr.tot td { font-weight: 700; background: rgba(255, 255, 255, .03); }
.ger-tab tr.final td { background: rgba(57, 135, 229, .14); }
.ger-tab td.neg { color: #fca5a5; }
.ger-tab td.prev, .ger-tab th.prev { color: var(--g-sec); font-style: italic; }
.ger-tab td.rec { padding-left: 26px; color: var(--g-sec); } .ger-tab td.rec2 { padding-left: 44px; color: var(--g-mudo); font-size: 12.5px; }
.ger-tab tbody tr:hover td { background: rgba(255, 255, 255, .035); }
.ger-tab tfoot td { font-weight: 700; border-top: 1px solid var(--g-borda); }
.ger-lista a { color: var(--g-texto); } .ger-lista a:hover { color: #93c5fd; }
.ger-abre { background: none; border: 0; color: var(--g-sec); cursor: pointer; padding: 0 6px 0 0; font-size: 12px; width: 18px; }
.ger-orc input.ger-in { width: 76px; text-align: right; background: rgba(255, 255, 255, .06); color: var(--g-texto); border: 1px solid transparent; border-radius: 6px; padding: 4px 6px; font: inherit; font-size: 12.5px; }
.ger-orc input.ger-in:focus { outline: 2px solid #3987e5; background: rgba(57, 135, 229, .12); }
.ger-orc td { padding: 3px 4px; } .ger-orc-tit td { font-weight: 800; letter-spacing: .06em; color: #7dd3fc; padding-top: 14px; } .ger-orc-grupo td { font-weight: 600; color: var(--g-sec); padding-top: 8px; }
.ger-orc-acoes { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 12px; color: var(--g-sec); font-size: 13px; }
.ger-orc-acoes input { width: 60px; background: rgba(255, 255, 255, .06); color: var(--g-texto); border: 1px solid var(--g-borda); border-radius: 6px; padding: 4px 6px; }
.ger-orc-acoes .flex { flex: 1; }
.ger button.sec { background: var(--g-vidro-2); color: var(--g-texto); border-color: var(--g-borda); }
.ger-explica { margin: 0; padding-left: 18px; color: var(--g-sec); font-size: 13px; line-height: 1.6; } .ger-explica b { color: var(--g-texto); }

/* ---------------------------------------------------------------- gráficos (js/graficos.js) */
.g-svg { width: 100%; height: auto; display: block; overflow: visible; }
.g-svg text { font-family: inherit; }
.g-eixo { font-size: 11px; fill: var(--g-mudo); }
.g-grade { stroke: var(--g-grade); stroke-width: 1; }
.g-base { stroke: var(--g-base); stroke-width: 1; }
.g-bar { transform-box: fill-box; transform-origin: 50% 100%; animation: g-cresce .75s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 35ms); transition: opacity .2s; }
.g-bar.g-neg { transform-origin: 50% 0; }
.g-bar.g-claro { opacity: .45; }
@keyframes g-cresce { from { transform: scaleY(0); } }
.g-linha { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: g-traca 1.2s .25s ease-out forwards; }
.g-linha-trac { fill: none; stroke-width: 2; stroke-dasharray: 5 5; opacity: .9; animation: g-surge .6s 1.1s both; }
.g-area { opacity: .14; animation: g-surge .8s .4s both; }
@keyframes g-traca { to { stroke-dashoffset: 0; } }
@keyframes g-surge { from { opacity: 0; } }
.g-rot { font-size: 11px; font-weight: 700; fill: var(--g-texto); }
.g-faixa { cursor: crosshair; outline: none; }
.g-guia { stroke: rgba(255, 255, 255, .28); stroke-dasharray: 3 3; opacity: 0; transition: opacity .15s; }
.g-ponto { stroke: #161b2a; stroke-width: 2; opacity: 0; transition: opacity .15s; }
.g-faixa:hover .g-guia, .g-faixa:focus .g-guia, .g-faixa:hover .g-ponto, .g-faixa:focus .g-ponto { opacity: 1; }
.g-faixa:hover rect, .g-faixa:focus rect { fill: rgba(255, 255, 255, .035); }
.g-legenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--g-sec); margin: 0 0 6px; }
.g-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.g-sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex: none; }
.g-sw-l { display: inline-block; width: 16px; height: 0; border-top: 2px solid; flex: none; } .g-sw-l.trac { border-top-style: dashed; }
.g-dados { margin-top: 6px; font-size: 12px; color: var(--g-sec); }
.g-dados summary { cursor: pointer; color: var(--g-mudo); width: fit-content; } .g-dados summary:hover { color: var(--g-texto); }
.g-dados-rola { overflow-x: auto; margin-top: 6px; }
.g-dados table { border-collapse: collapse; width: 100%; background: none; } .g-dados th, .g-dados td { padding: 4px 8px; border-bottom: 1px solid var(--g-grade); background: none; color: var(--g-sec); }
.g-dados .num { text-align: right; font-variant-numeric: tabular-nums; }
.g-vazio { color: var(--g-mudo); font-size: 13px; padding: 18px 0; text-align: center; }
.g-nota { color: var(--g-mudo); font-size: 12px; margin: 8px 0 0; }
.g-hbar { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.g-hbar li { cursor: default; outline: none; border-radius: 8px; padding: 2px 4px; margin: 0 -4px; transition: background .15s; }
.g-hbar li:hover, .g-hbar li:focus { background: rgba(255, 255, 255, .04); }
.g-hbar-rot { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; margin-bottom: 4px; }
.g-hbar-rot span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--g-sec); }
.g-hbar-rot b { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--g-texto); } .g-hbar-rot small { color: var(--g-mudo); font-weight: 500; }
.g-hbar-trilho { height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.g-hbar-trilho i { display: block; height: 100%; width: var(--w); border-radius: 4px; transform-origin: left; animation: g-cresceX .8s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 60ms + .15s); }
@keyframes g-cresceX { from { transform: scaleX(0); } }
.g-funil .g-etapa { cursor: default; outline: none; animation: ger-entra .6s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 120ms + .1s); }
.g-funil .g-etapa path { transition: filter .2s; } .g-funil .g-etapa:hover path, .g-funil .g-etapa:focus path { filter: brightness(1.15) drop-shadow(0 0 10px rgba(57, 135, 229, .55)); }
.g-funil-n { font-size: 20px; font-weight: 800; fill: #fff; } .g-funil-v { font-size: 12px; fill: rgba(255, 255, 255, .85); }
.g-funil-n.escuro { fill: #0b0b0b; } .g-funil-v.escuro { fill: rgba(11, 11, 11, .8); }
.g-funil-nome { font-size: 14px; font-weight: 700; fill: var(--g-texto); } .g-funil-conv { font-size: 12px; fill: var(--g-mudo); }
.g-medidor { outline: none; max-width: 300px; margin: 0 auto; }
.g-med-trilho { fill: none; stroke: rgba(255, 255, 255, .08); stroke-width: 14; stroke-linecap: round; }
.g-med-valor { fill: none; stroke-width: 14; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: g-traca 1.3s .2s cubic-bezier(.2, .8, .2, 1) forwards; filter: drop-shadow(0 0 6px rgba(255, 255, 255, .15)); }
.g-med-pct { font-size: 26px; font-weight: 800; fill: var(--g-texto); }
.g-med-rot { display: flex; justify-content: space-between; font-size: 12px; color: var(--g-mudo); } .g-med-rot b { color: var(--g-texto); }
.g-spark { width: 100%; height: 30px; display: block; } .g-spark polyline { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: g-traca 1.2s .3s ease-out forwards; }
.g-tip { position: fixed; z-index: 1000; pointer-events: none; opacity: 0; transform: translateY(4px); transition: opacity .12s, transform .12s; min-width: 170px; max-width: 300px;
  background: rgba(17, 24, 39, .92); color: #eef1f7; border: 1px solid rgba(255, 255, 255, .14); border-radius: 12px; padding: 9px 12px; font-size: 12.5px;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .7); display: grid; gap: 4px; }
.g-tip.on { opacity: 1; transform: none; }
.g-tip > b { font-size: 12.5px; margin-bottom: 2px; }
.g-tip span { display: flex; align-items: center; gap: 7px; color: #b4bccb; } .g-tip span b { margin-left: auto; padding-left: 12px; color: #eef1f7; font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) {
  .ger-luz i, .ger-card, .ger-kpi, .g-bar, .g-area, .g-linha-trac, .g-hbar-trilho i, .g-funil .g-etapa { animation: none !important; }
  .g-linha, .g-med-valor, .g-spark polyline { animation: none !important; stroke-dashoffset: 0; }
}
@media print { .ger { background: #fff; color: #111; } .ger-luz, .ger-nav, .ger-filtros { display: none; } }
/* barra de módulos com o 5º módulo (Gerencial): nomes numa linha só e campos mais estreitos em telas médias */
.modulo-app { white-space: nowrap; }
.titulo-app { min-width: 0; }
@media (max-width: 1560px) { .titulo-marca { display: none; } .empresa-ativa select { width: 210px; } .busca-menu input { width: 170px; } .modulo-app { padding: 3px 9px; } }
.ger-tab.ger-orc { width: max-content; min-width: 100%; } .ger-orc td:first-child { min-width: 190px; max-width: 220px; position: sticky; left: 0; z-index: 1; background: #141a2b; } .ger-orc .ger-tot-lin { min-width: 96px; font-weight: 700; }

/* ================================================================ Financeiro: relatórios em menu no canto esquerdo (11/11/2026) */
body.menu-rel .corpo { grid-template-columns: 264px minmax(0, 1fr); }
body.menu-rel nav.lateral { background: #fff; border-right: 1px solid var(--borda); position: sticky; top: 0; align-self: start; max-height: 100vh; overflow-y: auto; }
.rel-menu { padding: 12px 10px 24px; display: flex; flex-direction: column; gap: 4px; }
nav.lateral .rel-menu a { border-bottom: 0; }
nav.lateral a.rel-menu-tit { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; font-size: 15px; font-weight: 700; color: var(--marinho, #0f2742); }
nav.lateral a.rel-menu-tit.ativo, nav.lateral a.rel-menu-tit:hover { background: #eff6ff; color: var(--azul, #2563eb); }
.rel-menu-busca { display: block; margin: 4px 0 8px; }
.rel-menu-busca input { width: 100%; box-sizing: border-box; padding: 7px 10px; border: 1px solid var(--borda); border-radius: 8px; font-size: 13px; }
.rel-grupo { border-top: 1px solid #f0f1f3; padding: 4px 0; }
.rel-grupo > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; border-radius: 8px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--suave); user-select: none; }
.rel-grupo > summary::-webkit-details-marker { display: none; }
.rel-grupo > summary::after { content: "▾"; font-size: 11px; margin-left: 6px; transition: transform .15s; }
.rel-grupo:not([open]) > summary::after { transform: rotate(-90deg); }
.rel-grupo > summary small { margin-left: auto; font-weight: 600; letter-spacing: 0; background: #f1f5f9; border-radius: 999px; padding: 1px 7px; }
.rel-grupo > summary:hover { background: #f8fafc; color: var(--texto, #111827); }
nav.lateral a.rel-item { display: block; padding: 7px 10px 7px 14px; margin: 1px 0; border-radius: 8px; font-size: 13px; line-height: 1.3; color: #374151; border-left: 3px solid transparent; }
nav.lateral a.rel-item:hover { background: #f8fafc; color: var(--azul, #2563eb); text-decoration: none; }
nav.lateral a.rel-item.ativo { background: #eff6ff; color: var(--azul, #2563eb); font-weight: 600; border-left-color: var(--azul, #2563eb); }
.rel-menu-vazio { font-size: 12.5px; color: var(--suave); padding: 6px 10px; margin: 0; }
body.menu-rel .rel .barra-rel { top: 0; }
@media (max-width: 900px) { body.menu-rel .corpo { grid-template-columns: 1fr; } body.menu-rel nav.lateral { position: static; max-height: none; display: block; border-right: 0; border-bottom: 1px solid var(--borda); } }
@media print { body.menu-rel .corpo { display: block !important; } }
body.menu-rel:not(.sem-lateral):not(.tela-login) main { padding: 18px 26px 48px; max-width: 1500px; }   /* vence a regra das telas com coluna lateral */
body.menu-rel nav.lateral { scrollbar-width: thin; }

/* ================================================================ Tela do lote no formato do Alterdata (11/11/2026) */
.lote-tela { display: flex; flex-direction: column; gap: 8px; }
.lote-topo { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 18px; padding: 6px 10px; background: #f8fafc; border: 1px solid var(--borda); border-radius: 10px; }
.lote-id { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lote-emp { font-size: 13px; } .lote-emp span { color: var(--suave); } .lote-emp b { text-transform: uppercase; }
.lote-campos { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; }
.lote-campos label { display: flex; align-items: center; gap: 4px; }
.lote-campos input { padding: 4px 6px; font-size: 13px; border: 1px solid #b6c2d1; border-radius: 4px; background: #fff; }
.lote-campos input[readonly] { background: #fff; color: var(--texto, #111827); }
.lote-campos .lote-num { text-align: right; width: 64px; font-weight: 600; }
.lote-desc { margin: 0; } .lote-desc input { width: 300px; }
.lote-barra { display: flex; flex-wrap: wrap; gap: 0; margin-left: auto; }
.lote-bts { display: flex; padding: 0 6px; border-left: 1px solid var(--borda); } .lote-bts:first-child { border-left: 0; }
.lote-bt { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 7px; min-width: 52px; background: none; border: 1px solid transparent; border-radius: 6px;
  color: #374151; font: inherit; font-size: 12.5px; cursor: pointer; white-space: nowrap; }
.lote-bt:hover:not(:disabled) { background: #eff6ff; border-color: #bfdbfe; color: var(--azul, #2563eb); }
.lote-bt:disabled { opacity: .38; cursor: default; }
.lote-bt svg { display: block; }
.lote-grade-box, .lote-totais, .lote-form { border: 1px solid var(--borda); border-radius: 8px; margin: 0; padding: 4px 8px 6px; background: #fff; min-width: 0; }
.lote-grade-box legend, .lote-totais legend, .lote-form legend { font-weight: 700; font-size: 13px; padding: 0 4px; text-decoration: underline; text-underline-offset: 3px; }
.lote-busca { display: flex; align-items: center; gap: 8px; padding: 4px 0 6px; } .lote-busca input { flex: 1; max-width: 520px; padding: 5px 8px; }
.lote-grade { max-height: max(300px, calc(100vh - 520px)); overflow: auto; border: 1px solid #d5dde8; outline: none; }
.lote-grade:focus-visible { box-shadow: 0 0 0 2px #93c5fd; }
.lote-grade table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 0; }
.lote-grade th { position: sticky; top: 0; z-index: 1; background: #eef2f7; color: #374151; font-weight: 600; text-align: center; padding: 6px 8px; border-bottom: 1px solid #c7d2df; border-right: 1px solid #dde4ee; cursor: pointer; user-select: none; white-space: nowrap; }
.lote-grade th[aria-sort="ascending"]::after { content: " ▲"; font-size: 9px; } .lote-grade th[aria-sort="descending"]::after { content: " ▼"; font-size: 9px; }
.lote-grade td { padding: 4px 8px; border-bottom: 1px solid #edf1f6; border-right: 1px solid #f3f5f9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; cursor: default; }
.lote-grade td:first-child { text-align: center; }
.lote-grade td.c { text-align: center; }
.lote-grade td.deb { color: #1d5fd0; } .lote-grade td.cred { color: #d1242f; }
.lote-grade tbody tr:nth-child(even) { background: #f7f9fc; }
.lote-grade tbody tr:hover { background: #eef5ff; }
.lote-grade tbody tr.sel, .lote-grade tbody tr.sel:hover { background: #cfe2ff; }
.lote-grade tbody tr.sel td { box-shadow: inset 0 1px 0 #7aa7e8, inset 0 -1px 0 #7aa7e8; }
.lote-grade td .etq { font-size: 10px; padding: 0 4px; margin-left: 4px; }
.lote-rodape { display: flex; justify-content: space-between; padding: 5px 4px 0; font-size: 13px; }
.lote-hist { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px; padding: 6px 10px; border: 1px solid var(--borda); border-radius: 8px; background: #fff; }
.lote-hist input, .lote-hist textarea { width: 100%; box-sizing: border-box; background: #fff; font: inherit; font-size: 13px; resize: vertical; }
.lote-tot-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 18px; padding: 4px 2px; }
.lote-tot-grade > div { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.lote-tot-grade label { font-size: 12.5px; font-weight: 600; color: #374151; }
.lote-tot-grade output { display: block; width: 100%; padding: 4px 8px; border: 1px solid #c7d2df; border-radius: 4px; background: #fff; font-variant-numeric: tabular-nums; font-size: 13px; min-height: 18px; }
.lote-tot-grade output small { color: var(--suave); }
.lote-tot-nota { font-size: 12px; margin: 6px 2px 0; }
.lote-form { background: #fbfdff; }
@media (max-width: 1100px) { .lote-tot-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lote-barra { margin-left: 0; } }
@media print {
  .lote-barra, .lote-hist, .lote-form, .lote-busca, .lote-tot-nota { display: none !important; }
  .lote-grade { max-height: none !important; overflow: visible !important; border: 0; }
  .lote-grade th { position: static; }
  .lote-grade tbody tr.sel { background: none; } .lote-grade tbody tr.sel td { box-shadow: none; }
}
.lote-form table.partidas input, .lote-form table.partidas select { width: 100%; box-sizing: border-box; }
.lote-campos select#lote-troca { width: 96px; padding: 4px 4px; font-size: 13px; font-weight: 600; border: 1px solid #b6c2d1; border-radius: 4px; background: #fff; }

/* ------------------------------------------------------------ Lançamentos: datas, seleção por caixa e ações em lote */
th.ck, td.ck { width: 30px; text-align: center; padding-left: 6px !important; padding-right: 6px !important; }
th.ck input, td.ck input { width: 16px; height: 16px; margin: 0; cursor: pointer; accent-color: var(--azul); vertical-align: middle; }
tr.marcada td, .lote-grade tbody tr.marcada td { background: #e8f1fc; }
.barra-massa { position: relative; z-index: 3; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0; padding: 8px 12px; border-radius: 10px;
  background: #0f2742; color: #fff; box-shadow: 0 8px 20px -10px rgba(15,39,66,.6); animation: massa-entrar .2s ease; }
.barra-massa b { margin-right: 6px; font-size: 13.5px; }
.barra-massa .sec { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.3); }
.barra-massa button:disabled { opacity: .45; }
@keyframes massa-entrar { from { opacity: 0; transform: translateY(-4px); } }
.lote-filtro-datas { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin: 4px 0 8px; }
.lote-filtro-datas .campo label { font-size: 12px; }
input[type=date] { padding: 5px 8px; font: inherit; border: 1px solid #b6c2d1; border-radius: 5px; background: #fff; min-width: 140px; }
input[type=date]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .75; }
input[type=date]::-webkit-calendar-picker-indicator:hover { opacity: 1; }
.lote-massa { margin-top: 10px; border: 2px solid var(--azul); border-radius: 10px; background: #f7faff; }
.lote-massa legend { font-weight: 700; color: var(--marinho); padding: 0 6px; }
.massa-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.massa-grade .largo { grid-column: span 2; }
.massa-grade input, .massa-grade select { width: 100%; box-sizing: border-box; }
@media print { .barra-massa, .lote-massa, .lote-filtro-datas, th.ck, td.ck { display: none !important; } }