.fontSite {
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #8897AE;
}

.mt-filters {
	width: 100%;
	background-color: #FAFAFA;
	
  	display:grid;
  	grid-template-columns:75% 25%;
	position: relative;
}

.fullscreen-active #mt-filters {
    display: none !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

/* class para ocultar e mostrar div em vez de alterar diretamente a propriedade 'dispaly'  para manter layout intacto como
  no caso da ocultução da div #mt-filters */
.esconde {
	display: none;
}


#mt-d-esquerda {
	width: 25%;
	height:480px;
	float: left;
	background-color: #FAFAFA; /* green;*/
	border-top: solid 1px #D7DFE9;
	border-bottom: solid 1px #D7DFE9;
	border-left: solid 1px #D7DFE9;

	display: flex;
    flex-direction: column;
	font-family: "Poppins", sans-serif;
  	font-size: 14px;
  	font-weight: 400;
  	color: #8897AE;
}
#mt-d-esq-header {
    height: 45px; 
    overflow: hidden; /* Oculta o conteúdo que excede a altura */
    text-overflow: ellipsis; /* Adiciona ellipsis ao texto que excede a largura */
    white-space: nowrap; /* Impede a quebra de linha */
    padding: 10px;
	color: #2D3643;
	background-color: #FAFAFA;
}

#mt-d-esq-content {
    flex: 1; /* Ocupa o restante da altura */
    overflow-y: auto;  /* Adiciona scroll vertical */

}
/* restantes estilos do  #mt-d-esq-content antes da introdução da livraria malihu custom scrollbar plugin
#mt-d-esq-content {
    scrollbar-width: thin;  Define a largura do scroll como fina 
    scrollbar-color: #999 transparent; Define a cor do thumb do scroll e o background 
}
#mt-d-esq-content::-webkit-scrollbar {
    width: 5px; largura do scroll 
}
#mt-d-esq-content::-webkit-scrollbar-thumb {
    background-color: #999; cor do thumb do scroll 
    border-radius: 10px; raio de borda do thumb do scroll 
}
*/

/* sobrepor estilos da livraria malihu custom scrollbar */
._mCS_7 .mCSB_dragger .mCSB_dragger_bar{ 
	width: 8px; 
	height:120px; 
}
.mCSB_inside>.mCSB_container {
	margin-right:16px;
}
.mCSB_scrollTools .mCSB_draggerRail {
	height: auto !important;
}

._mCS_6> .mCSB_horizontal.mCSB_inside > .mCSB_container {
	margin-bottom: 16px;
  }
/* sobrepor estilos da livraria malihu */

#mt-d-direita {
	width: 75%;
	float: right;
	display: flex; 
}

#mt-bs-content {
	overflow-y: auto !important;
	z-index:870;
	position: fixed;
	height: 31px;
	bottom: 78px;
}

#mt-d-esq-content ul,
#mt-bs-content ul {   /* #mt-bs-content -> div deslizante mobile */
	font-size: 1.3rem;
	margin-top: 0;
	padding-left: 0;
}
#mt-d-esq-content ul { margin-left: 1rem;}
#mt-bs-content ul { margin-left: 0;}
/* #mt-d-esq-content ul li,
#mt-bs-content ul li,
.mt-ul-m-container ul li {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	padding-left: 0;
	padding: 5px 0 5px 0;
	line-height: 1.2; 
    margin-bottom: 1rem;
	color: #1C222B;
	cursor: pointer;
} */
/* #mt-d-esq-content ul li br,
#mt-bs-content ul li br {
    line-height: 0.8; 
}
#mt-d-esq-content ul li span,
#mt-bs-content ul li span,
.mt-ul-m-container ul li span {
	color: #8897AE;
	font-weight: 600;
}
#mt-d-esq-content ul li:hover {
	background-color: #e9e9e9;
} */
/*
  estilo para a tooltip dos itens da lista (ver função  renderizaListaDeCondicionamentos() no transito.utilities.js
#mt-d-esq-content ul li:hover::after {
	content: attr(data-tooltip);
	position: absolute;
	left: 0;
	top: 100%;
	white-space: normal;
	background-color: rgba(0, 0, 0, 0.95);
	color: #fff;
	padding: 0.5rem;
	border-radius: 0.3rem;
	z-index: 9999;
	width: auto;
	max-width: 300px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	margin-top: 0.5rem;
}
*/
.mt-ls-dtCondicionamento{
	font-weight: 700;
}

