:root {
	/* carousel */
	--swiper-pagination-color: var(--interactive);
	--swiper-pagination-right: var(--spacing-scale-default);
	--swiper-pagination-bullet-inactive-color: var(--gray-20);
	--swiper-pagination-bullet-opacity: 1;
	--swiper-pagination-bullet-inactive-opacity: 1;
	--swiper-pagination-bullet-size: var(--font-size-scale-down-01);
	--swiper-pagination-bullet-vertical-gap: 60px;
	
	/* Calendario de eventos https://fullcalendar.io/docs/css-customization */
	--fc-small-font-size: .8em;
	--fc-border-color: var(--border-color) !important;
}

/* Aplica o tema de loading quando data-theme="loading" */
.loading-overlay{
	display: none;
}
[data-theme="loading"] .loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(var(--blue-warm-vivid-80-rgb), 0.96); /* azul com transparência */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

[data-theme="loading"] .loading, [data-theme="loading"]  .br-loading {
	--loading-indetermined-color: white;
	--loading-indetermined-diameter-md: 110px;
}

[data-theme="loading"] .loading:not(.br-button).medium::before, [data-theme="loading"] .br-loading:not(.br-button).medium::before {
    border-width: 6px;
}

a {
	word-break: break-word; /* Compatível com navegadores modernos */
}

.introjs-skipbutton {
  color: var(--interactive) !important;
	margin: 5px !important;
	border-radius: 50%;
}

/* Alterar algumas variaveis */
.busca{
	left: 0px;
    overflow-y: auto;
    top: 48px;
}

.pmpc-button-map {
	/* Posicione o botão no meio inferior */
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1000;
	bottom: 1em; /* Ajuste conforme necessário */
}

/* Fundo com gradient */
.bg-gradient-mint-cool {
    background-image: linear-gradient(to bottom, var(--mint-cool-5), var(--pure-0));
}

.film {
	position: relative;
}
.film .container {
	position: relative;
	z-index: 2;
}

/* Fundo com efeito film */
.film-container {
	height: 90px;
	background-image: url('/assets/imagens/film.svg');
	background-repeat: repeat-x;
	animation: move-left 20s linear infinite;
}

.br-upload .br-list .content{
	opacity: 1 !important;
}

 .final-film {
	position: absolute;
	width: 1330px;
	right: 0;
	top: 0;
	height: 100%;
	background-repeat: no-repeat;
	background-color: var(--blue-warm-vivid-80); /* Define a cor do SVG */
	-webkit-mask: url('/assets/imagens/final_film.svg') no-repeat;
	mask: url('/assets/imagens/final_film.svg') no-repeat;
	background-size: cover; /* Ajuste o tamanho conforme necessário */
}
    
@keyframes move-left {
	0% {
		background-position-x:  0, 100px, 200px; /* Posição inicial */
	}
	100% {
		background-position-x: -100%; /* Movendo para a esquerda */
	}
}

.plantio_arvores {
    min-height: 65vh;
    background: 
        linear-gradient(135deg, rgba(var(--mint-cool-vivid-60-rgb), .5), rgba(var(--mint-cool-vivid-70-rgb), .6) 100%),
        url('/assets/imagens/plantio_arvore.jpg');
    
    background-size: cover;
    background-position: center;
		background-attachment: fixed;
}
  

/* Define as variáveis para o carrossel */
.pmpc-carousel {
    --carousel-button-fix-height: 48px; /* Altura fixa do botão */
    --carousel-ratio: 3 / 4; /* Proporção do carrossel */
    --carousel-width: calc(100% + var(--grid-gutter)); /* Largura do carrossel */
    --carousel-margin: 0 calc(var(--grid-gutter) / -2); /* Margem do carrossel */
    height: 0;
    margin: var(--carousel-margin);
    width: var(--carousel-width);
    padding-bottom: calc(100%*var(--carousel-ratio) + var(--carousel-button-fix-height)); /* Espaçamento inferior */
    position: relative;
}

