:root{--azul:#1d4ed8;--azul-esc:#1e3a8a;--fundo:#f4f6fa;--borda:#dfe3ea;--texto:#1f2937;--suave:#6b7280;--verde:#15803d;--amarelo:#b45309;--vermelho:#b91c1c}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--fundo);color:var(--texto);font-size:15px}
a{color:var(--azul)}
.topo{background:var(--azul-esc);color:#fff;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:10px 20px;gap:10px}
.marca{font-weight:700;font-size:18px;display:flex;align-items:center;gap:8px}.marca .logo{height:36px;max-width:140px;object-fit:contain;background:#fff;border-radius:6px;padding:2px}
.entrada .logo-entrada{display:block;margin:0 auto 8px;max-height:80px;max-width:220px;object-fit:contain}.marca small{font-weight:400;opacity:.75;font-size:13px}
.topo nav{display:flex;flex-wrap:wrap;gap:4px}
.topo nav a{color:#dbe4ff;text-decoration:none;padding:6px 10px;border-radius:6px}
.topo nav a:hover,.topo nav a.ativo{background:rgba(255,255,255,.15);color:#fff}
.topo nav a.sair{opacity:.8}
main{max-width:1150px;margin:24px auto;padding:0 16px}
footer{text-align:center;color:var(--suave);font-size:12px;padding:24px}
h1{font-size:22px;margin:0 0 16px}h2{font-size:17px;margin:24px 0 10px}
.cartao{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:18px;margin-bottom:16px}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:16px}
.numero{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:14px}
.numero span{display:block;color:var(--suave);font-size:13px}.numero b{font-size:22px}
.numero.alerta b{color:var(--vermelho)}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--borda);vertical-align:top}
th{font-size:12px;text-transform:uppercase;color:var(--suave);background:#fafbfc}
.tabela{overflow-x:auto;border:1px solid var(--borda);border-radius:10px}
.tabela table{border:0}
td.num,th.num{text-align:right;white-space:nowrap}
form.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
form.campos .largo{grid-column:1/-1}
label{display:block;font-size:13px;color:var(--suave);margin-bottom:4px}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid var(--borda);border-radius:6px;font:inherit;background:#fff}
textarea{min-height:70px}
button,.botao{display:inline-block;background:var(--azul);color:#fff;border:0;border-radius:6px;padding:9px 16px;font:inherit;cursor:pointer;text-decoration:none}
.botao.claro,button.claro{background:#e8edfb;color:var(--azul-esc)}
.botao.perigo,button.perigo{background:var(--vermelho)}
button.pequeno,.botao.pequeno{padding:4px 10px;font-size:13px}
.acoes{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-bottom:12px}
.acoes form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.acoes input,.acoes select{width:auto}
.aviso{padding:10px 14px;border-radius:8px;margin-bottom:14px}
.aviso-ok{background:#dcfce7;color:#14532d}.aviso-erro{background:#fee2e2;color:#7f1d1d}.aviso-info{background:#e0e7ff;color:#1e3a8a}
.selo{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.selo-em_dia,.selo-pago,.selo-ativo{background:#dcfce7;color:var(--verde)}
.selo-teste{background:#e0e7ff;color:#3730a3}
.selo-vencido,.selo-pendente{background:#fef3c7;color:var(--amarelo)}
.selo-teste_vencido,.selo-bloqueado,.selo-atrasado,.selo-suspenso{background:#fee2e2;color:var(--vermelho)}
.selo-cancelado{background:#e5e7eb;color:#374151}
.entrada{max-width:400px;margin:60px auto}
.entrada h1{text-align:center}
.entrada form{display:grid;gap:12px}
.suave{color:var(--suave);font-size:13px}
.programas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.programa{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:8px}
.programa h3{margin:0;font-size:17px}
.filtro-check{display:flex;align-items:center;gap:6px;margin:0 0 8px;white-space:nowrap}
.filtro-check input{width:auto}
.botao-copiar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:#fff;color:var(--azul);border:1px solid var(--borda)}
.botao-copiar:hover{background:var(--azul);color:#fff}
.botao-copiar .icone-copiado{display:none}
.botao-copiar.copiado,.botao-copiar.copiado:hover{background:var(--verde);border-color:var(--verde);color:#fff}
.botao-copiar.copiado .icone-copiar{display:none}
.botao-copiar.copiado .icone-copiado{display:block}

/* Barra de ações fixa no rodapé da tela enquanto o formulário está visível (bom no celular) */
.barra-acoes{position:sticky;bottom:0;z-index:20;display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#fff;border-top:1px solid var(--borda);padding:10px 0;margin-top:4px;box-shadow:0 -6px 12px -10px rgba(0,0,0,.25)}
.barra-acoes button,.barra-acoes .botao{min-height:42px}
@media (max-width:600px){.barra-acoes>*{flex:1 1 30%;text-align:center}}
tr.linha-link{cursor:pointer}tr.linha-link:hover td{background:#f0f4ff}
/* ===== Telas de infraestrutura (Servidores / Bancos / FTP) ===== */
.abas-infra{display:flex;gap:4px;flex-wrap:wrap;border-bottom:2px solid var(--borda);margin:4px 0 14px}
.abas-infra a{padding:10px 14px;border-radius:8px 8px 0 0;text-decoration:none;color:var(--suave);font-weight:600;margin-bottom:-2px;border-bottom:2px solid transparent}
.abas-infra a:hover{color:var(--azul);background:#eef2ff}
.abas-infra a.ativa{color:var(--azul);border-bottom-color:var(--azul);background:#fff}
.abas-infra .qt{display:inline-block;min-width:20px;padding:1px 7px;border-radius:999px;background:#e8edfb;color:var(--azul-esc);font-size:12px;text-align:center}
.titulo-infra{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.titulo-infra h1{margin:0}
.resumo-infra{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px}
.resumo-infra div{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:12px 14px}
.resumo-infra strong{display:block;font-size:24px;color:var(--azul-esc)}
.resumo-infra span{color:var(--suave);font-size:13px}
.tabela.infra table{width:100%}
.tabela.infra th{background:#f8fafc;color:var(--suave);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.tabela.infra tr:hover td{background:#f6f8ff}
.tabela.infra td.acoes-linha{white-space:nowrap;text-align:right}
.tabela.infra td.acoes-linha .botao,.tabela.infra td.acoes-linha button{margin-left:4px}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px}
.sub{display:block;color:var(--suave);font-size:12px;margin-top:2px}
.etiqueta{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;background:#eef2ff;color:var(--azul-esc);margin:2px 2px 0 0}
.etiqueta.verde{background:#dcfce7;color:#166534}.etiqueta.cinza{background:#f1f5f9;color:#475569}.etiqueta.laranja{background:#ffedd5;color:#9a3412}
.aviso-azul{background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:12px 14px;margin-bottom:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.vazio-infra{text-align:center;padding:36px 16px;background:#fff;border:1px dashed var(--borda);border-radius:12px;margin:10px 0}
.vazio-infra .ic{font-size:44px}
.vazio-infra .acoes{justify-content:center}
@media (max-width:700px){
  .tabela.infra table,.tabela.infra tbody,.tabela.infra tr,.tabela.infra td{display:block;width:100%}
  .tabela.infra tr:first-child{display:none}
  .tabela.infra tr{background:#fff;border:1px solid var(--borda);border-radius:10px;margin-bottom:10px;padding:8px}
  .tabela.infra td{border:0;padding:4px 6px}
  .tabela.infra td[data-rot]::before{content:attr(data-rot) ": ";color:var(--suave);font-size:12px}
  .tabela.infra td.acoes-linha{text-align:left}
}
/* Perfis: esconde na tela o que o perfil não pode (o servidor também bloqueia) */
body.perfil-consulta .barra-acoes button[type=submit], body.perfil-consulta form:has(input[name=acao][value=testar]),
body.perfil-consulta form:has(input[name=acao][value=excluir]), body.perfil-consulta form:has(input[name=acao][value=descobrir]),
body.perfil-consulta form:has(input[name=acao][value=importar_hpanel]), body.perfil-consulta .titulo-infra .botao,
body.perfil-tecnico form:has(input[name=acao][value=excluir]), body.perfil-tecnico form:has(input[name=acao][value=endereco_excluir]) {display:none !important}
.senha-oculta{display:inline-block;padding:9px 12px;background:#f1f5f9;border-radius:6px;color:var(--suave)}
/* Cabeçalho das telas de edição */
.trilha{font-size:13px;color:var(--suave);margin:2px 0 8px}
.trilha a{color:var(--suave);text-decoration:none}.trilha a:hover{color:var(--azul);text-decoration:underline}
.trilha .sep{margin:0 4px;opacity:.6}
.cab-item{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.cab-item h1{margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cab-item .ic{font-size:26px}
.cab-item .voltar{text-decoration:none;border-radius:8px;padding:7px 14px}
.botao-verde,button.botao-verde{background:#16a34a;color:#fff;font-weight:600;padding:10px 18px;font-size:15px;border-radius:8px}
.botao-verde:hover{background:#15803d}
.aviso-laranja{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:10px;padding:10px 14px;margin-bottom:12px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ajuda-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border-radius:50%;background:#e8edfb;color:var(--azul-esc);font-size:13px;font-weight:700;vertical-align:middle;margin-left:4px}
.ajuda-btn:hover{background:var(--azul);color:#fff}

/* ===== Janela de ajuda "?" (padrão único) ===== */
.aj-fundo{position:fixed;inset:0;z-index:80;background:rgba(15,23,42,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.aj-fundo[hidden]{display:none}
.aj-caixa{background:#fff;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25);width:100%;max-width:600px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.aj-cab{display:flex;gap:14px;align-items:center;padding:18px 22px;border-bottom:1px solid var(--borda);background:#f8fafc}
.aj-ic{font-size:38px;line-height:1}
.aj-cab h2{margin:0;font-size:20px}
.aj-cab p{margin:3px 0 0;color:var(--suave);font-size:14px}
.aj-corpo{padding:6px 22px 14px;overflow:auto;font-size:15px;line-height:1.6;font-weight:400;color:var(--texto)}
.aj-secao h3{margin:14px 0 4px;font-size:14px;color:var(--azul);text-transform:none;font-weight:700}
.aj-secao ul{margin:0;padding-left:20px}
.aj-secao li{margin:3px 0}
.aj-secao b{font-weight:600}
.aj-legenda{margin-top:14px;background:#f1f5f9;border-radius:10px;padding:10px 12px;font-size:14px}
.aj-legenda strong{display:block;margin-bottom:6px;color:var(--suave);font-weight:600}
.aj-dica{margin-top:12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:10px 12px;font-size:14px}
.aj-rodape{display:flex;justify-content:flex-end;padding:12px 22px;border-top:1px solid var(--borda)}
.aj-rodape button{min-width:110px}
@media (max-width:600px){.aj-fundo{padding:0}.aj-caixa{max-width:none;height:100%;max-height:none;border-radius:0}}
/* ===== Menu "⋮ Mais ações" ===== */
.menu-btn{background:#eef2ff;color:var(--azul-esc);font-size:20px;line-height:1;padding:4px 12px;border-radius:8px;font-weight:700}
.menu-btn:hover,.menu-btn[aria-expanded=true]{background:var(--azul);color:#fff}
.menu-flutuante{position:fixed;z-index:90;background:#fff;border:1px solid var(--borda);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.18);padding:6px;min-width:220px}
.menu-flutuante a,.menu-flutuante button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:7px;background:none;color:var(--texto);text-decoration:none;font:inherit;font-size:14px;text-align:left;cursor:pointer;border:0}
.menu-flutuante a:hover,.menu-flutuante button:hover{background:#f1f5f9}
.menu-flutuante form{margin:0}
.menu-flutuante .mi{display:inline-block;width:20px;text-align:center;font-size:16px}
.menu-flutuante hr{border:0;border-top:1px solid var(--borda);margin:6px 4px}
.menu-flutuante .perigo-txt{color:var(--vermelho)}
.menu-flutuante .perigo-txt:hover{background:#fee2e2}
.menu-itens[hidden]{display:none}
/* Botões do rodapé dos formulários alinhados à direita */
.barra-acoes{justify-content:flex-end}

.barra-acoes .projeto-pc{margin-right:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;min-width:0}
.barra-acoes .projeto-pc .mono{word-break:break-all}
@media (max-width:600px){.barra-acoes .projeto-pc{flex-basis:100%}}

/* Menu do topo: cada item fica inteiro numa linha (ex.: Servidores/Dados) */
header.topo nav a{white-space:nowrap}

/* Campos de caminho (pasta no site, pasta do FTP, caminho no servidor): ocupam 2 colunas para não cortar */
form.campos .duplo{grid-column:span 2}
@media(max-width:560px){form.campos .duplo{grid-column:1/-1}}

/* Telas do admin usam quase toda a largura */
body[class*="perfil-"] main{max-width:min(1800px,96vw);width:96%}

/* Selo da versão do CRM no cabeçalho */
.topo .selo-versao{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:10px;font-size:11px;padding:1px 8px;margin-left:6px;cursor:pointer;vertical-align:middle;line-height:1.5}.topo .selo-versao:hover{background:rgba(255,255,255,.3)}

/* ===== 📱 Celular: cabeçalho compacto + menu lateral (☰) ===== */
.menu-hamb{display:none;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:22px;line-height:1;width:44px;height:44px;padding:0;cursor:pointer;margin-left:auto}
.gaveta{position:fixed;top:0;left:0;bottom:0;width:80%;max-width:320px;background:#fff;z-index:200;transform:translateX(-105%);transition:transform .25s ease;display:flex;flex-direction:column;box-shadow:4px 0 24px rgba(0,0,0,.25)}
.gaveta.aberta{transform:none}
.gv-fundo{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:190}.gv-fundo[hidden]{display:none}
.gv-cab{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--azul-esc);color:#fff;font-size:17px}
.gv-fechar{background:none;border:0;color:#fff;font-size:22px;width:44px;height:44px;cursor:pointer}
.gv-lista{flex:1;overflow-y:auto;padding:6px 0;display:flex;flex-direction:column}
.gv-item{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 18px;color:var(--texto);text-decoration:none;font-size:16px;border-left:4px solid transparent;cursor:pointer;list-style:none}
.gv-item span{width:24px;text-align:center;font-size:18px}
.gv-item:hover{background:#f1f5ff}.gv-item.ativo{background:#eef2ff;border-left-color:var(--azul);font-weight:700;color:var(--azul)}
.gv-grupo summary::-webkit-details-marker{display:none}.gv-grupo summary::after{content:"▸";margin-left:auto;color:var(--suave)}.gv-grupo[open] summary::after{content:"▾"}
.gv-sub{padding-left:42px;font-size:15px;min-height:44px}
.gv-fim{margin-top:auto;border-top:1px solid var(--borda);padding-top:6px}
@media (max-width:900px){
  .topo{flex-wrap:nowrap;padding:8px 12px}
  .topo nav{display:none}
  .menu-hamb{display:inline-flex;align-items:center;justify-content:center;flex:none}
  .marca{font-size:16px;min-width:0;white-space:nowrap;overflow:hidden}
  .marca small{display:none}
  .marca .logo{height:30px!important}
  html,body{overflow-x:hidden}
  main{margin:14px auto;padding:0 12px;width:100%!important;max-width:100%!important}
  .tabela,.tabela.infra,.tabela-rolar{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  form.campos{grid-template-columns:1fr!important}
  form.campos>*{grid-column:1/-1!important;min-width:0}
  .bd-sitegrid,.cap-grade,.comparar{grid-template-columns:1fr!important}
  .bd-sitegrid>*{grid-column:auto!important}
  .barra-acoes{justify-content:flex-end}
  .barra-acoes .bd-salvar,.barra-acoes>button,.barra-acoes>.botao{flex:0 0 auto}
  .titulo-infra{flex-wrap:wrap;gap:8px}
  .abas-infra{overflow-x:auto;white-space:nowrap;flex-wrap:nowrap}
  img,canvas,video{max-width:100%}
}