#bottomSheet {
	/*height: 80px;*/  height: 100px;
		transition: height 0.5s ease-out;
		position: fixed;
		left:0;
		bottom: 78px;  
		width: 100%;
		background-color: white; 
		z-index: 860;
	border-radius: 20px 20px 0 0;
}
#mt-bs-header {
	display: flex;
	justify-content: center;
	padding-top: 25px; 
	padding-bottom: 15px;
							height:44px;
}
.mt-bs-body {
	overflow-y: auto;
			/*height: 56px;*/
	/*scrollbar-width: none;*/
	padding: 0 10px 0 10px;
	display:flex;
	flex-direction: column;
}
#mt-bs-title {
	color: #1b1b1b;
	height:25px;
	
}
.mt-bs-drag-icon {
	cursor: grab;
  	user-select: none;
  	padding: 15px;
  	margin-top: -15px;
}
.mt-bs-drag-icon span {
	height: 4px;
	width: 40px;
  	display: block;
  	background: #C7D0E1;
 	border-radius: 50px;
}


@media (max-width: 600px) {
	/*#mt-filters {
	  display: none;
	}*/
   
	#mt-d-esquerda {
	  display: none;
	}
   
	#mt-d-direita {
	  width: 100%;
	}

	#mt-btn-toggleList {
		display: none;
	}
	
	/* Oculta a div#bottomSheet abaixo de 600px */
	#bottomSheet {
		display: none;
	}

	/* posicionar no fundo do écran a cena de links do Leaflet, Esri, etc */
	.leaflet-control-attribution {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: #fff; 
		z-index: 1000; 
	}	
}

/* Estilos para dispositivos desktop (largura da tela maior que 768px) */
@media screen and (min-width: 768px) {
    /* Oculta a div#bottomSheet acima de 768px */
	#bottomSheet {
        display: none; /* Oculta a div #bottomSheet em dispositivos desktop */
    }
}

/* Oculta a div#bottomSheet entre 600px e 768px */
@media (min-width: 601px) and (max-width: 767px) {
    #bottomSheet {
        display: none;
    }
}

.mt-filters-pesquisa {
    padding: 11px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #D7DFE9;
    background-color: #FFFFFF;
    height: 48px;
    width: 380px; /* Ajuste a largura conforme necessário */
    position: relative; /* Adicionado para posicionamento relativo do autocomplete */
}

.mt-filters-pesquisa input {
    background-color: transparent;
    border: 0;
    outline: 0;
    padding: 0;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #8897AE;
    flex-grow: 1;
    margin-right: 8px; /* Espaço entre o input e os botões */
}

.mt-rua-reset {
    padding: 8px;
    border-width: 1px 0;
    background-color: #FFFFFF;
    border-radius: 0;
}

#btnRua {
    background-color: transparent;
    outline: 0;
    border: 0;
    padding: 0;
}

/* estilos do autocomplete */
.autocomplete-items {
    position: absolute;
    top: 48px; /* abaixo da .mt-filters-pesquisa */
    left: 0;
    right: 0;
    background-color: #ffffff;
    border: 1px solid #d4d4d4;
    z-index: 88888;
    max-height: 200px; 
    overflow-y: auto; 
}
.autocomplete-items div {
    padding: 5px 10px 5px 10px;
    cursor: pointer;
	background-color: #fff; 
	border-bottom: 1px solid #d4d4d4; 
	z-index: 88888;
	position: relative;
	font-size: 14px;
  	font-weight: 400;
	
	bottom: 100%;
}
.autocomplete-items div:hover {
    background-color: #e9e9e9;
}
.autocomplete-active {
	background-color: #e9e9e9 !important; 
	/*
	background-color:  DodgerBlue !important; 
	color: #ffffff; */
}


@media (max-width: 768px) {
    .mt-filters-pesquisa {
        width: 100%; 
    }
	.autocomplete-items div {
		padding: 10px;
	}
}
/* fim estilos do autocomplete */