/* Define o posicionamento e tamanho do carrossel */
.pmpc-carousel .br-carousel {
    --carousel-min-height: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Define o posicionamento e tamanho da imagem dentro do carrossel */
.pmpc-carousel .br-carousel[data-stage=hibw]  .carousel-stage .carousel-page .carousel-content img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ajusta a imagem para preencher o espaço disponível */
    object-position: top center; /* Centraliza a imagem no topo */
    position: absolute;
    top: 0;
    left: 0;
}

/* Define o posicionamento e tamanho da imagem dentro do carrossel */
.pmpc-compartilhar {
    top: 5px !important;
    right: 54px !important;
    left: auto !important;
    height: auto !important;
	background: var(--background);
}

/* Define o posicionamento e tamanho e cor dos botões */
.pmpc-carousel .br-carousel[data-stage=hibw] .carousel-button .carousel-btn-next, .pmpc-carousel .br-carousel[data-stage=hibw] .carousel-button .carousel-btn-prev{
	border-radius: 50%;
    margin: 0 1em;
    padding: 0;
    width: var(--button-size);
    height: var(--button-size);
    background: var(--background-light);
}

/* Define o posicionamento e tamanho da div de sobreposição */
.pmpc-overlay {
    position: absolute;
   	background: linear-gradient(to bottom, transparent 35%, rgba(0, 0, 0, .6) 60%, rgba(0, 0, 0, .8) 100%) /* gradiente em 60% da parte inferior */;
}

.pmpc-cards {
    background: transparent linear-gradient(180deg,  rgba(var(--blue-warm-vivid-80-rgb), .7), rgba(var(--blue-warm-vivid-90-rgb), .8) 100%) 0% 0% no-repeat padding-box;
    opacity: .95;
}

a .pmpc-overlay:active,
.pmpc-overlay:hover,
.pmpc-overlay:focus {
    box-shadow: var(--surface-shadow-lg);
}
.pmpc-caption {
    position: absolute;
	right: 1rem; /* Distância da borda direita */
    bottom: 1rem; /* Distância da borda inferior */
    left: 1rem; /* Distância da borda esquerda */
}

/* Define o posicionamento, tamanho e estilo da legenda */
.carousel-title.pmpc-caption {
    right: 10%; /* Distância da borda direita */
    left: 10%; /* Distância da borda esquerda */
}

/* Parallax */
.pmpc-parallax {
    /* The primary image used */
    background: url("../imagens/fundo.webp") !important;
	/* Parallax scrolling effect */
	background-attachment: fixed !important;
	background-position: bottom center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	position: relative; /* Ensures pseudo-element positioning works */
	height: auto; /* Allow height to adjust based on content */

}

/* Adding a secondary image with transparency */
.pmpc-parallax::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-attachment: fixed !important;
	background-repeat: no-repeat !important;
    background: url("../imagens/capa.webp");
	background-position: bottom center !important;
	background-size: cover !important;
    opacity: 0.12; /* Transparency for the secondary image */
    z-index: -1; /* Ensures it stays behind the main content */
	filter: brightness(80%) contrast(105%);
}

.container-setas {
  position: relative; /* Define este container como o ponto de referência para os elementos absolutos */
  width: 100%;
	min-height: 60vh;
	z-index: 1; /* Garante que os filhos que não sejam as setas fiquem acima delas */
}

.container-setas::before {
  content: ''; /* Essencial para que o pseudo-elemento seja renderizado */
  position: absolute;
  width: 65vw;
  top: 9%;
  height: 100%;
  right: 0;
  background-repeat: no-repeat;
  background-color: var(--cyan-40);
  -webkit-mask: url('/assets/imagens/setae.svg') no-repeat;
  mask: url('/assets/imagens/setae.svg') no-repeat;
  background-size: contain;
	z-index: -1; /* Coloca as setas atrás de outros elementos com z-index maior ou igual a 0 */
}

.container-setas::after {
  content: ''; /* Essencial para que o pseudo-elemento seja renderizado */
  position: absolute;
  width: 65vw;
  bottom: 2%;
  height: 100%;
  left: 0;
  background-repeat: no-repeat;
  background-color: var(--cyan-40);
  -webkit-mask: url('/assets/imagens/setae.svg') no-repeat;
  mask: url('/assets/imagens/setae.svg') no-repeat;
  background-size: contain; /* Alterado para "contain" para evitar distorção */
  transform: rotate(180deg);
	z-index: -2;
}
.pmpc-focus {
	outline-color: var(--focus) !important;
  	outline-style: var(--focus-style) !important;
 	outline-offset: -4px !important;
 	outline-width: var(--focus-width) !important;
 	box-shadow : var(--surface-shadow-md), var(--surface-overlay-scrim) 0px 0px 0px 5000px !important;
}
 
