/**
 * ترقيات الحركة والتصميم ثلاثي الأبعاد — CSS فقط، بدون أي مكتبات (Three.js ممنوع تمامًا)
 * كل التأثيرات: transform + opacity بس (GPU-friendly)، وبتحترم prefers-reduced-motion من responsive.css
 */

/* ================= هيرو عائم 3D (الصفحة الرئيسية) ================= */
.edu-hero-3d-stage{ perspective:1100px; display:flex; justify-content:center; margin:32px 0; }
.edu-hero-stack{
    position:relative; width:240px; height:240px; transform-style:preserve-3d;
    transform:rotateX(20deg) rotateZ(-8deg);
    animation:edu-float 5s ease-in-out infinite;
}
@keyframes edu-float{
    0%,100%{ transform:rotateX(20deg) rotateZ(-8deg) translateY(0); }
    50%{ transform:rotateX(20deg) rotateZ(-8deg) translateY(-10px); }
}
.edu-hero-slab{
    position:absolute; inset:0; margin:auto; width:190px; height:130px; border-radius:16px;
    box-shadow:0 20px 40px rgba(15,23,42,.35); color:#fff; padding:14px; font-size:12.5px; font-weight:700;
}
.edu-hero-slab-1{ background:linear-gradient(135deg,var(--edu-primary),#0D9668); transform:translateZ(0) translateY(36px); }
.edu-hero-slab-2{ background:linear-gradient(135deg,var(--edu-secondary),#0F8C7E); transform:translateZ(30px) translateY(0); }
.edu-hero-slab-3{ background:linear-gradient(135deg,#8B5CF6,#6D3FD1); transform:translateZ(60px) translateY(-36px); }

/* ================= ميلان 3D لكارت الكورس عند الـ hover ================= */
.edu-courses-grid{ perspective:1000px; }
.edu-course-card{ will-change:transform; }
.edu-course-card:hover{
    transform:perspective(1000px) rotateX(2deg) rotateY(-2deg) translateY(-4px);
}

/* ================= عمق 3D حقيقي لعجلة الحظ ================= */
.edu-wheel-3d-stage{ perspective:900px; }
.edu-wheel{ transform-style:preserve-3d; will-change:transform; }
.edu-wheel::before{
    content:''; position:absolute; inset:-6px; border-radius:50%;
    background:inherit; filter:brightness(.7); transform:translateZ(-14px); z-index:-1;
}

/* ================= داشبورد غامق بأرقام Mono (طالب/مدرس) ================= */
.edu-dash-dark{ background:var(--edu-dark); border-radius:var(--edu-radius); overflow:hidden; box-shadow:var(--edu-shadow-hover); color:#fff; }
.edu-dash-dark-head{ display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid rgba(255,255,255,.08); flex-wrap:wrap; gap:6px; }
.edu-dash-dark-head strong{ font-size:14px; color:#fff; }
.edu-dash-dark-head span{ font-size:12px; color:#7C8798; }
.edu-dash-stat-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:rgba(255,255,255,.06); }
.edu-dash-stat-cell{ background:var(--edu-dark); padding:20px; }
.edu-dash-stat-value{ font-family:'JetBrains Mono','Tajawal',monospace; font-size:22px; font-weight:600; color:#fff; }
.edu-dash-stat-value.up{ color:#6EE7C7; }
.edu-dash-stat-label{ font-size:11.5px; color:#7C8798; margin-top:4px; }
@media (min-width:700px){ .edu-dash-stat-grid{ grid-template-columns:repeat(4,1fr); } }

/* ================= Sparkline أرباح المدرس (بيانات حقيقية) ================= */
.edu-sparkline{ display:flex; align-items:flex-end; gap:4px; height:50px; padding:6px 4px; }
.edu-sparkline i{ display:block; flex:1; background:linear-gradient(180deg,var(--edu-primary),var(--edu-secondary)); border-radius:3px 3px 0 0; min-height:3px; }

/* ================= مؤشر بث مباشر الآن (حقيقي — بدون أي محتوى وهمي) ================= */
.edu-live-now-card{ background:var(--edu-dark); color:#fff; border-radius:var(--edu-radius); padding:22px; box-shadow:var(--edu-shadow-hover); }
.edu-live-now-badge{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; background:rgba(255,90,95,.15); color:#FF8A8E; padding:5px 12px; border-radius:99px; }
.edu-live-dot{ width:7px; height:7px; border-radius:50%; background:#FF5A5F; animation:edu-pulse-live 1.6s infinite; }
@keyframes edu-pulse-live{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,90,95,.5); } 50%{ box-shadow:0 0 0 6px rgba(255,90,95,0); } }
.edu-live-now-title{ font-size:16px; margin:10px 0 4px; }
.edu-live-now-sub{ font-size:12.5px; color:#9AA6BA; }