/* dicode.ai — CSS só da página OCR PDF (/ocr-pdf).
   Tela: assets/js/ferramentas/telas/ocr-pdf.js; opções: templates/ferramentas/ocr-pdf.html.
   Só os tokens do design system, cantos retos, sem sombra nem gradiente, linhas de 1px, alvos de
   toque de 44px. */

/* Opções: as caixas de marcar uma embaixo da outra, com a explicação logo depois */
.ocr-idiomas, .ocr-paginas { gap: 4px; }
.ocr-idiomas .campo-ajuda { margin: 4px 0 0; }
.ocr-paginas .campo-ajuda { margin: -6px 0 0 28px; }

/* Resultado: prévia do texto lido, com Copiar e Baixar o .txt. A caixa tem altura máxima e rola
   por dentro (nada embaixo dela pula). */
.ocr-texto { display: grid; gap: 10px; min-width: 0; }
.ocr-texto > .rotulo { margin: 0; }
.ocr-texto-previa {
  margin: 0;
  padding: 14px 16px;
  max-height: 320px;
  overflow: auto;
  border: 1px solid var(--preto);
  background: var(--branco);
  font-family: var(--fonte-mono);
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.ocr-texto-previa:focus-visible { outline: 2px solid var(--preto); outline-offset: 3px; }
.ocr-texto-cortada { margin: 0; }
.ocr-texto-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.ocr-texto-acoes .botao { min-height: 44px; }
.ocr-copiado { margin: 0; }
.ocr-copia { position: fixed; top: 0; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Documentos que ficaram de fora (com vários arquivos) */
.ocr-fora { display: grid; gap: 8px; padding: 16px 20px; border: 1px solid var(--preto); background: var(--branco); min-width: 0; }
.ocr-fora > .rotulo { margin: 0; }
.ocr-fora ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: 15px; }
.ocr-fora li { display: flex; gap: 10px; align-items: baseline; overflow-wrap: anywhere; }
.ocr-fora li::before { content: ''; flex: none; width: 7px; height: 7px; background: var(--laranja); }

/* Só no app instalado (molde_app, pwa/foto-tela.js; .ft é a tela do app). A prévia do texto lido fica
   na aba Texto, mais baixa (a folha do pé tem pouca altura); a reserva no servidor fica embaixo da
   caixa de erro, em cima das abas, com rolagem própria. */
.ft .ocr-app-texto .ocr-texto-previa { max-height: 18vh; padding: 10px 12px; font-size: 12px; }
.ft .ocr-app-texto .ocr-texto { gap: 8px; }
.ft .ft-avisos > .reserva { max-height: 42vh; overflow-y: auto; gap: 10px; padding: 12px 16px; border: 0; border-top: 2px solid var(--preto); }
.ft .ft-avisos > .reserva .reserva-titulo { font-size: 16px; }
.ft .ft-avisos > .reserva-demora { margin: 0; padding: 10px 16px; border-top: 2px solid var(--preto); }
.ft .ft-avisos > .reserva-demora .opcoes-dica { margin: 0; }
/* Com o aviso do servidor aberto, a mensagem do aparelho sai da frente (ela volta se o aviso fechar;
   um erro do servidor só aparece com o aviso já fechado): o meio não some atrás dos dois. */
.ft .ft-avisos:has(> .reserva:not([hidden])) > [data-ui="erro"] { display: none; }