/* ====================================================================================================
 * Nice Sec Apps — frontend-extra/gtf-ajustes.css
 * Finalidade: Nice Sec Apps - ajustes de tela sobre o compilado das telas principais (login, inicio, Configuracoes, Usuar…
 * Histórico (mais novo em cima) — versão | data | release | o que mudou
 *   1.11.0 | 2026-10-16 | R71 | Nice Sec Apps 1.11.0 (card FortiEDR no Painel do Servidor, leitor gtf-edr-estado, aviso…
 *   1.9.0  | 2026-10-15 | R66 | remetente por sistema na central de notificacoes (Nice Sec Apps 1.9.0)
 *   1.8.9  | 2026-10-14 | R65 | Configuracoes > Endereco (nome principal como parametro: enderecos.py + API admin + gtf-e…
 *   1.8.3  | 2026-10-08 | base | estado inicial importado em 08/10/2026, origem produção de 08/10/2026 09:28 (antes disso, só nos pacotes)
 * ==================================================================================================== */
/* Nice Sec Apps - ajustes de tela sobre o compilado das telas principais (login, inicio, Configuracoes, Usuarios, Servidor),
   que so existem compiladas (www/, da 1.5.4). Acrescentado ao www/index.html pelo empacotar.sh como
   /portal-assets/gtf-ajustes-<versao>.css (depois do CSS do app). Bancos de dados e Mapa de rede usam o kit e nao precisam.
   1.8.3 - gaveta lateral aberta (.gaveta-fundo) trava a pagina de fundo, igual a Janela do kit:
     - a pagina atras da gaveta nao rola; a rolagem da gaveta para no fim e nao passa para a pagina;
     - sem scrollbar-gutter: em tela estreita ele mudava a largura e a pagina de fundo pulava 38 px (QA 08/10);
     - so no html: travar tambem o body faz o body virar a area de rolagem e a barra azul do topo (sticky) sumia atras
       da janela (revisao 08/10). */
