/**
 * ============================================
 * PERFORMANCE BOOST FOR LOW-END DEVICES
 * تحسين الأداء للأجهزة الضعيفة
 * ============================================
 * 
 * الحل الرسمي من MDN و W3C باستخدام:
 * 1. prefers-reduced-motion - لتقليل الحركة
 * 2. GPU Acceleration - باستخدام transform و will-change
 * 3. content-visibility - للتحميل الكسول
 * 
 * المصادر:
 * - https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion
 * - https://web.dev/content-visibility/
 * - https://developer.mozilla.org/en-US/docs/Web/CSS/will-change
 */

/* ============================================
   1. تحسين GPU Acceleration للعناصر المتحركة
   ============================================ */

/* تفعيل GPU للعناصر التي تتحرك باستمرار - فقط على الأجهزة القوية */
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
    .hero-particles,
    .warp-particles,
    .space-grid,
    .particles-container,
    canvas,
    .animated-background {
        /* استخدام transform بدلاً من left/top للأداء الأفضل */
        transform: translateZ(0);
        /* تفعيل GPU acceleration */
        will-change: transform, opacity;
        /* تحسين الرسم */
        backface-visibility: hidden;
        perspective: 1000px;
    }
}

/* ============================================
   2. تحسين الأداء للأجهزة الضعيفة
   ============================================ */

/* اكتشاف الأجهزة الضعيفة - فقط أجهزة الكمبيوتر */
@media (min-width: 769px) and (max-height: 600px),
       (min-width: 769px) and (hover: none) {
    
    /* تقليل تعقيد الرسوم المتحركة */
    * {
        animation-duration: 0.3s !important;
        transition-duration: 0.2s !important;
    }
    
    /* تقليل شفافية العناصر الثقيلة */
    .warp-particles,
    .space-grid {
        opacity: 0.3 !important;
        pointer-events: none !important;
    }
    
    /* إزالة الظلال الثقيلة */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }
}

/* ============================================
   3. دعم prefers-reduced-motion (الحل الرسمي)
   ============================================ */

/* 
 * المستخدمون الذين فعّلوا "تقليل الحركة" في نظام التشغيل
 * تطبق على جميع الأجهزة لأنها إعداد المستخدم
 */
@media (prefers-reduced-motion: reduce) {
    
    /* تعطيل جميع الرسوم المتحركة */
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    /* إخفاء العناصر الثقيلة تماماً */
    .warp-particles,
    .space-grid,
    .hero-particles,
    .particles-container,
    canvas:not(.essential) {
        display: none !important;
        visibility: hidden !important;
    }
    
    /* تعطيل التأثيرات البصرية الثقيلة */
    * {
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* ============================================
   4. تحسين content-visibility للتحميل الكسول
   ============================================ */

/* 
 * استخدام content-visibility: auto للأقسام الطويلة - فقط على الأجهزة الضعيفة
 * يحسن الأداء بنسبة 7x حسب web.dev
 */
@media (max-width: 768px) {
    section:not(.hero-section),
    .values-section,
    .team-section,
    .clients-section,
    .cta-section,
    .footer-section {
        content-visibility: auto;
        contain-intrinsic-size: auto 500px;
    }
}

/* ============================================
   5. تحسين الصور والوسائط
   ============================================ */

/* تحميل كسول تلقائي للصور - فقط على الأجهزة الضعيفة */
@media (max-width: 768px) {
    img {
        content-visibility: auto;
    }
}

/* تحسين عرض الصور - فقط على الأجهزة الضعيفة */
@media (max-width: 768px) {
    img,
    video {
        /* منع إعادة الرسم عند التحميل */
        contain: layout style paint;
    }
}

/* ============================================
   6. تحسين الخطوط
   ============================================ */

/* تحسين عرض الخطوط - آمن لجميع الأجهزة */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   7. منع المشاكل الشائعة
   ============================================ */

/* منع التمدد الأفقي - فقط على الأجهزة الضعيفة */
@media (max-width: 768px) {
    body {
        overflow-x: hidden;
    }
}

/* تحسين الأداء للعناصر المطلقة */
[style*="position: absolute"],
[style*="position: fixed"] {
    will-change: auto;
}

/* ============================================
   8. تحسين الأداء للأجهزة القديمة فقط (ليس الهواتف)
   ============================================ */

/* تم إزالة قواعد تعطيل الحركات للهواتف */
/* الهواتف الحديثة تدعم الحركات بشكل جيد */

/* قاعدة خاصة للأجهزة القديمة جداً فقط */
@media (max-width: 480px) and (max-device-width: 480px) and (-webkit-device-pixel-ratio: 1) {
    
    /* تطبق فقط على الأجهزة القديمة جداً ذات الكثافة المنخفضة */
    .animated-background,
    .gradient-animation {
        opacity: 0.5 !important;
    }
    
    /* تقليل عدد الجزيئات فقط */
    .particle:nth-child(n+21) {
        display: none;
    }
}

/* ============================================
   9. تحسين شاشة التحميل للهواتف
   ============================================ */

@media (max-width: 768px) {
    /* تحسين سرعة شاشة التحميل فقط */
    .space-loader .orbit-ring {
        animation-duration: 2s !important;
    }
    
    .space-loader .orbit-ring-2 {
        animation-duration: 2.5s !important;
    }
    
    .space-loader .logo-container {
        animation-duration: 1.5s !important;
    }
    
    .space-loader .loader-logo {
        animation-duration: 2s !important;
    }
    
    /* تقليل تعقيد النجوم */
    .space-loader .stars {
        animation-duration: 30s !important;
    }
    
    .space-loader .stars2 {
        animation-duration: 60s !important;
    }
    
    .space-loader .stars3 {
        animation-duration: 90s !important;
    }
    
    /* تقليل تعقيد الخلفية */
    .space-loader .space-bg {
        animation-duration: 15s !important;
    }
}

/* ============================================
   10. تنظيف will-change بعد الانتهاء
   ============================================ */

/* 
 * إزالة will-change من العناصر غير النشطة
 * حسب أفضل الممارسات من Apple و MDN
 */
.hero-particles:not(:hover),
.warp-particles:not(:hover),
canvas:not(:hover) {
    will-change: auto;
}

/* إعادة تفعيل will-change عند التفاعل */
.hero-particles:hover,
.warp-particles:hover,
canvas:hover,
.animated-background:hover {
    will-change: transform, opacity;
}

/* ============================================
   11. تحسين الأداء العام
   ============================================ */

/* تم إزالة contain من الوضع الافتراضي لأنه يسبب مشاكل */

/* ============================================
   النهاية - Performance Boost CSS
   ============================================ */