/* ════════════════════════════════════════════════════════════════════════════
 * WAITING LESSONS — STUDENT CSS — بطاقة «مقطع انتظار» سينمائية
 * ────────────────────────────────────────────────────────────────────────────
 * البطاقة تأخذ نفس بنية .course-card الموجودة (نفس الأبعاد، نفس .course-thumb،
 * نفس .course-info) — ونضيف الكلاس المعدِّل .lesson-card--waiting لاستهداف
 * التفاصيل المختلفة (لا فيديو، شارة قريباً، مؤقت/نسبة).
 *
 * الهوية: ذهبي #f59e0b/#fbbf24 + كحلي #0b1726 + أبيض، احترام prefers-reduced-motion.
 * كل المحدّدات بـ .lesson-card--waiting أو بدائي .wl- (waiting-lesson-).
 * ════════════════════════════════════════════════════════════════════════════ */

.lesson-card--waiting{
  display:flex;background:var(--bg-card,#15212e);border-radius:12px;
  overflow:hidden;border:1px solid var(--border-color,#1f2c3a);
  margin-bottom:8px;position:relative;cursor:default;
  contain:layout style;
  transition:transform .2s ease, box-shadow .2s ease;
}
.lesson-card--waiting:hover{
  box-shadow:0 4px 20px rgba(245,158,11,0.18);
  transform:translateY(-1px);
}

/* ── الثمبنيل (نفس أبعاد المقطع العادي) ───────────────────────────────────── */
.lesson-card--waiting .course-thumb{
  width:140px;min-width:140px;height:79px;
  background:var(--border-color,#1f2c3a);overflow:hidden;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  margin:auto 0;margin-left:10px;position:relative;
  isolation:isolate;
}
.lesson-card--waiting .course-thumb img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(0.85) brightness(0.92);
}
.lesson-card--waiting .course-thumb .wl-thumb-ph{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#1a2535,#0e1822);
  color:#f59e0b;font-size:1.6rem;
}

/* تدرّج داكن خفيف فوق الثمبنيل لإيحاء «قيد التجهيز» */
.lesson-card--waiting .course-thumb::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(135deg, rgba(11,23,38,0.32), rgba(11,23,38,0.06) 60%);
}

/* شعاع لمعان (shimmer) يمر ببطء */
.lesson-card--waiting .course-thumb::after{
  content:"";position:absolute;top:0;bottom:0;left:-60%;width:60%;z-index:2;
  background:linear-gradient(110deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.07) 40%,
    rgba(255,255,255,0.22) 50%,
    rgba(255,255,255,0.07) 60%,
    rgba(255,255,255,0) 100%);
  transform:skewX(-18deg);
  animation:waitShimmerSweep 2.6s ease-in-out infinite;
  pointer-events:none;
}

/* أيقونة وسطية خفيفة (ساعة رملية) فوق الثمبنيل */
.lesson-card--waiting .wl-center-icon{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  z-index:3;color:#fbbf24;font-size:1.6rem;
  filter:drop-shadow(0 0 6px rgba(0,0,0,0.55));
  animation:waitCenterPulse 2.4s ease-in-out infinite;
  pointer-events:none;
}