/*#mt-btn-filters {
	border: 1px solid #1C222B;
	width: 40px;
    height: 40px;
    background-image: url("../Icons/filter_list.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    padding: 0;
    position: relative;
}
*/
#mt-btn-filters {
	border: 1px solid #1C222B;
	background-color: white; 
	color: black; 
	transition: background-color 0.3s ease; /* Transição suave para a mudança de cor de fundo */
	padding:12px 16px;
	/*font-family: "Poppins", sans-serif;*/
	font-family: inherit;
  	font-size: 14px;
  	font-weight: 400;
  	color: #1C222B;
	  position: relative; /* necessário para o posicionamento do badge */
}
#mt-btn-filters.active {
	background-color: black; /* Fundo preto quando ativo */
	color: white; 
}
.mt-filter-icon, .mt-close-icon {
	opacity: 1; /* Ícone inicialmente visível */
	transition: opacity 0.3s ease; /* Transição suave para a mudança de opacidade */
}
#mt-btn-filters.active .mt-filter-icon {
	opacity: 0; /* Ícone de filtro escondido quando o botão está ativo */
}
#mt-btn-filters.active .mt-close-icon {
	opacity: 1; /* Ícone de fechamento visível quando o botão está ativo */
}
@media screen and (max-width: 800px) {
	#mt-btn-filters span {
		display:none;
	}
}

.mt-filters-more {
	text-align: right;
}
.mt-filters-more button.btn {
    display: inline-block; /* ou display: inline; */
}

#mt-d-esquerda,
#mt-d-direita
{
	margin-top: 16px;
}

#mt-collapse-filters {
	transition: all 0.2s ease-in-out;
	
	&:not(.show)
	{
		overflow: hidden;
		height: 0;
	}

	&.show
	{
		height: fit-content;
	}

	.card.card-body
	{
		border: none;
		padding-bottom: unset;
	}
}

#map {
	height:480px;
	width: 100%;
	flex-grow: 1;
}
@media (max-width: 768px) {
    #map {
        height: calc(100vh - 250px);
    }
}


#mt-btn-toggleList { 
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1000; /* Este valor deve ser maior do que o z-index do mapa */
	border: 1px solid #1C222B;
  	width: 40px;
  height: 40px;
  background-image: url("../Icons/arrow_left_24.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-color: white;
}

#mt-btn-toggleList.toggled {
	background-image: url("../Icons/arrow_right_24.svg"); 
}


#mobile-mt-filters{
	display: none;
	height:78px;
		position: fixed;
		bottom: 0;
		width: 100%;
		background-color: black; 
		overflow: auto;
		left:0;
		z-index: 900;
	position: fixed;
}
/* -----  Estilos -> MOBILE  botões Sair Mapa e Filtros ---------------------------------------  */
.mobile-mt-buttons-container {
    display: grid;
    grid-template-columns: auto auto;
    padding-top: 10px; 
	padding-left: 12px; 
	padding-right: 12px;
}

.mobile-mt-button-exitmap, .mobile-mt-button-filters {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border: solid 1px #000;
    background-color: #fff; /* Cor de fundo dos botões */
    color: #000; /* Cor do texto dos botões */
    font-size: 14px; /* Tamanho da fonte dos botões */
	gap:12px;
	width: 130px;
}

.mobile-mt-button-exitmap {
    justify-self: start; /* Alinhar à esquerda */
}

.mobile-mt-button-filters {
    justify-self: end; /* Alinhar à direita */
}
.mobile-mt-spa-filters {
	height: 20px;
	width: 20px;
	float: left;
	background-image: url("../Icons/filter_list.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 22px 22px;
}
/* -----  FIm de estilos -> mobile  botões "Sair do Mapa" e "Filtros" ---------------------------------------  */
/* -----  Estilos -> MOBILE  div overlay que contêm os filtros, acionada pelo botão "Filtros" ----------------- */
.mt-mobile-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #FAFAFA; /* rgba(0, 0, 0, 0.5);  Cor de fundo com transparência */
    z-index: 1000; /* Coloca a div por cima de todos os outros elementos */
    /*overflow-y: auto;  Adiciona rolagem vertical quando necessário */
    /*display: flex;*/
    flex-direction: column; /* Adiciona um layout de coluna */
}

