/* ==== تحسينات الأداء للمنصة التعليمية ==== */

/* ==== تحسين العرض والرسوم ==== */
*,
*::before,
*::after {
    /* تحسين الرسوم ثلاثية الأبعاد */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    /* تحسين النصوص */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* تحسين التمرير */
    -webkit-overflow-scrolling: touch;
}

/* ==== تحسين التحولات والحركات ==== */
.course-card,
.btn,
.nav-link,
.footer-link,
.action-btn,
.mobile-menu-btn {
    will-change: transform;
    transform: var(--gpu-acceleration);
}

.course-card:hover,
.btn:hover,
.nav-link:hover {
    will-change: transform, box-shadow;
}

/* ==== تحسين الصور ==== */
img {
    /* تحسين جودة الصور */
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    /* تحسين التحميل */
    loading: lazy;
    /* منع السحب */
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

/* ==== تحسين التمرير ==== */
.courses-grid,
.notifications-dropdown,
.mobile-menu,
.footer-newsletter {
    /* تمرير سلس */
    scroll-behavior: smooth;
    /* تحسين الأداء */
    contain: layout style paint;
}

/* ==== تحسين الحركات ==== */
@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;
    }
}

/* ==== تحسين العناصر المتحركة ==== */
.hero-section::before,
.footer-wave path,
.notification-badge,
.online-indicator {
    /* تحسين الرسوم المتحركة */
    will-change: transform, opacity;
    transform: var(--gpu-acceleration);
}

/* ==== تحسين الخطوط ==== */
@font-face {
    font-family: 'Inter';
    font-display: swap;
    src: url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
}

@font-face {
    font-family: 'Cairo';
    font-display: swap;
    src: url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&display=swap');
}

/* ==== تحسين شبكة CSS ==== */
.courses-grid,
.features-grid,
.footer-links-grid {
    /* تحسين العرض */
    contain: layout;
    /* تحسين الذاكرة */
    will-change: auto;
}

/* ==== تحسين الجداول ==== */
table {
    /* تحسين العرض */
    table-layout: fixed;
    /* منع الانكماش */
    white-space: nowrap;
}

/* ==== تحسين النماذج ==== */
input,
textarea,
select {
    /* تحسين الإدخال */
    will-change: auto;
    /* تحسين التركيز */
    contain: layout style;
}

/* ==== تحسين القوائم ==== */
ul,
ol {
    /* تحسين العرض */
    contain: layout;
}

/* ==== تحسين الأزرار ==== */
button,
.btn {
    /* تحسين النقر */
    touch-action: manipulation;
    /* تحسين التفاعل */
    will-change: transform, background-color;
}

/* ==== تحسين العناصر الثابتة ==== */
.modern-header,
.back-to-top {
    /* تحسين العناصر الثابتة */
    will-change: transform;
    transform: var(--gpu-acceleration);
}

/* ==== تحسين العناصر المخفية ==== */
.mobile-menu-overlay:not(.active),
.search-suggestions:not([style*="block"]),
.notifications-dropdown:not([style*="visible"]) {
    /* إخفاء كامل للأداء */
    display: none !important;
}

/* ==== تحسين التحميل التدريجي ==== */
.lazy-load {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.lazy-load.loaded {
    opacity: 1;
}

/* ==== تحسين البيانات الكبيرة ==== */
.data-table {
    /* تحسين الجداول الكبيرة */
    contain: strict;
    overflow: auto;
    height: 400px;
}

.data-table tbody {
    /* تحسين محتوى الجدول */
    contain: layout style;
}

/* ==== تحسين الشاشات الصغيرة ==== */
@media (max-width: 768px) {
    /* تقليل الحركات على المحمول */
    .hero-section::before {
        animation: none;
    }
    
    /* تبسيط الظلال */
    .course-card {
        box-shadow: var(--shadow-sm);
    }
    
    .course-card:hover {
        box-shadow: var(--shadow-md);
        transform: translateY(-4px);
    }
    
    /* تحسين الشبكات */
    .courses-grid {
        grid-template-columns: 1fr;
    }
}

/* ==== تحسين الشاشات الكبيرة ==== */
@media (min-width: 1200px) {
    /* تحسين استخدام المساحة */
    .container {
        max-width: 1200px;
    }
    
    /* تحسين الشبكات */
    .courses-grid {
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    }
}

/* ==== تحسين التباين العالي ==== */
@media (prefers-contrast: high) {
    :root {
        --border-color: #000000;
        --text-secondary: #000000;
        --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
    }
}

/* ==== تحسين المظهر الداكن ==== */
@media (prefers-color-scheme: dark) {
    :root {
        --bg-primary: #1e293b;
        --bg-secondary: #334155;
        --text-primary: #f8fafc;
        --text-secondary: #e2e8f0;
        --border-color: #475569;
    }
}

/* ==== حاوي الأداء ==== */
.performance-container {
    /* تحسين العرض الشامل */
    contain: layout style paint;
    /* تحسين التمرير */
    overflow-anchor: none;
}

/* ==== تحسين العمليات الثقيلة ==== */
.heavy-operation {
    /* تأجيل العمليات الثقيلة */
    content-visibility: auto;
    contain-intrinsic-size: 200px;
}

/* ==== تحسين الرسوم المتحركة ==== */
@keyframes optimizedFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px) var(--gpu-acceleration);
    }
    to {
        opacity: 1;
        transform: translateY(0) var(--gpu-acceleration);
    }
}

@keyframes optimizedSlideIn {
    from {
        transform: translateX(-100%) var(--gpu-acceleration);
    }
    to {
        transform: translateX(0) var(--gpu-acceleration);
    }
}

/* ==== تحسين طباعة الصفحة ==== */
@media print {
    /* إخفاء العناصر غير المهمة */
    .modern-header,
    .modern-footer,
    .mobile-menu-overlay,
    .back-to-top,
    .action-btn {
        display: none !important;
    }
    
    /* تحسين الألوان للطباعة */
    * {
        color: black !important;
        background: white !important;
        box-shadow: none !important;
    }
    
    /* تحسين الروابط */
    a[href]:after {
        content: " (" attr(href) ")";
        font-size: 12px;
        color: #666;
    }
}

/* ==== تحسين إمكانية الوصول ==== */
@media (prefers-reduced-transparency) {
    .modern-header,
    .mobile-menu-overlay {
        backdrop-filter: none;
        background: var(--bg-primary);
    }
}

/* ==== تحسين لوحة المفاتيح ==== */
.keyboard-navigation {
    /* تحسين التنقل بلوحة المفاتيح */
    outline-offset: 2px;
    outline: 2px solid var(--primary-color);
    outline-style: dashed;
}

/* ==== تحسين شاشة القراءة ==== */
@media (max-width: 480px) and (orientation: portrait) {
    /* تحسين للقراءة على الشاشات الصغيرة */
    body {
        font-size: 16px;
        line-height: 1.6;
    }
    
    .course-card {
        margin-bottom: var(--spacing-lg);
    }
    
    /* تبسيط التخطيط */
    .courses-layout {
        grid-template-columns: 1fr;
    }
}

/* ==== تحسين تحديث المحتوى ==== */
.dynamic-content {
    /* تحسين المحتوى المتغير */
    contain: content;
}

/* ==== نهاية ملف تحسينات الأداء ==== */