/* Ajustes de layout compartilhados por todas as páginas.
 *
 * PRINCÍPIO: a PÁGINA nunca desliza para o lado. O que for mais largo que a tela (a barra de abas e as
 * tabelas) rola DENTRO do próprio quadro, e o resto da tela fica parado.
 */

/* Rede de segurança: nada empurra a página para o lado (clip não cria barra de rolagem nem quebra position:sticky). */
html, body { max-width: 100%; overflow-x: clip; }

/* Barra de abas: rola sozinha quando não cabe na tela (ex: Financeiro tem 6 abas). */
.abas {
  position: relative;               /* referência para centralizar a aba ativa (js/app.js) */
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;   /* ao chegar no fim, o gesto não "vaza" para a página */
  scrollbar-width: thin;
}
.aba { flex: 0 0 auto; white-space: nowrap; }

/* Tabelas: o quadro que as contém rola; a página não. */
[id^="tabela"][id$="Wrap"],
#listaEnquetesWrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}