.br-button.introjs-disabled{
    cursor: not-allowed;
    opacity: var(--disabled);
}

/*ajuste da busca */
.pmpc-busca {
	top: 50px; min-height: 500px;
}
.pmpc-busca .br-list{
	max-height: initial;
}

/* Define a o maximo de linjas */
.text-corte-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
	padding-bottom: 0px;
}

.text-corte-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
	padding-bottom: 0px;
}

.text-corte-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
	padding-bottom: 0px;
}

.text-corte-4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
	padding-bottom: 0px;
}


/* Define a altura mínima de um elemento como 100% da altura da janela de visualização */
.min-vh-100 {
	min-height: 100vh;
}

/* Quando o elemento pai tem a classe "validar", oculta o elemento de feedback */
.validar .feedback {
	display: none;
	position: absolute;
    top: 100%;
    z-index: 1;
	max-width: 100%;
    margin-top: var(--spacing-scale-half);
}

/* Quando o elemento pai tem a classe "validar", oculta o elemento de feedback com a classe "valido" */
.validar .feedback.valido {
	display: none;
}

/* Quando o elemento pai tem a classe "validar", mostra o elemento de feedback com a classe "invalido" */
.validar .feedback.invalido {
	display: block;
}

/* avatar no topo do site */
.header-avatar .br-sign-in{
	height: auto;
    padding: var(--spacing-scale-half);
}
.header-avatar .br-sign-in .content{
	height: 32px;
	width: 32px;
}
.header-avatar .br-sign-in .content img {
	height: 32px;
	width: 32px;
    max-height: 32px !important;
}

.header-login {
	position: relative;
}

.header-login [data-dropdown]{
	position: absolute;
	z-index: var(--z-index-layer-4);
	min-width: 280px;
	right: 0;
	left: auto;
}

/* select mais alto */
.br-select .br-list {
	z-index: var(--z-index-layer-4);
}
/* Ajustar modal para o index pouco menor que o modal */
.br-scrim-util.foco {
	z-index: var(--z-index-layer-2);
}

.fg-emoji-picker {
  z-index: 9999 !important; /* Ajuste o valor conforme necessário */
}

/* height do wizard */
.br-wizard {
	--wizard-max-height: 100%;
}

/* Personalizar upload */
.br-upload .upload-list .br-item {
	cursor: pointer;
}

.br-upload .upload-list .br-item:hover {
	background-image: linear-gradient(rgba(var(--color-rgb),var(--hover)),rgba(var(--color-rgb),var(--hover))) !important;
}

/* Não mostrar  .header-social-icons quando ancestral tiver .compact */
.br-header.compact .header-social-icons {
	display: none;
}

/* card selecionado */
.br-card.is-selected {
    border: 1px solid var(--blue-warm-vivid-60)!important;
	
	background: var(--blue-10)!important;
}

/* para o editor de texto */
.jodit_theme_gov {
	--jd-color-background-default: var(--bg-color) !important;
	--jd-color-border: var(--border-color) !important;
	--jd-color-panel: var(--background-alternative) !important;
	--jd-color-icon: var(--text-color) !important;
	--jd-border-radius-default: var(--surface-rounder-sm) !important;
}

.validar .danger .jodit_theme_gov {
	--jd-color-border: var(--danger) !important;
    border-width: 2px;
}
.validar .success .jodit_theme_gov {
	--jd-color-border: var(--success) !important;
    border-width: 2px;
}

/* para o carousel */
.swiper {
}
.swiper .carousel-button {
    height: 50%;
	align-items: center;
    display: flex;
    left: unset;
	right: -50px;
	top: 25%;
	width: fit-content;
    position: absolute;
	z-index: var(--z-index-layer-2);
	transition: right var(--duration-fast) cubic-bezier(0.42, 0, 0.58, 1); /* Transição suave */
}

