/* UCA — Passo 51B: pequenos ajustes de responsividade no conteúdo público.
   Este CSS é complementar e não substitui app.css nem o Tailwind. */

/* Impede que textos e imagens extensos obriguem a página a crescer lateralmente. */
main { min-width: 0; }
main img, main video, main iframe { max-width: 100%; }
main img { height: auto; }
main p, main h1, main h2, main h3, main h4,
main a, main li { overflow-wrap: break-word; }

/* Campos e botões não devem exceder a largura disponível em ecrãs estreitos. */
main input:not([type="checkbox"]):not([type="radio"]),
main select,
main textarea { max-width: 100%; }

/* Em tabelas longas, preferir rolagem horizontal no bloco que contém a tabela.
   overflow-x:auto no elemento table não é fiável; evitar forçar estilos no layout. */
main .overflow-x-auto { -webkit-overflow-scrolling: touch; }

@media (max-width: 639px) {
  /* Evita títulos demasiado extensos quando não há Tailwind responsivo aplicado. */
  main h1, main h2 { overflow-wrap: anywhere; }

  /* Melhor experiência para tabelas públicas em dispositivos móveis. */
  main table { max-width: 100%; }
  main .overflow-x-auto > table { min-width: 560px; }

  /* iOS evita zoom involuntário ao focar inputs menores do que 16px. */
  main input:not([type="checkbox"]):not([type="radio"]),
  main select, main textarea { font-size: max(16px, 1em); }
}