<%
Set Area_cmd = Server.CreateObject ("ADODB.Command")
Area_cmd.ActiveConnection = MM_Loja_STRING
Area_cmd.CommandText = "SELECT * FROM areas Where GrupoId = 2 ORDER BY AreaOrdem ASC" 
Area_cmd.Prepared = true
Set Area = Area_cmd.Execute
%>
    
    <footer class="py-4">
		<div class="container border-bottom border-primary-subtle">
			<div class="row align-items-center text-center">
				<div class="col-md-2 text-lg-start"><a href="<%=Caminho%>"><img src="<%=Caminho%>img/logo-rodape.png" class="img-fluid py-4" style="max-width: 120px;"></a></div>
				<div class="col-md-10">

					<nav>
                        <%while not Area.eof%>
						<a href="<%=(Area.Fields.Item("AreaLink").Value)%>" class="text-decoration-none text-white p-3 d-inline-block link-footer"><%=Area.Fields.Item("AreaNome").Value%></a>
                        <%
					Area.Movenext()
					Wend
					%>
					</nav>
					
				</div>
			</div>
		</div>
		<div class="container text-white" style="font-size: 14px;">
			<div class="instale-app text-lg-start text-center  py-4">
				Instale nosso app: 
				<a href="https://apps.apple.com/us/app/sindicato-seth-rio-preto/id6444872382" target="_blank"><img src="<%=Caminho%>img/icon-apple.png" style="height: 34px;"></a>
				<a href="https://play.google.com/store/apps/details?id=app.sethsaojoseriopreto&pcampaignid=web_share" target="_blank"><img src="<%=Caminho%>img/icon-google-store.png" style="height: 34px;"></a>
			</div>
			<div class=" row align-items-center">
				<div class="col-md-10 py-4">
					Rua Conselheiro Saraiva, 317 | Vila Ercilia | São José do Rio Preto - SP <br>
					Fones: (17) 3203-0077 | Diretor Presidente - Sergio da Silva Paranhos
					<br>
					Whatsapp: <a href="https://api.whatsapp.com/send?phone=5517991134760&text=Olá, vim pelo site!" style="color: #fff;">(17) 99113-4760</a>
				</div>
				<div class="col-md-2 py-4 text-lg-end text-center" style="display: flex;align-items: center;justify-content: center;gap: 10px;">
					<a href="http://instagram.com/sindicatoseth" target="_blank" class="icon-social">
						<i class="fa-brands fa-instagram"></i>
						<!-- <img src="<%=Caminho%>img/icon-instagram-light.png" class="m-1" style="max-width: 30px;"> -->
					</a>
					<a href="https://www.facebook.com/sindicato.seth" target="_blank" class="icon-social">
						<i class="fa-brands fa-facebook-f"></i>
						<!-- <img src="<%=Caminho%>img/icon-facebook-light.png"   class="m-1" style="max-width: 30px;"> -->
					</a>
					<a href="https://www.youtube.com/@sindicatoseth" target="_blank" class="icon-social">
						<i class="fa-brands fa-youtube"></i>
						<!-- <img src="<%=Caminho%>img/icon-youtube-light.png"   class="m-1" style="max-width: 30px;"> -->
					</a>
					<a href="https://x.com/sindicatoseth" target="_blank" class="icon-social">
						<i class="fa-brands fa-x-twitter"></i>
						<!-- <img src="<%=Caminho%>img/icon-linkedin-light.png"   class="m-1" style="max-width: 30px;"> -->
					</a>
					<a href="https://www.tiktok.com/@sindicatoseth" target="_blank" class="icon-social">
						<i class="fa-brands fa-tiktok"></i>
						<!-- <img src="<%=Caminho%>img/icon-linkedin-light.png"   class="m-1" style="max-width: 30px;"> -->
					</a>
				</div>
			</div>

			<div class="row align-items-center">
				<div class="col-md-6 text-lg-start text-center pb-2">Sindicato SETH. Todos os direitos reservados</div>
				<div class="col-md-6 text-lg-end text-center  pb-2">Desenvolvido por <a href="https://www.maquinaweb.com.br" target="_blank"><img src="<%=Caminho%>img/logo-maquinaweb.png" style="max-height: 20px;" class="ps-2"></a></div>
			</div>
		</div>
	</footer>


	<div>
		<a class="whatsapp" style="text-align: center;position: fixed;bottom: 3vh;left: 3vh;padding: 10px;z-index: 10000000;" href="https://api.whatsapp.com/send?phone=5517991134760&text=Olá, vim pelo site!" target="_blank"><img width="50px" src="https://imagepng.org/wp-content/uploads/2017/08/whatsapp-icone-1.png" /><br>
		</a>
	</div>
<div class="modal-cookie" id="politica">
	<div class="conteudo-cookie">
		<h3>Política de Privacidade e Proteção de Dados</h3>
			<p>O Sindicato Seth utiliza cookies, armazenados apenas em caráter temporário, a fim obter estatísticas para aprimorar a experiência do usuário. A navegação no portal implica concordância com esse procedimento, em linha com a <a href="https://www.sindicatoseth.com.br/pagina/143/termos-de-uso-e-politica-de-privacidade">Política de Privacidade e Proteção de Dados Pessoais</a> da entidade.</p>
		<button class="btn mb-2 btn-primary btn-sm" onclick="document.getElementById('politica').style.display = 'none'">Aceitar</button>
	</div>
