/* O que é específico das telas deste projeto, sobre o design system da administração.
   Estilo de conversa NÃO entra aqui: a tela de chat é da Web.Publico. */

/* Conteúdo cru de chunk e texto vetorizado. `pre-wrap` porque o recuo e as quebras do Markdown
   original fazem parte do que se está diagnosticando. */
.conteudo-chunk {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 18rem;
    overflow-y: auto;
    font-size: .8125rem;
    margin: 0;
}

details summary {
    cursor: pointer;
}

dl.row dt {
    font-weight: 600;
}

/* Evita que as listas de diagnóstico estourem em telas estreitas. */
@media (max-width: 575.98px) {
    dl.row dt, dl.row dd {
        width: 100%;
    }
}

/* Título das telas, no formato do `botao-voltar` do Tramita (que aqui não volta para lugar
   nenhum — é só o título). */
.container-titulo .botao-voltar {
    cursor: default;
}

/* ---------------------------------------------------------------------------
   Correção de overflow em telas estreitas

   O `.row` do Bootstrap tem margem lateral NEGATIVA de metade da gutter, e conta com o padding do
   container para compensá-la. O `adm-container-very-large` que veio do Tramita cai para
   `padding: 0 0.25rem` (4px) abaixo de 992px, mas nossas linhas usam `g-3` — gutter de 1rem, ou
   seja 8px negativos de cada lado. Sobram 4px para fora, e a página ganha scroll horizontal.

   Igualar o padding à metade da gutter resolve na origem. `overflow-x: hidden` no body
   esconderia o sintoma e deixaria a próxima ocorrência passar em branco.
   --------------------------------------------------------------------------- */

@media (max-width: 991px) {
    .adm-container-very-large {
        padding: 0 0.5rem;
    }
}

/* ---------------------------------------------------------------------------
   Tela de Perguntas (análise do que os usuários perguntaram)
   --------------------------------------------------------------------------- */

/* A linha inteira abre o offcanvas de detalhes. */
.tabela-perguntas tbody tr {
    cursor: pointer;
}

/* Pergunta e resposta podem ser longas: a listagem mostra duas linhas, e o offcanvas mostra tudo.
   O texto inteiro fica no `title`, para o mouse. */
.tabela-perguntas .celula-texto {
    min-width: 16rem;
    max-width: 28rem;
}

.tabela-perguntas .celula-texto,
.tabela-perguntas .celula-texto .btn {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

/* `display: -webkit-box` tira a célula do layout de tabela; o botão interno já tem o seu clamp. */
.tabela-perguntas td.celula-texto {
    display: table-cell;
}

.tabela-perguntas td.celula-texto .btn {
    padding: 0;
}

/* O offcanvas de detalhes é largo: tem tabela de trechos e texto de resposta. */
.perguntas-offcanvas {
    --bs-offcanvas-width: min(760px, 100vw);
}

/* Pergunta, resposta e comentário: o texto como foi escrito, com as quebras de linha. */
.texto-longo {
    white-space: pre-wrap;
    word-break: break-word;
}

/* ⚠️ O `.visually-hidden` do Bootstrap é `position: absolute`. Sem um ancestral posicionado, ele escapa do
   recorte do `.table-responsive` e, se a coluna está fora da área visível da tabela, alarga a PÁGINA
   INTEIRA (medido: scrollWidth 880 numa janela de 773). O `relative` faz a tabela ser o bloco de
   contenção, e o `overflow` dela passa a recortá-los. Vale para qualquer tabela responsiva com texto
   só-para-leitor-de-tela. */
.tabela-perguntas-responsiva {
    position: relative;
}

/* ---------------------------------------------------------------------------
   Tela de Cargas (histórico de indexação)
   --------------------------------------------------------------------------- */

/* A linha inteira abre o offcanvas de detalhes. */
.tabela-cargas tbody tr {
    cursor: pointer;
}

/* O detalhe da carga é largo: tem a tabela de chunks, com trilha e URL. */
.cargas-offcanvas {
    --bs-offcanvas-width: min(820px, 100vw);
}

/* URL sem espaço: sem isto, uma URL longa alarga a tabela do offcanvas em vez de quebrar. */
.url-quebra {
    word-break: break-all;
}