.mt-overlay-header { /*  .mt-overlay-header, .mt-overlay-footer {   antes tinhamos os mesmos estilos no haeder e footer */
    flex: 0 0 auto; /* Tamanho fixo */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    background-color: #ddd; /* Cor de fundo para as linhas superior e inferior */
}
.mt-overlay-footer {
	flex: 0 0 auto; /* Tamanho fixo */
    display: flex;
    justify-content: space-between;
    align-items: center;
	padding: 10px 10px 20px 18px;
	background-color: #FAFAFA;
}

.mt-overlay-title {
    font-weight: bold;
}

.mt-overlay-close-button, .mt-overlay-apply-button, .mt-overlay-reset-button {
    border: none;
    background: none;
    cursor: pointer;
    font-size: 20px;
}
/* replicar estilos da casa */
.mt-overlay-apply-button, .mt-apply {
	outline: 0;
  border: 1px solid #1C222B;
  background-color: #FAFAFA;
  margin: 0;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: #1C222B;
  /*transition: all 0.2s ease-in-out;*/
  width: fit-content;
  justify-content: center;
}
.mt-overlay-reset-button, .mt-reset-button {
	outline: 0;
  background-color: #FAFAFA;
  margin: 0;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: #1C222B;
  width: fit-content;
  justify-content: center;
  border: none;
}
.mt-overlay-reset-button::before, .mt-reset-button::before {
	content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-image: url("../Icons/filter_remove.svg");
}


@media screen and (max-width: 800px) {
	.mt-overlay-apply-button, .mt-apply {
		margin-top: 18px;
	}
	.mt-overlay-reset-button, .mt-reset-button {
		margin-top: 18px;
	}
}

.mt-overlay-content {
    flex: 1 1 auto; /* Cresce para ocupar o espaço restante */
    padding: 10px;
    overflow-y: auto; /* Adiciona rolagem vertical quando necessário */
	display: flex; 
    flex-direction: column; 
    gap: 20px; 
}
/*   -------------------------------   */

.mt-bg-fa{
	background: #FAFAFA;
}

#divSelTinpD {
	gap:14px;
}

/* sobrepor class da livraria select2 */
/* colocar seta invertida na select list dos tipos de condicionamentos*/
/*                julho 2024 - por agora vamos deixar a select2 de fora
.select2-container .select2-search--inline:after {
    content: "\25BE";  Código da seta invertida 
    position: absolute;
    top: 50%;
    right: 6px;  ajustar conforme necessário 
    transform: translateY(-50%);
    pointer-events: none;  Impede que a seta seja clicável 
    color: #000;  Cor da seta 
}

.select2-container .select2-dropdown {
    max-height: 200px;  ou o valor adequado para garantir que todas as opções sejam visíveis 
}

.select2-container--default .select2-selection--multiple {
	background-color: white;
	border: 1px solid #1C222B!important;
	border-radius: 0;  Define os cantos retos 
	cursor: text;
	padding-bottom: 5px;
	padding-right: 5px;
	position: relative;
	min-height:48px;
}

.select2-container .select2-search--inline .select2-search__field {
	padding-top:5px;
	padding-bottom: 25px;
	font-family: "Poppins", sans-serif;
  	font-size: 14px;
  	font-weight: 400;
  	color: #8897AE;
}
.select2-selection__choice__display, .select2-results__option {
	font-family: "Poppins", sans-serif;
  	font-size: 14px;
  	font-weight: 400;
  	color: #8897AE;
}

.select2-container {
    max-width: 580px;
}

@media (max-width: 768px) {
}

@media (max-width: 991px) {
}

@media (min-width: 992px) {
	.select2-container {
        max-width: 600px;
    }
}
*/

#selTCondiconamento {
	outline: 0;
	padding: 11px 16px;
	border: 1px solid #D7DFE9;
	background-color: #FFFFFF;
	font-size: 14px;
	font-weight: 400;
	line-height: 21px;
	color: #8897AE;
	background-repeat: no-repeat;
	background-position-x: calc(100% - 16px);
	background-position-y: 50%;
	appearance: none;
	background-image: url('../../../_assets/fbd086277289c830376535e37e006784/Icons/chevron_down_24.svg');
	width: 300px;
}

