/* ============================================================================
   glass-theme.css — V380
   واجهة "شبه شفافة زجاجية براقة ومصقولة" — بطلب صريح من المستخدم.
   النطاق المؤكَّد صراحة من المستخدم (لا تتجاوزه بدون طلب جديد):
     1) كل صفحات الموقع (وليس الواجهة الرئيسية فقط).
     2) البطاقات والنوافذ (modals) فقط — لا أزرار/حقول/تبويبات/نقاط حالة.
     3) الإبقاء على ألوان الهوية الحالية (كحلي/نبيذي/ذهبي) بلا أي تغيير لوني.

   V380.2 — المستخدم أفاد صراحةً: "لا يوجد لمعان حتى اللوحة الكحلية"، وأكّد
   عند السؤال أنه يريد الأمرين معًا: (أ) توسيع نطاق الزجاج ليشمل الشريط
   الجانبي/الهيدر الكحلي أيضًا (توسيع عن القرار السابق)، و(ب) تقوية اللمعان
   نفسه في كل مكان (كان ضعيفًا حتى على البطاقات). أُضيف لذلك:
   - قسم 4: شريط لمعان قطري (diagonal shine) حقيقي كـ background-image
     إضافية فوق كل بطاقة/نافذة — هذا ما يعطي إحساس "الزجاج المصقول" الذي
     كان غائبًا (كانت المعالجة السابقة طمس + ظل فقط، بلا لمعان مرئي فعلي).
   - قسم 5: نفس معالجة الزجاج (شفافية + طمس + حد + لمعان قطري) للشريط
     الجانبي (.sidebar/.sidebar-brand) وشريط العنوان العلوي (.topbar) —
     بنفس درجة اللون الكحلي الأصلي (كحلي شبه شفاف لا كحلي باهت/متغيّر). */

   آلية العمل:
   - --paper-card أصبح شبه شفاف (rgba) من design-tokens.css — هذا وحده يكسو
     عشرات البطاقات بالشفافية فورًا دون أي عمل إضافي هنا.
   - هذا الملف يضيف فقط: (أ) خلفية زخرفية خافتة خلف الصفحة بألوان الهوية
     لإعطاء الزجاج شيئًا "يُرى من خلاله"، (ب) backdrop-filter (طمس زجاجي)
     للبطاقات/الأطر المعروفة فقط عبر قائمة محددة من الـ selectors،
     (ج) تلميع إضافي مخصص للنوافذ المنبثقة (.modal-box وأخواتها) فقط.
   - لا شيء هنا يغيّر الألوان أو box-shadow أو border الأصلية بشكل جذري؛ فقط
     إضافات تراكمية (additive) آمنة ومُغلَّفة بـ @supports.
   - عند الطباعة: @media print في design-tokens.css يلغي الشفافية والطمس
     تلقائيًا (راجع ذلك الملف) — لا حاجة لتكرار ذلك هنا.
   ========================================================================= */

/* ---------- 1) خلفية زخرفية خلف كامل الصفحة (ألوان الهوية فقط) ----------
   V380.1: رُفعت كثافة التدرجات اللونية (من ~.14-.22 إلى ~.30-.42) لأن
   البطاقات بعد V380.1 أكثر شفافية (.34 بدل .62) — فإن لم تكن الخلفية
   واضحة بما يكفي خلفها، يبدو الزجاج كأنه مجرد لون رمادي باهت بدل زجاج
   حقيقي "يُرى من خلاله". الألوان نفسها (كحلي/نبيذي/ذهبي) بلا أي إضافة. */
body{
  position:relative;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 10% 6%,  rgba(184,137,62,.42) 0%, rgba(184,137,62,0) 46%),
    radial-gradient(circle at 90% 14%, rgba(122,31,43,.34) 0%, rgba(122,31,43,0) 50%),
    radial-gradient(circle at 16% 94%, rgba(22,35,63,.40) 0%, rgba(22,35,63,0) 54%),
    radial-gradient(circle at 94% 90%, rgba(184,137,62,.30) 0%, rgba(184,137,62,0) 48%),
    radial-gradient(circle at 50% 50%, rgba(122,31,43,.10) 0%, rgba(122,31,43,0) 60%),
    var(--paper);
  background-color:var(--paper);
}