/* شارة «قريباً» في زاوية البطاقة */
.lesson-card--waiting .wl-badge{
  position:absolute;top:8px;right:8px;z-index:4;
  background:linear-gradient(135deg,#f59e0b,#fbbf24);
  color:#0b1726;font-weight:700;font-size:0.72rem;
  padding:3px 10px;border-radius:10px;
  box-shadow:0 2px 8px rgba(245,158,11,0.45);
  animation:waitBadgePulse 2s ease-in-out infinite;
  letter-spacing:0.5px;
}
.lesson-card--waiting .wl-badge i{margin-left:4px;font-size:0.7rem;}

/* ── محتوى المعلومات (يحاكي .course-info) ─────────────────────────────────── */
.lesson-card--waiting .course-info{
  flex:1;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;min-width:0;
}
.lesson-card--waiting .c-title{
  font-weight:600;font-size:0.95rem;margin-bottom:4px;
  color:var(--text-primary,#fff);
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.lesson-card--waiting .c-desc{
  font-size:0.8rem;color:var(--text-muted,#94a3b8);margin-bottom:6px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ── منطقة الفوتر (مكان زر التشغيل/المدة عادةً) ──────────────────────────── */
.lesson-card--waiting .wl-foot{
  margin-top:2px;
}

/* وضع المؤقت — شرائح رقمية */
.lesson-card--waiting .wl-cd{
  display:flex;align-items:center;gap:4px;flex-wrap:wrap;
}
.lesson-card--waiting .wl-cd-label{
  font-size:0.72rem;color:var(--text-muted,#94a3b8);margin-left:6px;
}
.lesson-card--waiting .wl-cd-chip{
  background:linear-gradient(180deg,#0e1d2c,#15293c);
  color:#fbbf24;border:1px solid rgba(245,158,11,0.18);
  border-radius:6px;padding:2px 7px;min-width:34px;text-align:center;
  font-weight:700;font-size:0.84rem;letter-spacing:0.3px;
  display:inline-flex;flex-direction:column;align-items:center;line-height:1;
}
.lesson-card--waiting .wl-cd-chip small{
  font-size:0.58rem;font-weight:500;color:rgba(255,255,255,0.42);margin-top:2px;
  letter-spacing:0.4px;
}
.lesson-card--waiting .wl-cd-sep{
  color:#f59e0b;font-weight:700;font-size:0.9rem;padding:0 1px;
  animation:waitCountdownBlink 1s steps(2,start) infinite;
}

/* وضع النسبة — شريط تقدم */
.lesson-card--waiting .wl-pct{
  display:flex;align-items:center;gap:8px;
}
.lesson-card--waiting .wl-pct-bar{
  position:relative;flex:1;height:8px;border-radius:6px;
  background:rgba(255,255,255,0.06);overflow:hidden;
  border:1px solid rgba(245,158,11,0.12);
}
.lesson-card--waiting .wl-pct-fill{
  position:absolute;top:0;bottom:0;right:0;
  background:linear-gradient(90deg,#f59e0b,#fbbf24);
  border-radius:6px;width:0%;
  animation:waitBarFill .8s ease-out both;
}
.lesson-card--waiting .wl-pct-fill::after{
  content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.45) 50%,
    rgba(255,255,255,0) 100%);
  animation:waitBarShine 2.2s ease-in-out infinite;
}
.lesson-card--waiting .wl-pct-num{
  font-weight:700;color:#fbbf24;font-size:0.86rem;min-width:54px;text-align:left;
}

/* حالة «نزل المقطع — حدّث الصفحة» */
.lesson-card--waiting.is-released .wl-foot{
  display:flex;align-items:center;gap:10px;
}
.lesson-card--waiting.is-released .wl-released-msg{
  color:#10b981;font-weight:600;font-size:0.86rem;
}
.lesson-card--waiting.is-released .wl-released-btn{
  background:linear-gradient(135deg,#10b981,#34d399);color:#0b1726;
  border:none;padding:6px 12px;border-radius:8px;font-weight:700;cursor:pointer;
  font-family:inherit;font-size:0.82rem;
}

/* ── الأنيميشن ──────────────────────────────────────────────────────────── */
@keyframes waitShimmerSweep{
  0%   { left:-60%; }
  60%  { left:120%; }
  100% { left:120%; }
}
@keyframes waitBadgePulse{
  0%,100%{ transform:scale(1);   box-shadow:0 2px 8px rgba(245,158,11,0.45); }
  50%    { transform:scale(1.05); box-shadow:0 2px 14px rgba(245,158,11,0.65); }
}
@keyframes waitCenterPulse{
  0%,100%{ transform:scale(1);   opacity:0.85; }
  50%    { transform:scale(1.08); opacity:1; }
}
@keyframes waitCountdownBlink{
  0%,49%   { opacity:1; }
  50%,100% { opacity:0.25; }
}
@keyframes waitBarFill{
  from { width:0%; }
  to   { width:var(--wl-pct, 0%); }
}
@keyframes waitBarShine{
  0%   { left:-40%; }
  60%  { left:100%; }
  100% { left:100%; }
}

/* احترام تفضيل تقليل الحركة */
@media (prefers-reduced-motion: reduce){
  .lesson-card--waiting .course-thumb::after,
  .lesson-card--waiting .wl-center-icon,
  .lesson-card--waiting .wl-badge,
  .lesson-card--waiting .wl-cd-sep,
  .lesson-card--waiting .wl-pct-fill,
  .lesson-card--waiting .wl-pct-fill::after{
    animation:none;
  }
}

/* لمسة لطيفة عند الضغط على بطاقة لا تقبل النقر */
.lesson-card--waiting{ user-select:none; }
.lesson-card--waiting:active{ transform:scale(0.998); }

/* shimmer أيضاً على placeholder لو ما فيه ثمبنيل */
.lesson-card--waiting .wl-thumb-ph{ position:relative;overflow:hidden; }
.lesson-card--waiting .wl-thumb-ph i{ position:relative; z-index:2; }