/* replicar estilos do site na caixa da DatePicker */
.calendar-input {
	background-image: url('../../../_assets/fbd086277289c830376535e37e006784/Icons/icon_calendario.svg');
}
.custom-input {
	outline: 0;
  padding: 11px 16px;
  border: 1px solid #D7DFE9;
  background-color: #FFFFFF;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: #8897AE;
  background-repeat: no-repeat;
  background-position-x: calc(100% - 16px);
  background-position-y: 50%;
  width: 260px;
}
@media (max-width: 768px) {
	.custom-input {
		width:100%;
	}
	#selTCondiconamento {
		width:100%;
	}
}
.datepicker-section .datepicker {
	top: 46px !important;
}

#inpDataContainer div.datepicker-dropdown {
    z-index: 9999 !important;
}
/* fim de replicar estilos do site na caixa da DatePicker */

/* sobrescrever class da livraria bootstrap-datepicker.css */
.datepicker-dropdown:before {
	content: '';
	display: none !important;
}
.datepicker-dropdown:after {
	content: '';
	display: none !important;
}

.datepicker table tr td.today, .datepicker table tr td.today:hover, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover {
	background-color: var(--bs-dropdown-bg) !important;
	background-image: none !important;
	color: #1C222B !important;
}

.datepicker-section .datepicker table tr td.active {
    background-image: none !important;
    background-color: #1C222B !important;
    color: #FAFAFA !important;
}

/* fim de sobrepor class da livraria bootstrap-datepicker.css */


/* sobrepor aos estilos do site uma classe do leaflet sobreposta... */
.leaflet-popup-content-wrapper {
	background: white !important;
	color: #333 !important;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4) !important;
	border: none !important;
	border-radius: 0;
}
.leaflet-popup-tip {
	background: white !important;
	color: #333 !important;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4) !important;
	border: none !important;
}
.leaflet-touch .leaflet-bar a {
	line-height: 40px !important;
  }

/* Estilização da infobox com a rolagem do titulo em mobile... */
/*.road-cut-popup {
	display: flex;
	flex-direction: column;
	gap: 12px;
	overflow: hidden;
}*/
.road-cut-popup .road-cut-address p {
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    margin: 0;
    color: #1C222B;
}

.road-container {
	overflow-y: auto;
	max-height: 206px;
}
/* estilos aplicados apenas no Firefox */
@supports (-moz-appearance: none) {
    .road-container {
        scrollbar-width: thin; 
        scrollbar-color: #999 transparent; 
		overflow-x: hidden;
    }
}


/* estilos para dispositivos móveis do nome da rua na infobox, etc */
@media only screen and (max-width: 768px) {
	.road-container {
		max-height: 120px;
	}
}

/* estilos para desktop - scroll horizontal no nome da rua */
@media only screen and (min-width: 769px) {
	.road-cut-popup .road-cut-address p::-webkit-scrollbar-thumb {
        background-color: #1C222B; 
        border-radius: 10px; 
    }

    .road-cut-popup .road-cut-address p::-webkit-scrollbar-track {
        background-color: #f1f1f1; 
    }

	.road-cut-popup .road-cut-address p::-webkit-scrollbar-thumb {
		border-radius: 20px;
	}
}
/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ */

.road-cut-address {
	display: flex !important;
	align-items: center !important;
	gap: 4px !important;
}
  
.custom-scrollbar-lib {max-width: 230px;overflow-x: auto;white-space: nowrap;}

.scroll-container {
	flex: 1;
}

@media (max-width: 600px) {
	.scroll-container {
		overflow: hidden;
		white-space: nowrap;
	}

	.road-cut-address p::-webkit-scrollbar {
		display: none; 
	}
}

.infobox-periodos-container {
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #999;
}
.infobox-periodos-container-height {
    height: 190px;
    min-width: 250px;
}

.leaflet-bar {
	border-radius: 0;
}
.leaflet-touch .leaflet-bar a {
	width: 40px !important;
	height: 40px !important;
}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar {
	border: 1px solid #1C222B;
}