/* ---------- 2) الطمس الزجاجي + تلميع حقيقي — بطاقات/أطر/لوحات، عبر @supports آمن ----------
   V380.1: أُضيف border شفاف + box-shadow بطبقتين (ظل خارجي + لمعان علوي
   داخلي inset) لنفس قائمة البطاقات، بدل الاكتفاء بـ backdrop-filter وحده
   — هذا ما يعطي إحساس "الزجاج المصقول" بدل مجرد خلفية باهتة صلبة المظهر. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){

  /* قائمة محددة من فئات البطاقات/الأطر/اللوحات المعروفة في الموقع —
     لا أزرار، لا حقول إدخال، لا تبويبات، لا نقاط حالة. */
  .card, .kpi, .kpi-card, .stat-card, .stat-box, .panel, .box,
  .mfu-stat, .dev-impact-kpi, .works-kpi, .ach-card, .ach-box,
  .plan-card, .plan-box, .signature-box, .reflect-box,
  .teacher-card, .visit-card, .school-card, .summary-card, .summary-box,
  .overview-card, .report-card, .info-card, .info-box, .data-card,
  .dashboard-card, .widget, .widget-card, .tile, .section-card,
  [class*="-card"], [class*="-kpi"], [class*="-panel"]{
    backdrop-filter:blur(20px) saturate(1.3);
    -webkit-backdrop-filter:blur(20px) saturate(1.3);
    border:1px solid rgba(255,255,255,.45);
    box-shadow:
      0 8px 28px rgba(14,23,41,.14),
      inset 0 1px 0 rgba(255,255,255,.55);
    /* V380.2 — لمعان قطري حقيقي (background-image إضافية فوق خلفية
       --paper-card، لا تستبدلها): شريط ضوء خافت يعبر البطاقة من الزاوية
       العلوية اليسرى، وهو ما يعطي إحساس "الزجاج المصقول" الفعلي. */
    background-image:linear-gradient(135deg,
      rgba(255,255,255,.55) 0%,
      rgba(255,255,255,.18) 28%,
      rgba(255,255,255,0) 52%);
  }

  /* ---------- 3) تلميع أقوى خاص بالنوافذ المنبثقة (الـ"windows" الحقيقية) ----------
     V382.4 — بطلب المستخدم: "الوهج قوي جدا خفف وخفف" — تخفيف شدة اللمعان
     الثابت فوق النوافذ المنبثقة (نواة بيضاء .65 → .22 سابقًا) بشكل ملموس. */
  .modal-box, .plan-modal-box, .modal, .modal-content, .popup-box, .dialog-box{
    backdrop-filter:blur(28px) saturate(1.35);
    -webkit-backdrop-filter:blur(28px) saturate(1.35);
    border:1px solid rgba(255,255,255,.6);
    box-shadow:
      0 24px 70px rgba(14,23,41,.26),
      0 2px 8px rgba(14,23,41,.12),
      inset 0 1px 0 rgba(255,255,255,.7);
    background-image:linear-gradient(135deg,
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.06) 24%,
      rgba(255,255,255,0) 48%);
  }

  /* ---------- 4) الشريط الجانبي + شريط العنوان العلوي ----------
     V380.3 — المستخدم صحّح الطلب: *"رجع اللون الكحلي مثل ما كان... قصدت
     نعومة ولمعان ولم اقصد سماكة"* — أي: لا شفافية ولا طمس (backdrop-filter)
     ولا تغيير في عتامة/كثافة اللون الكحلي الأصلي (يبقى صلبًا 100% كالسابق)،
     فقط لمعان/نعومة بصرية إضافية فوقه (shine overlay خفيف، بلا أي
     backdrop-filter أو rgba شفافة تُغيّر كثافة اللون نفسه). */
  .sidebar{
    background:linear-gradient(175deg, var(--navy) 0%, var(--navy-deep) 100%);
    background-image:
      linear-gradient(175deg, var(--navy) 0%, var(--navy-deep) 100%),
      linear-gradient(160deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 35%);
    box-shadow:inset 1px 0 0 rgba(255,255,255,.06);
  }
  .sidebar-brand{
    background-image:linear-gradient(135deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 50%);
  }
  .topbar{
    backdrop-filter:blur(20px) saturate(1.3);
    -webkit-backdrop-filter:blur(20px) saturate(1.3);
    background-image:linear-gradient(135deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,.12) 30%, rgba(255,255,255,0) 55%);
  }
}

