/* Portal admin (admin.kza2675.cloud): usa o estilo do Portal KZA (estilo.css) e só acrescenta o layout próprio. */

.adm { display: grid; grid-template-columns: 210px 1fr; min-height: 100dvh; }
.adm-menu { position: sticky; top: 0; height: 100dvh; display: flex; flex-direction: column; gap: 2px; padding: 16px 10px;
  background: var(--fundo-lateral); border-right: 1px solid var(--camarim); }
.adm-menu a, .adm-sair { display: block; padding: 10px 12px; border-radius: 10px; color: var(--texto-suave); text-decoration: none;
  font-weight: 700; background: none; border: 0; text-align: left; font: inherit; cursor: pointer; }
.adm-menu a:hover, .adm-sair:hover { color: var(--texto); background: var(--camarim); }
.adm-menu a[aria-current="page"] { color: var(--texto); background: var(--camarim-alto); }
.adm-marca { display: flex !important; align-items: center; gap: 8px; margin-bottom: 14px; }
.adm-marca img { height: 22px; width: auto; }
.adm-marca span { font-family: var(--titulo); font-size: 13px; letter-spacing: .08em; color: var(--ambar); text-transform: uppercase; }
.adm-espaco { flex: 1; }
.adm-conteudo { min-width: 0; }
.pagina.larga { max-width: 1100px; }
.adm-titulo { font-size: 40px; margin-bottom: 8px; }

/* Agente: lista de conversas + conversa */
.adm-agente { display: grid; grid-template-columns: 290px 1fr; min-height: 100dvh; }
.adm-conversas { border-right: 1px solid var(--camarim); padding: 14px 12px; overflow-y: auto; height: 100dvh; position: sticky; top: 0; }
.adm-conversas .lista a[aria-current="page"] strong { color: var(--ambar); }
.adm-conversas .lista a { flex-direction: column; gap: 2px; }
.adm-conversas .lista small { display: flex; gap: 6px; align-items: center; }
.adm-nova { display: flex; gap: 8px; margin-bottom: 12px; }
.adm-nova select, .adm-tr select { background: var(--camarim); color: var(--texto); border: 1px solid var(--camarim-alto); border-radius: 10px; padding: 6px 8px; font: inherit; font-size: 14px; max-width: 100%; }
.adm-chat { min-width: 0; }
.adm-chat-caixa { min-height: 100dvh; }
.adm-aprovacao { border: 1.5px solid var(--amarelo); border-radius: var(--raio); padding: 12px 14px; margin: 0 0 18px; background: var(--camarim); }
.adm-aprovacao pre { background: var(--veludo); padding: 10px 12px; border-radius: 8px; overflow-x: auto; margin: 8px 0 12px; white-space: pre-wrap; word-break: break-all; }
.adm-aprovacao.aprovado, .adm-aprovacao.usado { border-color: rgba(124, 242, 194, .45); }
.adm-aprovacao.recusado { border-color: var(--borda-perigo); opacity: .8; }

/* Tabelas e listas */
.adm-tabela { display: grid; gap: 0; }
.adm-tr { display: grid; grid-template-columns: 2.2fr 1.4fr 1fr 1.2fr 1.3fr .9fr; gap: 12px; align-items: center; padding: 12px 4px; border-top: 1px solid var(--camarim-alto); }
.adm-tr > span { display: grid; gap: 2px; min-width: 0; }
.adm-tr small { color: var(--texto-suave); font-size: 13px; overflow: hidden; text-overflow: ellipsis; }
.adm-tr.cabeca-tabela { border-top: 0; color: var(--texto-suave); font-size: 13px; font-weight: 700; }
.adm-chave { display: inline-flex; gap: 8px; align-items: center; cursor: pointer; }
.adm-linha { display: flex; gap: 12px; align-items: center; padding: 10px 2px; flex-wrap: wrap; }
.adm-linha strong { flex: 1; min-width: 140px; font-weight: 400; }
.adm-linha small { color: var(--texto-suave); }
.adm-acoes { display: flex; gap: 6px; }
.adm-bola { width: 10px; height: 10px; border-radius: 50%; background: var(--apagado); flex: none; }
.adm-bola.ok { background: var(--ok); }
.adm-bola.mal { background: var(--perigo); }
.adm-numeros { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 4px; }
.adm-numeros .cartao { display: grid; gap: 4px; }
.adm-numeros small { color: var(--texto-suave); }
.adm-numeros strong { font-size: 18px; }
.adm-janela-logs { max-width: min(1000px, 96vw); }
.adm-logs { background: var(--fundo-lateral); padding: 12px; border-radius: 8px; max-height: 65dvh; overflow: auto; font-size: 12px; white-space: pre-wrap; word-break: break-all; }
.cartao pre { background: var(--veludo); padding: 10px 12px; border-radius: 8px; overflow-x: auto; }
.ok-texto { color: var(--ok); }
.erro-texto { color: var(--perigo); }
.escondido { position: absolute; left: -9999px; }
.so-estreito { display: none; }

@media (max-width: 900px) {
  .adm { grid-template-columns: 1fr; }
  .adm-menu { position: sticky; top: 0; z-index: 5; height: auto; flex-direction: row; overflow-x: auto; padding: 8px; border-right: 0; border-bottom: 1px solid var(--camarim); }
  .adm-menu a, .adm-sair { white-space: nowrap; padding: 8px 10px; }
  .adm-marca { margin: 0 6px 0 0; }
  .adm-espaco { display: none; }
  .adm-agente { grid-template-columns: 1fr; }
  .adm-conversas { height: auto; position: static; border-right: 0; }
  .adm-conversas.recolhe { display: none; }
  .so-estreito { display: inline; }
  .adm-chat-caixa .topo { top: 52px; }
  .adm-tr { grid-template-columns: 1fr 1fr; }
  .adm-tr.cabeca-tabela { display: none; }
  .adm-tr > span:first-child { grid-column: 1 / -1; }
}