/* 
    espécie de sobreposição de "road-cut-date" (estilização da infobox)
*/
.road-cut-date-2 {
    padding-top:12px;
    display:flex;
    gap:12px
  }
.road-cut-date-2 .start-date,
.road-cut-date-2 .end-date {
    display:flex;
    flex-direction:column;
    gap:4px
  }
.road-cut-date-2 .start-date .label,
.road-cut-date-2 .end-date .label {
    font-size:12px;
    font-weight:500;
    line-height:18px;
    color:#5E718D;
    margin:0;
    text-transform:uppercase
}
.road-cut-date-2 .start-date .date,
.road-cut-date-2 .start-date .time,
.road-cut-date-2 .end-date .date,
.road-cut-date-2 .end-date .time {
    display:flex;
    align-items:center;
    gap:4px
}
.road-cut-date-2 .start-date .date p,
.road-cut-date-2 .start-date .time p,
.road-cut-date-2 .end-date .date p,
.road-cut-date-2 .end-date .time p {
  font-size:14px;
  font-weight:400;
  line-height:20px;
  color:#1C222B;
  margin:0
}

/* ***** estilos da Lista mobile adjacente ao mapa ***** */
/* ocultar o botão e a lista no modo desktop */
@media (min-width: 601px) {
    #mt-mobile-feature-list-container {
        display: none; 
    }
}

#mt-mobile-feature-list-container {
    position: relative;
    width: 100%;
    margin-top: 10px; /* espaçamento abaixo do mapa */
    z-index: 9;
    background-color: transparent;
}

/* Quando o container NÃO tem a classe 'expanded' (lista colapsada) */
#mt-mobile-feature-list-container:not(.expanded) {
    pointer-events: none;
}

/* O botão e a lista (quando expandida) devem receber eventos normalmente */
#mt-mobile-feature-list-container:not(.expanded) button,
#mt-mobile-feature-list-container.expanded,
#mt-mobile-feature-list-container.expanded * {
    pointer-events: auto;
}

/* botão de toggle visível no modo mobile */
#btnToggleListaMobileNFS {
    width: 100%;
    padding: 10px;
    background-color: white;
	border: 1px solid #D7DFE9;
    text-align: center;
    cursor: pointer;
    z-index: 1001;
    position: relative; /* relativamente ao container; para manter o botão abaixo do mapa */
    top: 0; /* inicialmente no topo do container, mas abaixo do mapa */
}

/* inicialmente a lista está colapsada  */
#mt-mobile-feature-list {
    display: none; 
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: white;
    overflow-y: auto; 
    border-top: 1px solid #ccc;
    padding: 10px;
    z-index: 999;
}

#mt-mobile-feature-list.expanded {
    display: block; 
    position: absolute; /* fixa em relação ao botão */
    /* OU Oi  overflow-y: scroll;*/ 
}

#mt-feature-list-mobile-not-fullscreen {
	max-height: 255px;
	min-height: 55px;
}
#mt-feature-list-mobile-not-fullscreen li {
	color: #1C222B;
}

#mt-lst-header {
	height:30px;
}
.mt-ul-m-container {
	overflow-y: scroll;
	padding: 0; 
}
.mt-ul-m-container ul {
	margin-left: 0;
	padding-left: 0; 
	font-size: 1.3rem;
}
.mt-ul-m-container ul li {
	margin-left: 0;
}

.mt-badge-filtro{
	position: absolute;
	top: 4px; 
	right: 4px; 
	width: 8px;
	height: 8px;
	background-color: #3C87C8;
	border-radius: 50%;
	display: none; /*inline-block;*/
	z-index: 10; /* garantir que a badge fica acima dos outros elementos */
}
.mt-badge-filtro-mobile {
	position: absolute;
	top: 16px; 
	right: 18px; 
	width: 8px;
	height: 8px;
	background-color: #3C87C8;
	border-radius: 50%;
	display: none; 
	z-index: 10; 
}

.mt-notificacoes-container {
	position: absolute;
	bottom: 10px;
	left: 10px;
	right: 10px;
	z-index: 988;
}