.swiper .carousel-button:first-child{
	left: -50px;
    right: unset;
	transition: var(--duration-fast) cubic-bezier(0.42, 0, 0.58, 1);
}

.swiper .swiper-slide.br-card.destaques {
	min-width: 349px; height: 330px;
}

.swiper .swiper-wrapper.thumbnails {
	height: 330px;
	max-width: 360px
}

.swiper .thumbnails .swiper-slide {
	height: auto !important;
	background: var(--pure-0) !important;

}

.swiper .thumbnails .swiper-slide.swiper-slide-thumb-active {
	height: auto !important;
	background: var(--blue-warm-vivid-10) !important;
}

.swiper .swiper-wrapper.video {
	height: auto;
}

.swiper-pagination-bullet {
	margin-right: 7px !important;
	margin-left: 7px !important
}

.swiper-pagination-bullet:focus-visible {
    outline-color: var(--focus);
    outline-offset: var(--focus-offset);
    outline-style: var(--focus-style);
    outline-width: var(--focus-width);
}

/* Quadros responsivos */
.w-100 {
    width: 100% !important;
}
.h-100 {
    height: 100% !important;
}

.pmpc-ratio {
	position: relative;
    width: 100%;
}

.pmpc-ratio::before {
  display: block;
  padding-top: var(--pmpc-aspect-ratio) !important;
  content: "";
}

.pmpc-ratio>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.pmpc-ratio-1x1 {
 --pmpc-aspect-ratio: 100%;
}

.pmpc-ratio-4x3 {
  --pmpc-aspect-ratio: 75%;
}

.pmpc-ratio-16x9 {
  --pmpc-aspect-ratio: 56.25%;
}

.pmpc-ratio-21x9 {
  --pmpc-aspect-ratio: 42.8571428571%;
}

/*postion */

.position-fixed {
  	position: fixed !important;
}

.position-absolute {
  	position: absolute !important;
}

.translate-middle {
    transform: translate(-50%, -50%) !important;
}
.translate-middle-x {
    transform: translateX(-50%) !important;
}
.translate-middle-y {
    transform: translateY(-50%) !important;
}

.position-relative {
  	position: relative !important;
}

.start-0 {
    left: 0 !important;
}
.start-50 {
    left: 50% !important;
}
.start-100 {
    left: 100% !important;
}
.top-0 {
    top: 0 !important;
}
.top-50 {
    top: 50% !important;
}
.end-0 {
    right: 0 !important;
}
.end-50 {
    right: 50% !important;
}
.bottom-0 {
    bottom: 0 !important;
}
.bottom-50 {
    bottom: 50% !important;
}

/* Deslocar acima */
.pmpc-acima {
	margin-top: -48px !important;
}
/* Deslocar acima */
.pmpc-acima-2x {
	margin-top: -96px !important;
}

/* Rotacionar */
.pmpc-flip-container {
	perspective: 1000px;
}

/* fundo transparent */
.bg-transparent {
	background: transparent !important;
}

.pmpc-flipper {
	transition: var(--duration-moderate);
	transform-style: preserve-3d;

}

.pmpc-flip-container:hover .pmpc-flipper, .pmpc-flip-container.hover .pmpc-flipper {
	transform: rotateY(180deg);
}

.pmpc-front, .pmpc-back {
	backface-visibility: hidden;
	top: 0;
	left: 0;
}

.pmpc-front {
	z-index: var(--z-index-layer-2);
	/* for firefox 31 */
	transform: rotateY(0deg);
}

.pmpc-back {
	position: absolute;
	height: 100%;
	width: 100%;
	transform: rotateY(180deg);
}

.pmpc-video-fundo {
	filter: 
		blur(1px)              /* Suaviza artefatos */
		opacity(0.9)
		saturate(1.3);           /* Intensifica cores */
}

/* Camada de textura granular */
#turismo::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:
  repeating-linear-gradient(
		45deg,
      rgba(var(--blue-vivid-80-rgb),0.3),
      rgba(var(--interactive-rgb),1) 1px,
      transparent 1px,
      transparent 1px
    );
  mix-blend-mode: overlay;
  opacity: 0.9;
  pointer-events: none;
}


