/* =========================================================
   ROLAGEM GLOBAL — Android WebView / Chromium / Firefox
   (colar no final do style.css)
   ========================================================= */
:root{
  --nav-h: 60px;                    /* altura do topo fixo, se tiver */
  --scrollbar-size: 10px;           /* largura/altura da barra */
  --scrollbar-bg: #e6eef6;          /* trilho */
  --scrollbar-thumb: #a3c0dc;       /* polegar */
  --scrollbar-thumb-hover: #7da6cd; /* hover */
  --scrollbar-thumb-active: #5b8fc2;/* active */
  scrollbar-gutter: auto; /* evita “pular” layout quando surge a barra */
}

/* Root deve SEMPRE poder rolar (exceto páginas de MAPA) */
html{
  height: calc(100%);
  overflow-y: auto;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: contain; /* remove “glow/bounce” chato do Android */
}

body{
  /* 100dvh resolve a barra dinâmica do Android; 100svh é fallback */
  min-height: 100dvh;
  min-height: 100svh;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch; /* inofensivo no Android; ajuda iOS */
}

/* Se algum script/lib travar o root com overflow:hidden, desfazemos. */
html[style*="overflow: hidden"], body[style*="overflow: hidden"]{
  overflow: auto !important;
}

/* Classe utilitária caso você queira trancar o root conscientemente */
html.is-scroll-locked{ overflow: hidden !important; }

/* Áreas internas que PRECISAM rolar (sem criar barra dupla) */
.table-responsive,
.offcanvas-body,
.modal .modal-body,
[data-scrollable="true"]{
  max-height: 80vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Cabeçalho sticky sem brigar com o scroll */
.table thead th{
  position: sticky;
  top: 0;             /* se tiver navbar fixa, pode virar: top: var(--nav-h); */
  background: #fff;
  z-index: 3;
}

/* Scrollbars — Chromium/WebView e Firefox */
*{
  scrollbar-width: thin;                                      /* Firefox */
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-bg);/* Firefox */
}
::-webkit-scrollbar{
  width: var(--scrollbar-size);
  height: var(--scrollbar-size);
}
::-webkit-scrollbar-track{
  background: var(--scrollbar-bg);
}
::-webkit-scrollbar-thumb{
  background: var(--scrollbar-thumb);
  border-radius: 8px;
  border: 2px solid var(--scrollbar-bg);
}
::-webkit-scrollbar-thumb:hover{ background: var(--scrollbar-thumb-hover); }
::-webkit-scrollbar-thumb:active{ background: var(--scrollbar-thumb-active); }

/* PÁGINAS DE MAPA: continuam SEM rolagem, tela cheia */
body.body--map {
  overflow: hidden;
  height: 100dvh;
}
body.body--map #map {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1; /* mapa fica no fundo */
}

/* Compensa a altura da navbar fixa */
.body-lanac { padding-top: 56px; }
@media (min-width: 992px){
  .body-lanac { padding-top: 64px; } /* ajuste fino se sua navbar for mais alta */
}

/* Se em algum ponto alguém zerar a opacidade de fundo do Bootstrap: força fundo sólido */
/* Navbar sempre por cima do mapa */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2000; /* garante que sobreponha tudo */
  background-color: #fff; /* se quiser opaco */
}

/* --- NÃO rolar nada dentro da NAVBAR --- */
.navbar,
.navbar .container,
.navbar .container-fluid{
  overflow: visible !important;
}

.navbar .dropdown-menu{
  max-height: none !important;   /* sem limite => não cria barra interna */
  overflow: visible !important;  /* deixa o menu expandir normal */
  -webkit-overflow-scrolling: auto !important;
  z-index: 1080;                 /* garante sobrepor conteúdo abaixo */
}

/* Mobile: mantém tua lógica de submenu, sem rolagem interna */
@media (max-width: 991.98px){
  .navbar .dropdown-submenu > .dropdown-menu{
    max-height: none !important;
    overflow: visible !important;
  }
}

