/* ORBIT Empresa — os agentes no Chat (o chat_subagentes.js) e o relatório dos ajudantes (o vistaSub do chat.js). Como o
   chat.css: só seletores da área (ch-) e nenhum componente o-* redefinido fora deles. */

/* ── a linha dos agentes, por cima da caixa de escrever (sempre à vista, também no telemóvel) ──────────────────── */
.ch-rodape > .ch-ag { margin: var(--e-2) var(--e-4) 0; }
.ch-ag-faixa { width: 100%; text-align: left; font: inherit; cursor: pointer; }
.ch-ag-faixa > .o-ic { flex: none; color: var(--ink-3); }
/* tudo numa linha: a frase encolhe com reticências, os nomes (no computador) ficam no que sobra, nunca para o lado */
.ch-ag-faixa > span.ch-ag-texto { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch-ag-faixa > span.ch-ag-nomes { display: flex; flex: 1 1 0; align-items: center; gap: var(--e-3); min-width: 0; padding: var(--e-1); overflow: hidden; }
.ch-ag-nome { display: inline-flex; flex: none; align-items: center; gap: var(--e-2); min-width: 0; color: var(--ink-2); font: 400 var(--t-12)/1.3 var(--sans); }
.ch-ag-nome-texto { max-width: 12rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* o papel («Construtor» ou «Equipa») ao lado do título: a o-tag da casa, sempre inteira (nem estica nem encolhe); junto
   aos nomes da linha, do tamanho do texto deles (nunca mais alta do que a linha que acompanha) */
.ch-ag-faixa > span.ch-ag-papel, .ch-ag-nome > .ch-ag-papel, .ch-ag-item-linha > .ch-ag-papel { flex: none; }
.ch-ag-nome > .ch-ag-papel { min-height: 16px; padding: 0 var(--e-1); }

/* ── a janela: a lista dos agentes e o ecrã de um ───────────────────────────────────────────────────────────────── */
.ch-ag-lista { display: flex; flex-direction: column; gap: var(--e-2); margin: 0; padding: 0; list-style: none; }
.ch-ag-item {
  display: flex; align-items: center; gap: var(--e-3); width: 100%; min-height: var(--ctl); padding: var(--e-2) var(--e-3);
  border: 1px solid var(--linha-2); border-radius: var(--r); background: var(--painel); color: var(--ink);
  font: inherit; text-align: left; cursor: pointer;
}
.ch-ag-item:hover { border-color: var(--accent-linha); }
.ch-ag-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ch-ag-item > .o-ic, .ch-ag-item > .o-pill { flex: none; }
.ch-ag-item > .o-ic { color: var(--ink-3); }
.ch-ag-item-corpo { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
/* o título e o papel numa linha: a etiqueta inteira ao lado do título; sem lugar para os dois (no telemóvel, com o estado à
   direita), a etiqueta passa para baixo do título, que fica legível (nunca «O …») e só encolhe com reticências sozinho */
.ch-ag-item-linha { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-1) var(--e-2); min-width: 0; }
.ch-ag-item-linha > .ch-ag-item-titulo { flex: 0 1 auto; min-width: 0; }
.ch-ag-item-titulo { overflow: hidden; color: var(--ink); font: 600 var(--t-14)/1.35 var(--sans); text-overflow: ellipsis; white-space: nowrap; }
.ch-ag-item-meta { margin: 0; color: var(--ink-3); font: 400 var(--t-12)/1.4 var(--mono); overflow-wrap: anywhere; }
.ch-ag-um-cabeca { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); min-width: 0; margin: 0 0 var(--e-1); }
.ch-ag-um-titulo { display: flex; flex: 0 1 auto; align-items: center; gap: var(--e-2); min-width: 0; margin: 0; color: var(--ink); font: 600 var(--t-15)/1.35 var(--sans); overflow-wrap: anywhere; }
.ch-ag-um-titulo > .o-ic { flex: none; }
.ch-ag-janela > .ch-ag-item-meta { margin-bottom: var(--e-3); }
.ch-ag-janela > .o-aviso { margin: 0 0 var(--e-3); }
.ch-ag-janela .terminal-caixa > .o-terminal { height: 46vh; min-height: min(240px, 46vh); }

/* ── o relatório de um ajudante acabado, no cartão dele (o vistaSub do chat.js) ─────────────────────────────────── */
.ch-sub-relatorio { min-width: 0; margin: var(--e-1) 0 0; color: var(--ink-2); font-size: var(--t-13); }
/* fechado, mostra as primeiras linhas; «Ver o relatório todo» abre-o inteiro */
.ch-sub-relatorio--curto { max-height: 9.5em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }

/* ── a secção «Agentes» do painel (22/10): um botão por agente do OS ou ajudante, como as conversas da gaveta ─────────────────── */
/* três linhas: o ponto, o título e o papel; o que está a fazer agora (até duas linhas); o estado, o tipo e quem o
   lançou. A linha ancora ao topo do bloco (flex-start) e o ponto fica numa caixa da altura da primeira linha, ao centro
   dela (sem margens) */
.ch-subitem-linha { min-width: 0; }
.ch-subitem {
  display: flex; align-items: flex-start; gap: var(--e-2); width: 100%; min-width: 0; min-height: 48px; padding: var(--e-2);
  border: 1px solid transparent; border-radius: var(--r); background: none; color: var(--ink-2); font: inherit; text-align: left; cursor: pointer;
}
.ch-subitem:hover { background: var(--hover); color: var(--ink); }
.ch-subitem[aria-current="true"] { border-color: var(--accent-linha); background: var(--accent-fundo); color: var(--ink); }
.ch-subitem-ponto { display: grid; flex: none; place-items: center; width: 8px; height: calc(1.5 * var(--t-13)); }
.ch-subitem-titulo { display: flex; align-items: center; gap: var(--e-2); min-width: 0; color: var(--ink); font: 600 var(--t-13)/1.5 var(--sans); }
.ch-subitem-titulo > .o-elipse { flex: 0 1 auto; }
/* a etiqueta do papel, inteira, logo a seguir ao título e do tamanho do texto (nunca mais alta do que a linha) */
.ch-subitem-titulo > .ch-ag-papel { flex: none; min-height: 16px; padding: 0 var(--e-1); }
/* o que está a fazer: o texto do motor (mono), até duas linhas, cortado no fim; a trabalhar, na cor do texto */
.ch-subitem-agora {
  display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
  color: var(--ink-2); font: 400 var(--t-12)/1.4 var(--mono); overflow-wrap: anywhere;
}
.ch-subitem-agora[data-estado="trabalham"] { color: var(--ink); }
.ch-subitem-agora:empty { display: none; }
.ch-subitem-meta { display: flex; align-items: center; gap: var(--e-2); min-width: 0; min-height: 20px; }
.ch-subitem-meta > .o-pill { flex: none; }
.ch-subitem-meta > .o-linha-meta { flex: 1 1 auto; }
.ch-seccao-mais { align-self: flex-start; margin-top: var(--e-1); }

/* ── um agente do OS no lugar da conversa: quem o lançou, o que faz agora e o ecrã dele (22/10) ───────────────────── */
.ch-agente { gap: var(--e-3); }
.ch-agente-quem { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-3); min-width: 0; }
.ch-agente-quem-texto { min-width: 0; margin: 0; color: var(--ink-2); font-size: var(--t-14); line-height: 1.45; overflow-wrap: anywhere; }
.ch-agente-agora { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--e-1) var(--e-2); min-width: 0; margin: 0; }
.ch-agente-agora-rotulo { flex: none; color: var(--ink-3); font: 600 var(--t-11)/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.ch-agente-agora-texto { min-width: 0; color: var(--ink); font: 400 var(--t-14)/1.45 var(--mono); overflow-wrap: anywhere; }
.ch-agente-aviso { display: flex; flex-direction: column; gap: var(--e-2); }
.ch-agente-aviso:empty { display: none; }
.ch-agente-aviso > .o-aviso { margin: 0; }
.ch-agente .terminal-caixa > .o-terminal { height: 52vh; min-height: min(280px, 52vh); }
.ch-agente-nota { margin: 0; }
.ch-bt-agentes { flex: none; }

@media (max-width: 53.75em), (pointer: coarse) and (max-height: 31.25em) {
  .ch-rodape > .ch-ag { margin: var(--e-2) var(--e-3) 0; }
  /* na folha do painel, as linhas dos subagentes com a altura das conversas; o «Abrir em Agentes» só com o ícone */
  .ch-subitem { min-height: 52px; }
  .ch-bt-agentes { width: var(--ctl); min-width: var(--ctl); padding: 0; }
  /* no telemóvel, só a frase (os nomes estão na janela) */
  .ch-ag-faixa > span.ch-ag-nomes { display: none; }
}
@media (min-width: 53.8125em) and (pointer: fine) {
  .ch--moldura .ch-rodape > .ch-ag { flex: none; }
  /* na moldura do computador, o ecrã do agente enche a altura que sobra */
  .ch--moldura .ch-agente > .terminal-caixa { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 240px; }
  .ch--moldura .ch-agente > .terminal-caixa > .o-terminal { flex: 1 1 auto; height: auto; min-height: 240px; }
}