document.addEventListener('DOMContentLoaded', () => {
  const grid = document.getElementById('reviewsGrid');
  const ratingEl = document.getElementById('reviewsRatingValue');
  const countEl = document.getElementById('reviewsCountValue');
  const reviews = Array.isArray(window.REVIEW_ROTATION_DATA)
    ? window.REVIEW_ROTATION_DATA.filter(item => item && item.text)
    : [];

  if (!grid || reviews.length === 0) {
    return;
  }

  const buildCard = (review) => {
    const article = document.createElement('article');
    article.className = 'review-card';
    const text = document.createElement('p');
    text.textContent = `"${review.text}"`;
    const author = document.createElement('p');
    author.className = 'review-author';
    author.textContent = `— ${review.author || 'Happy Client'}`;
    article.appendChild(text);
    article.appendChild(author);
    return article;
  };

  const fadeSwap = (cards) => {
    grid.classList.add('is-fading');
    setTimeout(() => {
      grid.innerHTML = '';
      cards.forEach(card => grid.appendChild(card));
      requestAnimationFrame(() => {
        grid.classList.remove('is-fading');
      });
    }, 350);
  };

  const startRotation = () => {
    let index = 0;
    let expandedCard = null;
    let rotationTimer = null;
    const rotationIntervalMs = 8000;
    const expandedHoldMs = 15000;

    const showNext = () => {
      const slice = reviews.slice(index, index + 3);
      const display = slice.length < 3
        ? slice.concat(reviews.slice(0, Math.max(0, 3 - slice.length)))
        : slice;
      fadeSwap(display.map(buildCard));
      index = (index + 3) % reviews.length;
    };

    const scheduleNext = (delay) => {
      if (rotationTimer) {
        clearTimeout(rotationTimer);
      }
      rotationTimer = setTimeout(showNext, delay);
    };

    grid.addEventListener('click', (event) => {
      const card = event.target.closest('.review-card');
      if (!card) return;
      if (expandedCard && expandedCard !== card) {
        expandedCard.classList.remove('is-expanded');
      }
      card.classList.toggle('is-expanded');
      expandedCard = card.classList.contains('is-expanded') ? card : null;
      scheduleNext(expandedCard ? expandedHoldMs : rotationIntervalMs);
    });

    showNext();
    scheduleNext(rotationIntervalMs);
  };

  if (ratingEl && window.REVIEW_ROTATION_RATING) {
    ratingEl.textContent = window.REVIEW_ROTATION_RATING;
  }
  if (countEl && window.REVIEW_ROTATION_COUNT) {
    countEl.textContent = window.REVIEW_ROTATION_COUNT;
  }

  startRotation();
});