html:has(.gaveta-fundo) { overflow: hidden; }
.gaveta-corpo { overscroll-behavior: contain; }
/* 1.8.9: Configuracoes > Endereco - listas curtas (volta do login, conferencia) sem marcador; endereco comprido quebra */
.secao-config .lista-simples { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.secao-config.endereco code { overflow-wrap: anywhere; }
.secao-config.endereco .painel.bloco > footer { border-top: 1px solid var(--borda); background: var(--sup2); border-radius: 0 0 12px 12px; flex-wrap: wrap;
  justify-content: flex-end; align-items: center; gap: 10px; padding: 14px 18px; display: flex; }
.secao-config.endereco .painel.bloco > footer .mut { margin-right: auto; }
.secao-config.endereco .grade-form small { display: block; margin-top: 4px; }
/* 1.9.0 (release 66): Configuracoes > Notificacoes > Remetentes (aba-remetentes.js) - mesmo rodape da aba Endereco; lista de
   remetentes cadastrados em cartoes com Editar/Remover do tamanho normal; escolha de regras sem a borda padrao do navegador */
.secao-config.remetentes { display: grid; gap: 16px; }
.secao-config.remetentes code { overflow-wrap: anywhere; }
.secao-config.remetentes h3 { margin: 18px 0 8px; font-size: 14px; }
.secao-config.remetentes .painel.bloco > footer { border-top: 1px solid var(--borda); background: var(--sup2); border-radius: 0 0 12px 12px; flex-wrap: wrap;
  justify-content: flex-end; align-items: center; gap: 10px; padding: 14px 18px; display: flex; }
.secao-config.remetentes .painel.bloco > footer .mut { margin-right: auto; }
.secao-config.remetentes .lista-chaves { display: grid; gap: 12px; }
.secao-config.remetentes .remetentes-efetivos > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.secao-config.remetentes .lista-remetentes { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.secao-config.remetentes .lista-remetentes > li { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; border: 1px solid var(--borda);
  border-radius: 10px; padding: 10px 14px; background: var(--sup); }
.secao-config.remetentes .lista-remetentes .id { display: grid; gap: 2px; min-width: 0; flex: 1 1 260px; overflow-wrap: anywhere; }
.secao-config.remetentes .lista-remetentes .acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.secao-config.remetentes .escolha-regras { border: 1px solid var(--borda); border-radius: 10px; margin: 12px 0; padding: 6px 10px 10px; display: flex;
  flex-wrap: wrap; gap: 4px 10px; min-width: 0; }
.secao-config.remetentes .escolha-regras > legend { padding: 0 6px; color: var(--mut); }
.secao-config.remetentes .escolha-regras > p { margin: 4px 0 0; }
.secao-config.remetentes form + form { margin-top: 18px; border-top: 1px solid var(--borda); padding-top: 14px; }
.secao-config.remetentes .conferencia { margin-top: 12px; }

/* Release 65 - tabela que nao cabe vira cartoes (gtf-tabelas.js / kit/tabelas.ts poem a classe gtf-cartoes na .tabela quando a
   tabela ia rolar de lado): cada linha e um cartao; cada celula "coluna: valor" (o nome da coluna vem do data-rotulo); a primeira
   celula e o titulo do cartao; acoes da linha a direita; o cabecalho fica so para o leitor de tela. Mesmo bloco no kit.css e nos
   gtf-ajustes.css do Nice Sec Energy e do Nice Sec Apps. */
.tabela.gtf-cartoes { overflow: visible !important; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; }
.tabela.gtf-cartoes > table { display: block; width: 100% !important; min-width: 0 !important; border: 0 !important; }
.tabela.gtf-cartoes > table > thead { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tabela.gtf-cartoes > table > tbody { display: grid; gap: 10px; }
.tabela.gtf-cartoes > table > tbody > tr { display: block; border: 1px solid var(--borda); border-radius: 10px; padding: 10px 14px; background: var(--sup); }
.tabela.gtf-cartoes > table > tbody > tr > td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 4px 0 !important;
  border: 0 !important; text-align: right; min-width: 0 !important; width: auto !important; max-width: none !important; white-space: normal !important; overflow-wrap: anywhere; }
.tabela.gtf-cartoes > table > tbody > tr > td::before { content: attr(data-rotulo); flex: 0 0 auto; max-width: 46%; text-align: left; font-size: 12px; font-weight: 600;
  color: var(--mut); overflow-wrap: normal; }
.tabela.gtf-cartoes > table > tbody > tr > td[data-rotulo=""]::before, .tabela.gtf-cartoes > table > tbody > tr > td:not([data-rotulo])::before { content: none; }
.tabela.gtf-cartoes > table > tbody > tr > td:first-child { display: block; text-align: left; font-weight: 600; padding-bottom: 6px !important; }
.tabela.gtf-cartoes > table > tbody > tr > td:first-child::before { content: none; }
.tabela.gtf-cartoes > table > tbody > tr > td[colspan] { display: block; text-align: left; }
.tabela.gtf-cartoes > table > tbody > tr > td.acoes-linha { justify-content: flex-end; flex-wrap: wrap; border-top: 1px solid var(--borda) !important; margin-top: 6px; padding-top: 8px !important; }
.tabela.gtf-cartoes > table > tbody > tr > td.acoes-linha::before { content: none; }
.tabela.gtf-cartoes > table > tbody > tr > td > * { min-width: 0; }
.tabela.gtf-cartoes > table > tbody > tr > td:last-child:has(> button, > a.btn, > a.btn-sec) { justify-content: flex-end; flex-wrap: wrap;
  border-top: 1px solid var(--borda) !important; margin-top: 6px; padding-top: 8px !important; }
.tabela.gtf-cartoes > table > tbody > tr > td:last-child:has(> button, > a.btn, > a.btn-sec)::before { content: none; }
@media (min-width: 700px) { .tabela.gtf-cartoes > table > tbody { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); align-items: start; } }
/* 1.11.0 (release 71): Painel do Servidor > card FortiEDR (card-edr.js) - ao lado de Servicos no computador; o resto como os paineis */
@media (min-width: 1101px) { .painel.p-edr { grid-column: span 6; } }
.gtf-edr { display: grid; gap: 10px; }
.gtf-edr .edr-estado { margin: 0; font-size: 15px; }
.gtf-edr .edr-estado b { font-weight: 600; }
.gtf-edr p { margin: 0; }
.gtf-edr code { overflow-wrap: anywhere; }
.gtf-edr .edr-detalhes summary { cursor: pointer; color: var(--link, var(--gtf-azul)); font-size: 13px; }
.gtf-edr .edr-detalhes .kv { margin-top: 8px; }
/* R71 2a rodada: o .kv do compilado usa max-content na coluna do nome - um nome comprido do --status (ate 60 letras) empurrava o card
   para fora no celular; aqui o nome ocupa no maximo 45% e quebra */
.gtf-edr .kv { grid-template-columns: fit-content(45%) minmax(0, 1fr); }
.gtf-edr .kv dt { overflow-wrap: anywhere; min-width: 0; }

/* 1.11.0 (release 71, achado no QA do card do FortiEDR): no tablet (painéis com metade da largura) a linha da Latência
   (110 px + 80 px + gráfico de 120 px + texto) passava 47 px da borda do painel - antes ficava por baixo do painel vizinho, com o
   card novo ao lado de Serviços a Latência foi para a coluna da direita e virou rolagem lateral. O gráfico encolhe (tem viewBox). */
.painel.p-lat .lat li { grid-template-columns: minmax(0, 110px) minmax(0, 80px) minmax(0, 1fr) auto; }
.painel.p-lat .lat li > * { min-width: 0; }
.painel.p-lat .lat .mini { max-width: 100%; height: auto; }