/* POPUPS DE MAPA */
.maplibregl-popup-close-button{
  background-color: rgb(220, 53, 69) !important;
  color: white !important;
}

/* =========================================================
   PRIORIDADE DE CAMADAS (Navbar acima do HUD de navegação)
   ========================================================= */

/* Navbar principal acima de tudo, inclusive do HUD azul */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10010 !important;
  background-color: #fff;
  backdrop-filter: blur(4px);
}

/* Dropdowns precisam ainda mais prioridade (pra abrir por cima do modal azul) */
.navbar .dropdown-menu {
  z-index: 10020 !important;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(6px);
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* HUD e botões da navegação do mapa — camada abaixo da navbar */
.nav-hud,
.nav-bottom,
.gl-btn {
  z-index: 2002 !important;
}

/* o mapa continua sendo a camada base */
body.body--map #map {
  z-index: 1 !important;
}

#modalFinalizarColeta{
  margin-top: 80px;
}

/* --- Mobile --- */
  @media (max-width: 768px) {
  #modalFinalizarColeta{
    margin-top: 180px !important;
    z-index: 9999 !important;
  }
}


/* Garante que o modal fique acima de qualquer overlay do mapa */
.modal {
  position: fixed !important;
  z-index: 99999 !important;
}


/* ============================================================
   CORREÇÃO GLOBAL DE Z-INDEX DOS MODAIS (Bootstrap + custom)
   ============================================================ */

/* O fundo escurecido fica logo abaixo do modal */
.modal-backdrop {
  position: fixed !important;
  z-index: 99998 !important;
}

/* Evita que overlays do mapa ou HUD bloqueiem interação */
#track-hud-wrapper,
#map > * {
  z-index: 1500 !important;
}

.modal-backdrop.show {
  background-color: rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: blur(3px);
}

/* Força o modal de Finalizar Coleta a ficar acima do HUD */
#modalFinalizarColeta {
  position: fixed !important;
  z-index: 99999 !important;
}

/* Garante que o fundo escuro dele também fique acima do mapa */
.modal-backdrop {
  z-index: 99998 !important;
}




/* Paginação */

.pagination .current {
    text-decoration: none;
    margin-left: 5px;
    background-color: #004C97;
    color: white;
    width: 25px;
    height: 29px;
    margin-top: -2px;
    text-align: center;
    padding: 3px;
    border-radius: 5px
}
.pagination {
    text-decoration: none;
    text-align: right;
}   
.pagination .page a{
    text-decoration: none;
    margin-left: 5px;
    background-color: #a3c0dc;
    color: white;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 5px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .last a{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-11);
    color: var(--cor-nro-9);
    vertical-align: middle;
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 5px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .previous a{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-11);
    color: var(--cor-nro-9);
    vertical-align: middle;
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 5px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .first a{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-11);
    color: var(--cor-nro-9);
    vertical-align: middle;
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 5px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .next a{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-11);
    color: var(--cor-nro-9);
    vertical-align: middle;
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 5px;
    margin-top: 9px;
    border-radius: 5px;
}

/* HOVERS */
 
.pagination .page a:hover{
    text-decoration: none;
    margin-left: 5px;
    background-color: #a3c0dc;
    vertical-align: middle;
    width: 30px;
    height: 25px;
    text-align: center;
    padding: 8px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .last a:hover{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-7);
    vertical-align: middle;
    width: 30px;
    height: 25px;
    text-align: center;
    padding: 8px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .previous a:hover{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-7);
    vertical-align: middle;
    width: 30px;
    height: 25px;
    text-align: center;
    padding: 8px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .first a:hover{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-7);
    vertical-align: middle;
    width: 30px;
    height: 25px;
    text-align: center;
    padding: 8px;
    margin-top: 9px;
    border-radius: 5px;
}
.pagination .next a:hover{
    text-decoration: none;
    margin-left: 5px;
    background-color: var(--cor-nro-7);
    vertical-align: middle;
    width: 30px;
    height: 25px;
    text-align: center;
    padding: 8px;
    margin-top: 9px;
    border-radius: 5px;
}