</div>
<script>
	//CAROUSEL ---------------------------------------------------------
	document.querySelectorAll('[data-carousel]').forEach(carousel => {
		const id = carousel.id;
		const track = carousel.querySelector('.carousel-custom-track');
		const items = carousel.querySelectorAll('.carousel-item-custom');
		const nextBtn = document.querySelector(`#${id}-next`);
		const prevBtn = document.querySelector(`#${id}-prev`);
		let currentIndex = 0;
		let autoplayInterval;
	
		const update = () => {
		const itemWidth = items[0].offsetWidth;
		track.style.transform = `translateX(-${currentIndex * itemWidth}px)`;
		};
	
		const visibleCount = () => {
		const containerWidth = carousel.offsetWidth;
		const itemWidth = items[0].offsetWidth;
		return Math.floor(containerWidth / itemWidth);
		};
	
		const next = () => {
		if (currentIndex < items.length - visibleCount()) {
			currentIndex++;
			update();
		}
		};
	
		const prev = () => {
		if (currentIndex > 0) {
			currentIndex--;
			update();
		}
		};
	
		nextBtn.addEventListener('click', () => {
		next();
		resetAutoplay();
		});
	
		prevBtn.addEventListener('click', () => {
		prev();
		resetAutoplay();
		});
	
		// Autoplay
		const startAutoplay = () => {
		autoplayInterval = setInterval(() => {
			if (currentIndex < items.length - visibleCount()) {
			currentIndex++;
			} else {
			currentIndex = 0; // volta pro início
			}
			update();
		}, 3000); // muda a cada 3 segundos
		};
	
		const resetAutoplay = () => {
		clearInterval(autoplayInterval);
		startAutoplay();
		};
	
		// Swipe - touch support
		let startX = 0;
		let endX = 0;
	
		track.addEventListener('touchstart', e => {
		startX = e.touches[0].clientX;
		});
	
		track.addEventListener('touchmove', e => {
		endX = e.touches[0].clientX;
		});
	
		track.addEventListener('touchend', () => {
		const deltaX = endX - startX;
		if (deltaX > 50) {
			prev();
			resetAutoplay();
		} else if (deltaX < -50) {
			next();
			resetAutoplay();
		}
		});
	
		window.addEventListener('resize', update);
		update();
		//startAutoplay();
	});


	//MODAL SEARCH ----------------------------------------------------
$(document).ready(function () {
  let timer;

  $('#searchModal input[type="text"]').on('input', function () {
    clearTimeout(timer); // debounce

    const query = $(this).val().trim();

    timer = setTimeout(() => {
      $.ajax({
        url: '<%=Caminho%>buscar.php', // coloque aqui sua URL de API
        method: 'GET',
        data: { q: query },
        dataType: 'json',
        success: function (data) {
          $('#search-results').html('');

          const limit = 4;
          const showMore = data.length > limit;

		  if (data.length == 0) {
			$('#search-results').html('<div class="text-center"><p class="text-muted small">Nenhum resultado encontrado</p></div>');
		  }
		  console.log(data);

          data.slice(0, limit).forEach(item => {
            const card = `
              <a href="${item.url}" class="card card-horizontal my-4 text-decoration-none border border-0">
                <div class="row g-0">
                  <div class="col-md-3">
                    <div class="card-img aspect-video">
                        <img src="${item.imagem}" class="img-fluid rounded-start aspect-video" alt="...">
                    </div>
                  </div>
                  <div class="col-md-9">
                    <div class="card-body pt-0">
                      <p class="card-text mb-1">
                        <span class="badge text-bg-default me-2">${item.categoria}</span>
                        <small class="text-body-secondary">${item.data}</small>
                      </p>
                      <h5 class="card-title mt-0 fs-6">${item.titulo}</h5>
                      <p class="card-subtitle">${item.descricao}</p>
                    </div>
                  </div>
                </div>
              </a>`;
            $('#search-results').append(card);
          });

          if (showMore) {
            $('#search-results').append('<div class="text-center"><a href="<%=Caminho%>noticias?Busca='+query+'" class="btn btn-outline-primary btn-sm">Ver mais resultados</a></div>');
          }
        },
        error: function () {
          $('#search-results').html('<p class="text-danger">Erro ao buscar resultados.</p>');
        }
      });
    }, 300); // 300ms debounce
  });
});

</script>
	  
<style>
	.modal-cookie {
		position: fixed;
		bottom: 2rem;
		width: 100%;
		z-index: 1000;
	}
	.conteudo-cookie {
		background-color: #FFF;
		border-radius: 5px;
		box-shadow: 0 3px 5px #494949b4;
		text-align: center;
		width: 720px;
		max-width: 95%;
		margin: 0 auto;
	}
	.conteudo-cookie h3 {
		font-size: 16px;
		padding-top: 10px;
	}
	.conteudo-cookie p {
		padding-left: 10px;
	   	padding-right: 10px;
	   	font-size: 12px;
	   	line-height: initial;
	}
	.conteudo-cookie a {
		font-size: 12px;
	}
	.aceitar-cookie {
		background-color: #004b9c;
		color: white;
		cursor: pointer;
		border: none;
		border-radius: 5px;
		box-shadow: 1px 2px 3px #494949b4;
		margin-bottom: 10px;
		padding: 5px 10px;
		margin-top: 10px;
	}
</style>


</body>
</html>