var quotes = {
  quote1: "BredOS: The perfect blend of technology and culinary artistry.",
  quote2: "BredOS: Your recipe for a mouthwatering computing experience.",
  quote3: "Get your daily bread of computing excellence with BredOS."
};

var quoteElement = document.querySelector('.quote');
var quoteKeys = Object.keys(quotes);
var currentQuoteIndex = 0;
var fading = false;

function fadeOut() {
  quoteElement.classList.remove('fade-in');
  quoteElement.classList.add('fade-out');
  setTimeout(fadeIn, 500); // Wait for fade-out animation to complete
}

function fadeIn() {
  quoteElement.textContent = quotes[quoteKeys[currentQuoteIndex]];
  quoteElement.classList.remove('fade-out');
  quoteElement.classList.add('fade-in');
  quoteElement.style.setProperty("--text-in",  quotes[quoteKeys[currentQuoteIndex]]);
  fading = false;
}

function changeQuote() {
  if (fading) {
    return; // Do not change quote while fading
  }

  fading = true;
  currentQuoteIndex = (currentQuoteIndex + 1) % quoteKeys.length;
  setTimeout(fadeOut, 5000); // Wait for quote display duration
}

function startFadeAnimation() {
  fadeIn(); // Initial quote display
  setInterval(changeQuote, 8000);
}

window.onload = startFadeAnimation;