const hamburger = document.querySelector('.hamburger');
const mobileMenu = document.querySelector('.mobile-menu');

const year = document.getElementById('year');
const currentYear = new Date().getFullYear();
year.textContent = currentYear;

hamburger.addEventListener('click', () => {
    mobileMenu.classList.toggle('active');
});


window.addEventListener('resize', () => {
    if (window.innerWidth > 1300) {
        mobileMenu.classList.remove('active');
    }
});

// ---------------- del carrusel ----------------
let index = 0;

function showSlide(n) {
    const slides = document.querySelectorAll('.slide');
    if (n >= slides.length) index = 0;
    if (n < 0) index = slides.length - 1;

    const newTransformValue = -index * 100 + '%';
    document.querySelector('.slider-container').style.transform = `translateX(${newTransformValue})`;
}

function moveSlide(step) {
    showSlide(index += step);
}

showSlide(index);
setInterval(() => moveSlide(1), 8000);


window.onscroll = function () {
    let scrollBtn = document.getElementById("scrollToTopBtn");
    if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
        scrollBtn.style.display = "block";
    } else {
        scrollBtn.style.display = "none";
    }
};

function scrollToTop() {
    window.scrollTo({ top: 0, behavior: 'smooth' });
}

// carrusel de personas
const carouselTrack = document.querySelector('.carousel-track');
const cards = document.querySelectorAll('.card-car');
const prevBtn = document.getElementById('prevBtn');
const nextBtn = document.getElementById('nextBtn');

let currentIndex = 0;
const totalCards = cards.length;
movePercent = 100 / totalCards;

function showCard(index) {
    carouselTrack.style.transform = `translateX(${-index * movePercent}%)`;
}

prevBtn.addEventListener('click', () => {
    currentIndex = (currentIndex > 0) ? currentIndex - 1 : totalCards - 1;
    showCard(currentIndex);
});

nextBtn.addEventListener('click', () => {
    currentIndex = (currentIndex < totalCards - 1) ? currentIndex + 1 : 0;
    showCard(currentIndex);
});

// setInterval(() => {
//     currentIndex = (currentIndex < totalCards - 1) ? currentIndex + 1 : 0;
//     showCard(currentIndex);
// }, 5000);


const bubble = document.querySelector('.bubble');
const img = new Image();
img.src = '../img/pensamiento.png'; // Ruta de tu imagen

img.onload = function () {
    bubble.style.width = img.width + 'px';
    bubble.style.height = img.height + 'px';
};