/* ════════════════════════════════════════════════════════════════════════
   🎭 [GRAND-STAGE 2026-08-05] الطبقة 120 — بوابة «اطلب»: بنر hero + عقد
   البطاقات الدلالي (data-tile-key) بشبكة 2×2.
   ─────────────────────────────────────────────────────────────────────────
   • آخر طبقة بالتتالي (بعد 119 — ترتيب المصدر يغلب، لا لمس للحزم).
   • تحل محل قواعد nth-child/grid-column المحذوفة من 118:117-120 (عقد هش
     بالفهرس اغتيل عمداً — الترتيب هنا بمفاتيح rx-card-<key> الصريحة).
   • قانونا WIDE-GATE: كل override فاتح بقاعدة مستقلة (iOS ≤16.3 يسقط
     القائمة كلها إن لم يفهم أحد محدداتها) + لا تعريف للمتغيرات الشبح
     عالمياً. breakpoint من السلم المعتمد: 768min.
   • صفر CLS: aspect-ratio صريح لكل breakpoint + overflow hidden.
   • overlay البنر فوق scrim داكن دائماً (الوسيط لا يتبدل بالثيم) —
     أبيض فوق التدرج = تباين ≥4.5 بالثيمين بلا فروع.
   للإزالة: احذف الملف + سطر <link> + موديولات request-gateway.
   ════════════════════════════════════════════════════════════════════════ */

/* ── البنر: الحاضن الدائم ─────────────────────────────────────────────── */
#requestGatewayHero { margin: 0 0 14px; }
#requestGatewayHero[hidden] { display: none; }

.rgw-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;              /* جوال: خانة 1440×960 */
  border-radius: 18px;
  overflow: hidden;
  background: #241046;              /* أرضية قبل اكتمال الوسيط — صفر وميض أبيض */
}
@media (min-width: 768px) {
  .rgw-frame { aspect-ratio: 15 / 4; }   /* ديسكتوب/آيباد: 2400×640 و1920×512 */
}
.rgw-clickable { cursor: pointer; }
.rgw-clickable:focus-visible { outline: 3px solid #a855f7; outline-offset: 2px; }

.rgw-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;                /* قص cover محسوب — منطقة الأمان 40% الوسطى */
  display: block;
}
.rgw-picture { position: absolute; inset: 0; display: block; }

.rgw-scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(10, 4, 24, 0.62) 0%, rgba(10, 4, 24, 0.18) 45%, rgba(10, 4, 24, 0) 70%);
}

.rgw-overlay {
  position: absolute;
  right: 16px;
  bottom: 12px;
  left: 16px;
  z-index: 2;
  text-align: right;                /* RTL — منطقة النص يمين الصورة */
  pointer-events: none;
}
.rgw-title {
  margin: 0;
  color: #ffffff;                   /* فوق الscrim الداكن دائماً — AA بالثيمين */
  font-size: clamp(15px, 2.4vw, 22px);
  font-weight: 800;
  line-height: 1.35;
  text-shadow: 0 1px 8px rgba(10, 4, 24, 0.55);
}
.rgw-sub {
  margin: 2px 0 0;
  color: #e9e2ff;
  font-size: clamp(12px, 1.8vw, 15px);
  font-weight: 600;
  line-height: 1.45;
  text-shadow: 0 1px 6px rgba(10, 4, 24, 0.55);
}
@media (min-width: 768px) {
  .rgw-overlay { right: 22px; bottom: 16px; left: auto; max-width: 46%; }
}

/* ── عقد البطاقات: شبكة 1×N جوال / 2×2 ديسكتوب (RTL: الأول يمين) ──────── */
/* بديل 118:117-120 المحذوفة — auto-flow + order: بطاقة كتب غائبة ⇒ الشبكة
   تلتئم بلا nth-child. DOM: uni ← dev ← book ← svc (قانون rx-theme-images
   القديم محفوظ توافقياً، والربط الجديد بdata-tile-key). */
.rx-choice-grid { grid-template-columns: 1fr; }
@media (min-width: 768px) {
  .rx-choice-grid { grid-template-columns: repeat(2, 1fr); }
}

/* جوال (عمود واحد): شروحات ← كتب ← دورات ← الخدمات — لا حشر 4 بشاشة */
.rx-card-uni  { order: 1; }
.rx-card-book { order: 2; }
.rx-card-dev  { order: 3; }
.rx-card-svc  { order: 4; }

/* ديسكتوب/آيباد (2×2 RTL): صف أول شروحات (يمين) + دورات؛ صف ثانٍ كتب
   (يمين) + «كل شيء تحتاجه في جامعتك هنا» تحت الدورات مباشرة ✓ */
@media (min-width: 768px) {
  .rx-card-uni  { order: 1; }
  .rx-card-dev  { order: 2; }
  .rx-card-book { order: 3; }
  .rx-card-svc  { order: 4; }
}

/* الأبعاد (§C4): تحرير min-height:168px الموروث من 103/الحزمة —
   جوال 116–136 وديسكتوب 132–148، أهداف لمس ≥44×44 محفوظة بفارق كبير */
.rx-choice-card { min-height: 124px; }
@media (min-width: 768px) {
  .rx-choice-card { min-height: 140px; }
}

/* وصف البطاقة سطر واحد بالجوال (§C4) */
.rx-choice-desc {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (min-width: 768px) {
  .rx-choice-desc { -webkit-line-clamp: 2; }
}

/* ── §D2: شريط «جامعتك — ادخل مباشرة» أعلى أطلس الخدمات ──────────────── */
.ap-pref-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 10px;
  padding: 11px 14px;
  border-radius: 12px;
  border: 1px solid rgba(168, 85, 247, 0.45);
  background: rgba(168, 85, 247, 0.14);
  color: inherit;
  cursor: pointer;
  font-size: 0.86rem;
  text-align: right;
  min-height: 44px;                 /* هدف لمس ≥44px (WCAG 2.2) */
}
.ap-pref-strip .fa-star { color: #f59e0b; }
.ap-pref-strip .fa-arrow-left { margin-inline-start: auto; opacity: 0.75; }
:root[data-theme="light"] .ap-pref-strip { background: rgba(124, 58, 237, 0.08); }
:root[data-theme="light"] .ap-pref-strip { border-color: rgba(124, 58, 237, 0.4); }
:root[data-theme="light"] .ap-pref-strip { color: #2a2140; }

/* ── E5: مسح وقائي على الأسطح الجديدة — الثيم الفاتح (قواعد مفردة) ────── */
/* الإطار بأرضية فاتحة قبل تحميل الوسيط (لا صندوق داكن صادم بالثيم الفاتح) */
:root[data-theme="light"] .rgw-frame { background: #ede9fe; }
/* العنوان والوصف يبقيان أبيضين فوق الscrim (الوسيط نفسه لا يتبدل بالثيم) —
   لا override لوني هنا عمداً: الscrim يضمن التباين */
