<!-- شريط التحميل العلوي -->
<div id="progress-bar" style="position: fixed; top: 0; left: 0; width: 0%; height: 4px; background:var(--green_light_bg); z-index: 9999; display: none;"></div>

<script>
// تعريف متغير الشريط
const progressBar = document.getElementById('progress-bar');

// عند تحميل الصفحة، إخفاء شريط التحميل
document.addEventListener('DOMContentLoaded', function() {
  progressBar.style.display = "none"; // إخفاء الشريط عند تحميل الصفحة
});

// عند الانتقال من صفحة لأخرى، يظهر شريط التحميل
window.addEventListener('beforeunload', function() {
  progressBar.style.display = "block"; // يظهر شريط التحميل عند مغادرة الصفحة
  let width = 0;
  progressBar.style.width = width + "%";
  
  // إجراء التحميل التدريجي
  let interval = setInterval(function() {
    if (width >= 100) {
      clearInterval(interval);
    } else {
      width += 2; // زيادة الشريط تدريجياً
      progressBar.style.width = width + "%";
    }
  }, 50);
});
</script>
