document.addEventListener('DOMContentLoaded', function() {
  const loadingOverlay = createPreloaderDiv();
  loadingOverlay.style.display = 'flex';

  // Hide loading overlay after 2 seconds
  setTimeout(function() {
      loadingOverlay.style.display = 'none';
  }, 1000); // 2000 milliseconds = 2 seconds
});


function createPreloaderDiv() {
  // Create the loading overlay div
  const loadingOverlay = document.createElement('div');
  loadingOverlay.id = 'loadingOverlay';
  loadingOverlay.classList.add('loading-overlay');

  // Add the loading spinner directly to the loadingOverlay element
  loadingOverlay.innerHTML = `
      <div class="loading-spinner">
      </div>
  `;

  // Append the overlay to the body
  document.body.appendChild(loadingOverlay);

  // Return the loading overlay element
  return loadingOverlay;
}