/* Fullcalendar */
.fc-toolbar-title::first-letter {
	text-transform: uppercase;
}
.fc .fc-popover {
    z-index: 2;
}

/*contador */
.pmpc-count {
	position: absolute;
    top: -.3em;
    right: -.3em;
    padding: 0.3em;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--danger);
    font-size: var(--font-size-scale-down-02);
    font-weight: var(--font-weight-semi-bold);
    color: var(--pure-0) !important;
    line-height: 1em;
    border-radius: 1em;
    min-width: 1.6em;
    height: 1.6em;
	z-index: 5;
}

/*forçar height auto imagens do testo */
p img {
	height: auto !important;
}

/* Assistente IA */
.assistenteia {
	max-width: 480px;
}
.assistenteia .br-card {
	position: absolute;
	bottom: 70px;
	width: 96vw;
	min-height: 55vh !important;
}
.assistenteia .br-card .card-content{
	overflow-y: auto;
	min-height: 40vh !important;
	max-height: 50vh !important;
}
/*previsão do tempo */

#previsao .disabled > * {
	visibility: hidden;
}

/* google recaptcha */
.grecaptcha-badge {
    bottom: 96px !important;
}

/* Define a altura máxima do elemento de busca em telas com largura mínima de 576px */
@media (min-width: 576px){
	.busca{
		max-height: 50vh;
	}
	.assistenteia .br-card {
		width: 480px;
		max-height: 85vh !important;
	}
}

@media (max-width: 576px){
	.container-setas::before {
		width: 90vw;
	}
	.container-setas::after {
		width: 90vw;
	}
}

/* Define a altura máxima do elemento de busca em telas com largura máxima de 991.98px */
@media (max-width: 991.98px) {
	.swiper .swiper-slide.br-card.destaques {
		min-width: 305px;
	}
	.swiper .swiper-wrapper.thumbnails {
		height: 190px;
	}
	.swiper .swiper-wrapper.thumbnails a{
		height: 100%;
	}
	.swiper .thumbnails .swiper-slide {
		max-width: 160px !important;
	}
	.swiper .thumbnails .swiper-slide {
		min-width: 160px !important;
	}
	.swiper .swiper-wrapper.thumbnails {
		max-width: 100%;
	}
	
	/* Fundo com efeito film */
	.film-container {
		height: 75px;
		animation: move-left 8s linear infinite;
	}

	.container-setas::before {
		width: 75vw;
		top: 18%;
	}

	.container-setas::after {
		width: 75vw;
	}
}

/* Define a altura máxima do elemento de busca em telas com largura máxima de 767.98px */
@media (max-width: 767.98px) {
	.swiper .swiper-slide {
		min-width: 300px; 
	}
	.pmpc-acima-2x {
		margin-top: -76px !important;
	}

	/* Fundo com efeito film */
	.film-container {
		height: 60x;
		animation: move-left 6s linear infinite;
	}
	
	/* largura da modal em telas pequenas */
	.br-modal {
		min-width: 90%;
	}
}


/* Define a proporção, largura e margem do carrossel em telas com largura mínima de 992px */
@media (min-width: 992px){
	.pmpc-carousel {
		--carousel-ratio: 9 / 16; /* Proporção do carrossel */
		--carousel-width: 100%; /* Largura do carrossel */
		--carousel-margin: 0; /* Margem do carrossel */
	}
	.swiper:hover .carousel-button {
		right: 0;
	}
	.swiper:hover .carousel-button:first-child {
		left: 0;
	}
}

/* Define a proporção do carrossel em telas com largura mínima de 1280px */
@media (min-width: 1280px){
	.pmpc-carousel {
		--carousel-ratio: 1 / 3; /* Proporção do carrossel */
	}
}

@media (max-width: 1600px){
	.container-setas::before {
		width: 70vw;
		top: 14%;
	}

	.container-setas::after {
		width: 70vw;
	}
	.pmpc-carousel {
		--carousel-ratio: 1 / 3; /* Proporção do carrossel */
	}
}


/* Adequar a logo da prefeitura */
#footer {
	--footer-logo-height: 60px !important;
	--footer-logo-width: 200px !important;
}