/* ---------- 5) لمعان متحرك عند مرور الماوس (Hover Shine Sweep) ----------
   V380.4 — بطلب صريح من المستخدم: *"باغي لمعان على البطاقات اول ما امرر
   الماوس عليها يبدأ لمعان من الزاوية السفلية الى الزاوية العلوية، لمعان
   على الازرار بنفس الطريقة"*. هذا توسيع نطاق مؤكَّد صراحة ليشمل الأزرار
   أيضًا (لم تكن ضمن نطاق V380 الأصلي)، لكنه إضافي بحت (pseudo-element
   ::before + position/overflow) ولا يلمس ألوان أو خلفيات الأزرار الفعلية
   بأي شكل — فقط شريط ضوء خافت يعبر قطريًا عند المرور، ثم يختفي.

   V380.5 — المستخدم صحّح: *"اللمعان سريع جدا انا اريده ان يتحرك بشكل
   قطري كالمرآن تماما حتى ازرار التبويبات او اسماء الصفحات على المستطيل
   الكحلي"*. التعديلات:
   1) تبطيء الحركة من .65s إلى 1.4s (أبطأ بأكثر من الضعف) بمنحنى حركة
      أنعم (cubic-bezier) بدل ease العادي — إحساس "مرآة" بطيء ومصقول.
   2) توسيع الشريط نفسه وتليينه (نطاق تلاشي أعرض: 38%→50%→62% بدل
      42%→50%→58%) لمحاكاة انعكاس مرآة حقيقي بدل خط حاد رفيع.
   3) توسيع النطاق ليشمل أزرار/أسماء التبويبات على الشريط الجانبي الكحلي
      (.nav-item) — بطلب صريح من المستخدم في هذه الرسالة بالضبط.

   V380.6 — المستخدم أفاد أن اللمعان "غير واضح على البطاقات". السبب: شريط
   اللمعان كان أبيض خافت فوق بطاقات فاتحة شبه شفافة (--paper-card) أصلًا —
   تباين منخفض جدًا (أبيض على أبيض تقريبًا)، فكان يظهر بوضوح على الشريط
   الجانبي الكحلي الغامق فقط. الإصلاح: استبدال نواة الشريط الأبيض الوحيدة
   بتدرّج ثلاثي الطبقات (ظل خافت جدًا ← نواة بيضاء ساطعة 95% ← ظل خافت)
   يضيف حدًّا داكنًا خفيفًا جدًا (rgba(14,23,41,...)) على جانبي النواة
   الساطعة، فيعطي تباينًا واضحًا حتى على الخلفيات الفاتحة (يحاكي انعكاس
   المرآة الحقيقي ذا الحافتين الداكنتين حول بريق الضوء)، مع رفع z-index
   للشريط ليبقى مرئيًا فوق طبقة اللمعان الثابتة الموجودة أصلًا (قسم 2).

   V380.7 — المستخدم طلب تضييق النطاق صراحةً: *"فقط اجعل انعكاس المرأة على
   العناوين في اللوحة الكحلية وعلى الأزرار والتبويبات فقط وغيرها لا نحتاج
   لانها عملت لنا ربكة في الوسط كذلك لا مانع من جعلها في المسج بوكس او في
   النوافذ التي تظهر لتنفيذ امر... او نوافذ التي تظهر الاستيراد او
   التصدير لا مشكلة"*. إزالة كل فئات البطاقات/الـKPI/اللوحات/الـwidgets من
   الثلاث مجموعات أدناه (كانت تسبب ربكة بصرية في وسط الصفحة)، والإبقاء على:
   (أ) .nav-item (عناوين/تبويبات اللوحة الكحلية)، (ب) button/.btn/[class*="btn"]
   (الأزرار)، (ج) .modal-box وأخواتها (نوافذ رسائل/تنفيذ أمر/استيراد/تصدير) —
   مُضافة الآن لقسم اللمعان المتحرك بناءً على موافقة المستخدم الصريحة.

   V380.8 — بطلب صريح: *"اضف حركة المرآة على البطاقات ٨ وكذلك على ازرار
   التنبيهات"* (البطاقات الثماني في "مؤشرات العمل الرئيسية" و"مؤشرات
   المتابعة" بلوحة المتابعة — صنف .dash-kpi-card). أُضيف .dash-kpi-card
   صراحةً لقائمة اللمعان (لم تكن مشمولة ضمن أي صنف عام سابق). أما "أزرار
   التنبيهات" (جرس 🔔 #v133Bell، وزر "عرض" .dash-alert-mini-btn) فهي عناصر
   <button> فعلية أصلًا، ومشمولة تلقائيًا ضمن selector العام button أعلاه —
   لا تعديل إضافي مطلوب لها. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){

  button, .btn, [class*="btn"], .nav-item, .dash-kpi-card,
  .modal-box, .plan-modal-box, .modal, .modal-content, .popup-box, .dialog-box{
    position:relative;
    overflow:hidden;
  }

  /* V382.6 — بطلب المستخدم: "اللمعة على البطاقات ٨ في لوحة المتابعة غير
     ظاهرة ابدا" — السبب: css/components.css يُعرِّف قاعدة أخرى بنفس
     المحدِّد بالضبط `.dash-kpi-card::before` (دائرة زخرفية خافتة:
     opacity:.05 وborder-radius:50%) لغرض مختلف تمامًا. بما أن القاعدتين
     تستهدفان نفس العنصر الوهمي حرفيًا وبنفس الخصوصية، فإن أي خاصية لا
     تُحدِّدها هذه القاعدة هنا (opacity، border-radius) تبقى موروثة من
     قاعدة components.css رغم أن هذه القاعدة أحدث في ترتيب التحميل —
     فيظهر شريط اللمعان بشفافية 5% فقط (opacity:.05) أي غير مرئي عمليًا.
     الإصلاح: تحديد opacity:1 وborder-radius:0 صراحةً هنا لإلغاء أي
     توريث غير مقصود من قاعدة البطاقات الزخرفية. */
  button::before, .btn::before, [class*="btn"]::before, .nav-item::before, .dash-kpi-card::before,
  .modal-box::before, .plan-modal-box::before, .modal::before, .modal-content::before, .popup-box::before, .dialog-box::before{
    content:"";
    position:absolute;
    top:-40%; left:-40%;
    width:180%; height:180%;
    border-radius:0;
    opacity:1;
    background:linear-gradient(135deg,
      rgba(14,23,41,0) 28%,
      rgba(14,23,41,.07) 40%,
      rgba(255,255,255,.95) 50%,
      rgba(14,23,41,.07) 60%,
      rgba(14,23,41,0) 72%);
    transform:translate(-55%, 55%);
    transition:transform 1.4s cubic-bezier(.22,.61,.36,1);
    pointer-events:none;
    z-index:5;
  }

  button:hover::before, .btn:hover::before, [class*="btn"]:hover::before, .nav-item:hover::before, .dash-kpi-card:hover::before,
  .modal-box:hover::before, .plan-modal-box:hover::before, .modal:hover::before, .modal-content:hover::before, .popup-box:hover::before, .dialog-box:hover::before{
    transform:translate(55%, -55%);
  }

  /* V382.4 — بطلب المستخدم: "الوهج قوي جدا خفف وخفف" — نواة الشريط المتحرك
     فوق النوافذ المنبثقة كانت بيضاء ساطعة .95 (نفس قوة شريط الأزرار)،
     وعلى مساحة النافذة الكبيرة يبدو وهجًا قويًا جدًا يعبر كامل الصندوق.
     تخفيف مزدوج هنا (قاعدة لاحقة بنفس الخصوصية تتغلّب على قسم 5 أعلاه،
     خاصة بالنوافذ فقط دون لمس الأزرار/التبويبات/البطاقات): تصغير سطوع
     النواة من .95 إلى .35 وتضييق الشريط نفسه. */
  .modal-box::before, .plan-modal-box::before, .modal::before, .modal-content::before, .popup-box::before, .dialog-box::before{
    background:linear-gradient(135deg,
      rgba(14,23,41,0) 36%,
      rgba(14,23,41,.04) 44%,
      rgba(255,255,255,.35) 50%,
      rgba(14,23,41,.04) 56%,
      rgba(14,23,41,0) 64%);
  }
}