.mt-notificacoes-container div {
	font-family: "Poppins", sans-serif;
	font-size: 1.3rem;
  	font-weight: 400;
  	color:#1C222B;
}
.mt-notificacoes-container div.alert-warning {
	background-color: white;
}

.mt-facebook,
.mt-twitter
{
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	min-width: 16px;
	min-height: 16px;
	background-size: 16px;
	background-repeat: no-repeat;
}

.mt-facebook {
	background-image: url("../../../../_assets/fbd086277289c830376535e37e006784/Icons/facebook.svg");
}

.mt-twitter {
	background-image: url("../../../../_assets/fbd086277289c830376535e37e006784/Icons/twitter.svg");
}

.mt-icon-container {
	border-top: 1px solid #D7DFE9;
  	padding-top: 12px;
    display: flex;              
    justify-content: flex-end;   /* alinha os itens à direita */
    gap: 20px;                   
}

.mt-icon-container a {
    display: inline-flex;        
    align-items: center;         /* alinha os ícones verticalmente ao centro */
}

.leaflet-popup .leaflet-popup-content-wrapper:has(.road-cut-popup.condicionamento)
{
	max-height: 380px;
	/*overflow-y: auto;*/

	/* .road-cut-address
	{
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	} */

	/* substitui isto pelo jQuery Custom Scollbar*/
	.scroll-container p
	{
		-webkit-line-clamp: unset;
		-webkit-box-orient: unset;
		overflow: unset;
		text-overflow: unset;
		overflow-x: auto;
		max-width: 272px;
		display: block;
		white-space: nowrap;
	}
}

/* sobrepor regra que algures está a escangalhar tudo... */
.leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content {
	max-height: none;
}

.info-conditioning
{
	padding: 8px 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	
	&:not(:last-of-type)
	{
		border-bottom: 0.5px solid #8897AE;
	}

	.impact-address
	{
		color: #1C222B;
		font-size: 14px;
		line-height: 20px;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		margin: 0;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	
	p:not(.impact-address)
	{
		padding: 2px 4px;
		width: fit-content;
		border-radius: 4px;
		background-color: #8897AE;
		font-size: 12px;
		line-height: 16px;
		margin: 0;
		color: #1C222B;

		&.impact-relevante
		{
			background-color: #ca4944;
			color: #FFF;
		}

		&.impact-pouco-relevante
		{
			background-color: #e2c000;
			color: #FFF;
		}

		/* cores de acordo com as linhas no mapa */
		&.impact-corte-total {
			background-color: #cd0d07;
			color: #FFF;
		}
		&.impact-corte-temp {
			background-color: #ca4944;
			color: #FFF;
		}
		&.impact-via-estreita {
			background-color: #fdcd87;
			color: #FFF;
		}
		&.impact-default {
			background-color: #e2c000;
			color: #FFF;
		}
	}
}

.section
{
	@media screen and (max-width: 600px) 
	{
		&:has(.leaflet-fullscreen-on) #mt-collapse-filters.show
		{
			height: 0;
			overflow: hidden;
		}
	}
}


#modalSemDados .modal-content {
    border-radius: 0 !important;
    border: 2px solid black !important;
    background-color: #000 !important;
    color: #fff !important;
	padding: 40px;
}

#modalSemDados {
	top: 150px;
}

/* ====================  */
#mt-container {
    position: relative;
    z-index: 0; /* cria stacking context */
}

/* Overlay que cobre apenas o mt-container */
#avisoSemDados.overlay-sem-dados {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /*height: 100%;*/
    background: rgba(0,0,0,0.65);
    display: none;
    z-index: 99999; /* acima de tudo dentro do container */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer; /* permite clicar fora para fechar */
}

/* Caixa interna */
#avisoSemDados .overlay-box {
    background: #fff;
    color: #000;
    padding: 25px 35px;
    border: 2px solid #000;
    border-radius: 0;
    max-width: 400px;
    text-align: center;
    position: relative;
    cursor: auto; /* evita fechar ao clicar dentro */
}

/* Botão de fechar */
#avisoSemDados .overlay-close {
    position: absolute;
    top: 5px;
    right: 10px;
    background: none;
    border: none;
    font-size: 26px;
    cursor: pointer;
    color: #000;
}