/* ---------- 6) بطاقات لوحة المتابعة الثماني: زجاج شفاف ملوَّن بلون كل بطاقة ----------
   V382.7 — بطلب صريح من المستخدم: "اجعل كل بطاقة تعكس نفس اللون الذي
   تمثله باسلوب زجي شفاف متألق". كل بطاقة من الثماني (#dashKpiCards) تحمل
   أصلًا صنف لون مميز (.dash-kpi-blue/-green/-purple/-teal/-red/-orange/-gold
   من js/modules/dashboard.js + css/components.css) يُستخدَم حاليًا فقط
   للنص وأيقونة الدائرة الصغيرة، بينما خلفية البطاقة نفسها بيضاء صلبة دومًا
   (`.dash-kpi-card{ background:#FFFFFF }` في components.css). هنا تُستبدَل
   الخلفية البيضاء الصلبة لكل بطاقة بتدرّج زجاجي شفاف بنفس لون هويتها
   (من لون غني عند الزاوية العلوية إلى شبه شفاف) + حد وظل بنفس اللون، مع
   الإبقاء على طمس الزجاج (backdrop-filter) ولمعان المرور المتحرك القائمين
   أصلًا (قسم 5 أعلاه + V382.6) فوقها — فتبدو كل بطاقة "زجاجًا ملوَّنًا
   متألقًا" مطابقًا للون مؤشرها، بدل الأبيض الموحَّد للبطاقات الثماني كلها.
   مُقيَّد بـ#dashKpiCards فقط (نفس نطاق V258) حتى لا يتأثر أي استخدام آخر
   لنفس أصناف الألوان خارج لوحة المتابعة (مثل head.html). */
#dashKpiCards .dash-kpi-card.dash-kpi-blue{
  background:linear-gradient(135deg, rgba(37,99,235,.22) 0%, rgba(37,99,235,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(37,99,235,.35);
  box-shadow:0 8px 24px rgba(37,99,235,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-green{
  background:linear-gradient(135deg, rgba(22,163,74,.22) 0%, rgba(22,163,74,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(22,163,74,.35);
  box-shadow:0 8px 24px rgba(22,163,74,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-purple{
  background:linear-gradient(135deg, rgba(124,58,237,.22) 0%, rgba(124,58,237,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(124,58,237,.35);
  box-shadow:0 8px 24px rgba(124,58,237,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-teal{
  background:linear-gradient(135deg, rgba(20,184,166,.22) 0%, rgba(20,184,166,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(20,184,166,.35);
  box-shadow:0 8px 24px rgba(20,184,166,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-red{
  background:linear-gradient(135deg, rgba(239,68,68,.22) 0%, rgba(239,68,68,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(239,68,68,.35);
  box-shadow:0 8px 24px rgba(239,68,68,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-orange{
  background:linear-gradient(135deg, rgba(249,115,22,.22) 0%, rgba(249,115,22,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(249,115,22,.35);
  box-shadow:0 8px 24px rgba(249,115,22,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
#dashKpiCards .dash-kpi-card.dash-kpi-gold{
  background:linear-gradient(135deg, rgba(200,146,46,.22) 0%, rgba(200,146,46,.08) 45%, rgba(255,255,255,.65) 100%);
  border:1px solid rgba(200,146,46,.35);
  box-shadow:0 8px 24px rgba(200,146,46,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  #dashKpiCards .dash-kpi-card{
    backdrop-filter:blur(18px) saturate(1.4);
    -webkit-backdrop-filter:blur(18px) saturate(1.4);
  }
}

/* ---------- 8) بطاقات لوحة المتابعة الثماني: عادية (بلا زجاج) + انعكاس بلون البطاقة ----------
   V390 — بطلب المستخدم: "لا أريد التأثير الزجاجي على البطاقات، أريدها عادية،
   وعند مرور الماوس يظهر انعكاس ليس أبيض بل بلون البطاقة نفسها". الإصلاح:
   (1) إلغاء الطمس والتدرّج الزجاجي (القسم 6)؛ خلفية البطاقة = أبيض + تلوين خفيف
       صلب بلونها (--kc)؛
   (2) إلغاء الطمس/الحد الأبيض/التدرّج الأبيض عن عناصرها الداخلية (العنوان
       والرقم والوصف) وعن رأس المجموعة — كانت تطابق [class*="-kpi"] فتظهر
       مربعات بيضاء خلف النصوص؛
   (3) شريط اللمعان عند المرور بلون البطاقة (--kc) بدل الأبيض. */
#dashKpiCards .dash-kpi-card{ --kc:37,99,235; }
#dashKpiCards .dash-kpi-card.dash-kpi-blue{ --kc:37,99,235; }
#dashKpiCards .dash-kpi-card.dash-kpi-green{ --kc:22,163,74; }
#dashKpiCards .dash-kpi-card.dash-kpi-purple{ --kc:124,58,237; }
#dashKpiCards .dash-kpi-card.dash-kpi-teal{ --kc:20,184,166; }
#dashKpiCards .dash-kpi-card.dash-kpi-red{ --kc:239,68,68; }
#dashKpiCards .dash-kpi-card.dash-kpi-orange{ --kc:249,115,22; }
#dashKpiCards .dash-kpi-card.dash-kpi-gold{ --kc:200,146,46; }
#dashKpiCards .dash-kpi-card[class]{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background:linear-gradient(rgba(var(--kc),.16), rgba(var(--kc),.16)), #FFFFFF;
  border:1px solid rgba(var(--kc),.35);
  box-shadow:0 2px 8px rgba(14,23,41,.07);
}
#dashKpiCards .dash-kpi-card .dash-kpi-top,
#dashKpiCards .dash-kpi-card .dash-kpi-title,
#dashKpiCards .dash-kpi-card .dash-kpi-number,
#dashKpiCards .dash-kpi-card .dash-kpi-desc,
#dashKpiCards .dash-kpi-card .dash-kpi-dots,
#dashKpiCards .dash-kpi-card .dash-kpi-wave{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background:transparent;
  background-image:none;
  border-color:transparent;
  box-shadow:none;
}
#dashKpiCards .dash-kpi-card .dash-kpi-icon-circle{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background-image:none;
  box-shadow:none;
}
#dashKpiCards .dash-kpi-group-head,
#dashKpiCards .dash-kpi-group-title,
#dashKpiCards .dash-kpi-group-icon,
#dashKpiCards .dash-kpi-group-cards{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background-image:none;
  box-shadow:none;
}
#dashKpiCards .dash-kpi-group-head,
#dashKpiCards .dash-kpi-group-title{ background-color:transparent; border-color:transparent; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  /* V390.3 — مرآة بيضاء حقيقية: الشريط السابق (transform + عرض 180%) كان يترك أثرًا رماديًا
     ثابتًا أسفل البطاقة ولا يظهر بوضوح. الآن: طبقة تغطي البطاقة بالضبط، وشريط أبيض
     يُحرَّك بـ background-position من الزاوية السفلية اليسرى إلى العلوية اليمنى،
     وهو مخفي تمامًا في وضع السكون (حواف شفافة بلا ظلال داكنة). */
  #dashKpiCards .dash-kpi-card::before{
    top:0; left:0; width:100%; height:100%;
    border-radius:inherit;
    transform:none;
    opacity:1;
    background-image:linear-gradient(45deg,
      rgba(255,255,255,0) 40%,
      rgba(255,255,255,.55) 47%,
      rgba(255,255,255,.95) 50%,
      rgba(255,255,255,.55) 53%,
      rgba(255,255,255,0) 60%);
    background-size:300% 300%;
    background-repeat:no-repeat;
    background-position:0% 100%;
    /* V390.7 — موجة قطرية جماعية باتجاه واحد: البطاقات على نفس القطر تلمع معًا (التأخير = رقم القطر × 0.6ث) */
    animation:dashKpiWave 6s linear infinite;
    animation-delay:calc(var(--kd, 0) * .6s);
  }
  @keyframes dashKpiWave{
    0%      { background-position:0% 100%; }
    30%,100%{ background-position:100% 0%; }
  }
  /* رقم القطر = (صف + عمود): الصف الأول 0..3، الصف الثاني 1..4 */
  #dashKpiCards .dash-kpi-group-main   .dash-kpi-card:nth-child(1)::before{ --kd:0; }
  #dashKpiCards .dash-kpi-group-main   .dash-kpi-card:nth-child(2)::before{ --kd:1; }
  #dashKpiCards .dash-kpi-group-main   .dash-kpi-card:nth-child(3)::before{ --kd:2; }
  #dashKpiCards .dash-kpi-group-main   .dash-kpi-card:nth-child(4)::before{ --kd:3; }
  #dashKpiCards .dash-kpi-group-follow .dash-kpi-card:nth-child(1)::before{ --kd:1; }
  #dashKpiCards .dash-kpi-group-follow .dash-kpi-card:nth-child(2)::before{ --kd:2; }
  #dashKpiCards .dash-kpi-group-follow .dash-kpi-card:nth-child(3)::before{ --kd:3; }
  #dashKpiCards .dash-kpi-group-follow .dash-kpi-card:nth-child(4)::before{ --kd:4; }
  /* V390.6 — عند وقوف الماوس على بطاقة: تتوقف لمعة البقية وتبقى لمعة هذه البطاقة وحدها
     تتكرر باستمرار؛ وعند مغادرة الماوس تعود الحركة الجماعية المتتابعة. */
  @keyframes dashKpiSheenLoop{
    0%      { background-position:0% 100%; }
    70%,100%{ background-position:100% 0%; }
  }
  #dashKpiCards:has(.dash-kpi-card:hover) .dash-kpi-group .dash-kpi-card.dash-kpi-card:not(:hover)::before{
    animation:none;
    background-position:0% 100%;
  }
  #dashKpiCards .dash-kpi-group .dash-kpi-card.dash-kpi-card:hover::before{
    animation:dashKpiSheenLoop 2.6s linear infinite;
  }
  @media (prefers-reduced-motion:reduce){
    #dashKpiCards .dash-kpi-group .dash-kpi-card.dash-kpi-card:nth-child(n)::before,
    #dashKpiCards .dash-kpi-group .dash-kpi-card.dash-kpi-card:hover::before{ animation:none; }
  }
}

/* V390.1 — وهج ضبابي بلون البطاقة على حوافها أثناء مرور الماوس */
#dashKpiCards .dash-kpi-card[class]{
  transition:box-shadow .35s ease, border-color .35s ease;
}
#dashKpiCards .dash-kpi-card[class]:hover{
  border-color:rgba(var(--kc),.65);
  box-shadow:
    0 0 0 1px rgba(var(--kc),.25),
    0 0 14px 2px rgba(var(--kc),.35),
    0 0 32px 6px rgba(var(--kc),.20);
}

/* ---------- 7) بطاقات المعلمين (بيانات المعلمين): لون واضح + لمعان بلون البطاقة ----------
   V389 — بطلب المستخدم: "البطاقات شكلها معتم؛ أريد اللمعان ليس بالأبيض بل بنفس
   لون البطاقة، وتبقى البطاقة بلون واضح كما في البداية". السبب: المحدِّد العام
   [class*="-card"] يطابق البطاقة وأيضًا أبناءها (teacher-card-row1/-row2/-footer)،
   فيُضاف لكل واحد منها طمس + حد أبيض + تدرّج أبيض ← ضباب معتم متراكم.
   الإصلاح: إلغاء ذلك كله لهذه البطاقة وأبنائها، وإعادة خلفيتها الصلبة الأصلية
   (--paper)، ثم لمعان عند المرور بتدرّج بنفس درجة لون البطاقة (لا أبيض) عبر
   background-position (بلا ::before ولا overflow:hidden ← لا اقتطاع لأي محتوى). */
.teacher-cards-list .teacher-card{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background-color:#FFFFFF;
  border:1px solid #D6DAE6;
  box-shadow:0 2px 10px rgba(14,23,41,.08);
  background-image:linear-gradient(45deg,
    rgba(90,104,170,0) 36%,
    rgba(90,104,170,.22) 50%,
    rgba(90,104,170,0) 64%);
  background-size:300% 300%;
  background-position:0% 100%;
  background-repeat:no-repeat;
  transition:background-position 1.4s cubic-bezier(.22,.61,.36,1), border-color .15s, box-shadow .2s;
}
.teacher-cards-list .teacher-card:hover{
  background-position:100% 0%;
  box-shadow:0 6px 18px rgba(14,23,41,.10);
}
.teacher-cards-list .teacher-card .tc-field input,
.teacher-cards-list .teacher-card .tc-field select,
.teacher-cards-list .teacher-card .tc-grade-field select{ background:#FFFFFF; border-color:#D6DAE6; }
.teacher-cards-list .teacher-card.is-dirty{ border-color:var(--gold); }
.teacher-cards-list .teacher-card [class*="-card"]{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  background-image:none;
  box-shadow:none;
  border-color:transparent;
}
.teacher-cards-list .teacher-card .teacher-card-row2{ border-top:1px dashed var(--line); }

/* طباعة: شبكة أمان إضافية هنا أيضًا (بالتكامل مع design-tokens.css) */
@media print{
  body::before{ display:none !important; content:none !important; }
  .card, .kpi, .kpi-card, .stat-card, .stat-box, .panel, .box,
  .mfu-stat, .dev-impact-kpi, .works-kpi, .ach-card, .ach-box,
  .plan-card, .plan-box, .signature-box, .reflect-box,
  .teacher-card, .visit-card, .school-card, .summary-card, .summary-box,
  .overview-card, .report-card, .info-card, .info-box, .data-card,
  .dashboard-card, .widget, .widget-card, .tile, .section-card,
  [class*="-card"], [class*="-kpi"], [class*="-panel"],
  .modal-box, .plan-modal-box, .modal, .modal-content, .popup-box, .dialog-box,
  .sidebar, .sidebar-brand, .topbar{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background-image:none !important;
  }
  .sidebar{ background:linear-gradient(175deg, var(--navy) 0%, var(--navy-deep) 100%) !important; }
  .topbar{ background:var(--paper-card-solid) !important; }

  /* V380.4/V380.7/V380.8 — إلغاء لمعان المرور المتحرك عند الطباعة (بلا تأثير بصري في الورق) */
  button::before, .btn::before, [class*="btn"]::before, .nav-item::before, .dash-kpi-card::before,
  .modal-box::before, .plan-modal-box::before, .modal::before, .modal-content::before, .popup-box::before, .dialog-box::before{
    display:none !important;
  }
}