/* ============================================================
   ثيم «Lumen» — جسر رموز فوق site.css، يشمل الوضعين النهاري والليلي
   المصدر: Bootswatch v5.3.8 · Theme: lumen (MIT) — نُقلت منه القيم اللونية فقط.
   لا يُحمَّل ملف Bootstrap ثانٍ: مشروعنا على Bootstrap 5.3.3 ويبقى كما هو.

   يُحمَّل بعد site.css وفقط عندما يختار المالك «lumen» من الإعدادات العامّة.
   فإن كان المختار «الكلاسيكي» لا يُرسَل هذا الملف أصلاً، ويبقى الوضعان كما كانا.

   ── بنية الملف ─────────────────────────────────────────────
   القسم (أ) نهاري:  :root:not([data-theme="dark"])
   القسم (ب) ليلي:   :root[data-theme="dark"]
   لا توجد قاعدة بلا حارس وضعٍ — كل قاعدة تنتمي إلى أحد القسمين صراحةً،
   حتى يبقى الفرز واضحاً ويمكن فحصه آلياً.

   ── قواعد إلزامية عند التعديل ──────────────────────────────
   ١) لا تُستعمل [data-theme="light"] أبداً: theme.js يحذف السمة ولا يضبطها
      بقيمة، فالمحدِّد لن يطابق شيئاً. النهاري = غياب السمة.
   ٢) الخصائص المسموحة: الألوان فقط — color / background* / border-color /
      box-shadow / outline-color / المتغيّرات (--*).
      ممنوع: width / height / display / position / padding / margin /
      border-width / border-style / flex / grid / font-family.
      هذا ما يضمن بقاء الشريط الجانبي جانبياً بلا أي تغيير في التخطيط.
   ٣) --font لا يُلمَس إطلاقاً: خط Tajawal إلزامي للعربية
      (خطّ Lumen اللاتيني Source Sans Pro لا يرسم العربية).
   ٤) انتبه لتضخّم الخصوصية: الحارس يزيد كل محدِّد بمقدار (0,2,0)، فقد يتفوّق
      على قاعدة في site.css كانت تخسر عمداً. تحقّق دائماً من قواعد @media
      ومن ‎a:hover‎ مقابل ‎.btn-brand:hover‎ (لهذا نكتب ‎a:not(.btn):hover‎).

   ملاحظة: «البنفسجي» (.et-badge-violet) أُعيد لونه إلى أزرق الهوية في site.css،
   فيتبع هنا تركوازي الشارة الزرقاء في وضعي Lumen.
   ============================================================ */

/* ═══════════════════ القسم (أ) — الوضع النهاري ═══════════════════ */

/* ═══════════ ١) رموز التصميم ═══════════ */
:root:not([data-theme="dark"]) {
    --bg-900:        #f6f6f6;   /* lumen --bs-tertiary-bg  */
    --bg-850:        #f0f0f0;   /* lumen --bs-secondary-bg */
    --bg-800:        #e7e7e7;
    --bg-750:        #dcdcdc;
    --bg-700:        #cfcfcf;

    --surface:       #ffffff;   /* lumen --bs-body-bg */
    --surface-2:     #f0f0f0;
    --border:        #dee2e6;   /* lumen --bs-border-color */
    --border-strong: #c8ced3;

    --text:          #222222;   /* lumen --bs-body-color */
    --text-muted:    #555555;
    --text-dim:      #767676;

    --brand:         #158cba;   /* lumen --bs-primary */
    --brand-2:       #117095;   /* lumen btn-primary:active — شريك التدرّج */
    --brand-glow:    rgba(21, 140, 186, .25);

    --success:       #28b62c;
    --warning:       #ff851b;
    --danger:        #ff4136;
    --info:          #75caeb;

    /* رموز «حبر» للنصوص: ألوان Lumen الصريحة ضعيفة التباين كنصّ على أبيض
       (‎#28b62c ≈ 2.6:1، ‎#ff4136 ≈ 3.4:1) فتُستعمل هذه للنصوص فقط.
       القيم من --bs-*-text-emphasis في Lumen نفسه. */
    --success-ink:   #104912;
    --danger-ink:    #661a16;
    --warning-ink:   #66350b;
    --brand-ink:     #08384a;

    --shadow:        0 4px 12px -6px rgba(0, 0, 0, .16);
    --shadow-lg:     0 16px 36px -14px rgba(0, 0, 0, .22);

    /* --radius / --radius-sm بلا تغيير: Lumen مطابق للأصل في أنصاف الأقطار. */

    /* ═══════════ ٢) جسر متغيّرات Bootstrap ═══════════
       site.css لا يشير إلى أي ‎--bs-*‎ إطلاقاً، لكن مكوّنات Bootstrap
       المستعملة فعلاً (‎.form-control ×228، ‎.btn ×280، ‎.form-select ×28)
       تقرأ منها مباشرة. */
    --bs-primary: #158cba;  --bs-primary-rgb: 21, 140, 186;
    --bs-success: #28b62c;  --bs-success-rgb: 40, 182, 44;
    --bs-danger:  #ff4136;  --bs-danger-rgb: 255, 65, 54;
    --bs-warning: #ff851b;  --bs-warning-rgb: 255, 133, 27;
    --bs-info:    #75caeb;  --bs-info-rgb: 117, 202, 235;

    --bs-primary-text-emphasis: #08384a;
    --bs-success-text-emphasis: #104912;
    --bs-danger-text-emphasis:  #661a16;
    --bs-warning-text-emphasis: #66350b;
    --bs-info-text-emphasis:    #2f515e;

    --bs-primary-bg-subtle: #d0e8f1;  --bs-primary-border-subtle: #a1d1e3;
    --bs-success-bg-subtle: #d4f0d5;  --bs-success-border-subtle: #a9e2ab;
    --bs-danger-bg-subtle:  #ffd9d7;  --bs-danger-border-subtle:  #ffb3af;
    --bs-warning-bg-subtle: #ffe7d1;  --bs-warning-border-subtle: #ffcea4;
    --bs-info-bg-subtle:    #e3f4fb;  --bs-info-border-subtle:    #c8eaf7;

    --bs-body-color: #222222;  --bs-body-color-rgb: 34, 34, 34;
    --bs-body-bg: #ffffff;
    --bs-secondary-color: rgba(34, 34, 34, .75);
    --bs-secondary-bg: #f0f0f0;  --bs-secondary-bg-rgb: 240, 240, 240;
    --bs-tertiary-color: rgba(34, 34, 34, .5);
    --bs-tertiary-bg: #f6f6f6;   --bs-tertiary-bg-rgb: 246, 246, 246;
    --bs-border-color: #dee2e6;

    --bs-link-color: #158cba;        --bs-link-color-rgb: 21, 140, 186;
    --bs-link-hover-color: #117095;  --bs-link-hover-color-rgb: 17, 112, 149;
    --bs-focus-ring-color: rgba(21, 140, 186, .25);
    --bs-form-valid-color: #28b62c;    --bs-form-valid-border-color: #28b62c;
    --bs-form-invalid-color: #ff4136;  --bs-form-invalid-border-color: #ff4136;

    /* دفاع مضاعف على الخط — الاسم ‎--bs-font-sans-serif‎ لا ‎--bs-font-family-sans-serif‎ */
    --bs-font-sans-serif: var(--font);

    /* ألوان مضمّنة في وجهات بعينها: تُعرَّف هنا فقط، والوجهة تكتبها هكذا
       ‎var(--hero-grad-1, #60a5fa)‎ — أي أن قيمتها الاحتياطية هي اللون الأصلي.
       فتبقى «الحالي» والوضع الليلي كما هما تماماً (المتغيّر غير معرَّف أصلاً)،
       ولا تتبدّل إلّا هنا. */
    --hero-grad-1: #158cba;   /* Views/Home/Index.cshtml — عنوان الصفحة الرئيسة */
    --hero-grad-2: #75caeb;
    --jr-accent-rgb: 21, 140, 186;  /* Views/Dashboard/Index.cshtml — رقاقة «الخطوة التالية» */
    --jr-grad-1: #158cba;           /* شريط تقدّم الرحلة */
    --jr-grad-2: #28b62c;
    --jr-grad-3: #ff851b;           /* الشريط المصغّر */
}

/* ═══════════ ٣) مرايا القواعد ذات الألوان المكتوبة نصّاً في site.css ═══════════
   هذه القواعد لا تقرأ من الرموز، فلا تتبع التبديل تلقائياً. كل سطر هنا
   يقابل سطراً في site.css يثبّت لوناً من عائلة الأزرق/الأردوازي القديمة. */

/* الخلفية والعناوين والروابط (site.css:59-78) */
:root:not([data-theme="dark"]) body {
    background:
        radial-gradient(1200px 600px at 100% -10%, rgba(21, 140, 186, .08), transparent 60%),
        radial-gradient(900px 500px at -10% 10%, rgba(117, 202, 235, .10), transparent 55%),
        var(--bg-900);
}
/* ‎:not(.btn)‎ إلزامي: في site.css القاعدة ‎a:hover‎ خصوصيّتها (0,1,1) فتخسر أمام
   ‎.btn-brand:hover‎ (0,2,0)، أمّا هنا فحارس ‎:root:not(...)‎ يرفعها إلى (0,3,1)
   فتتفوّق عليها وتصبغ نصّ الأزرار الرابطة (مثل «متابعة») بلون داكن فوق خلفية داكنة. */
:root:not([data-theme="dark"]) a:not(.btn):hover { color: #117095; }
:root:not([data-theme="dark"]) h1, :root:not([data-theme="dark"]) h2,
:root:not([data-theme="dark"]) h3, :root:not([data-theme="dark"]) h4,
:root:not([data-theme="dark"]) h5, :root:not([data-theme="dark"]) h6 { color: #222222; }

/* الأشرطة (site.css:91-130, 378-396) — ألوان فقط، لا مواضع */
:root:not([data-theme="dark"]) .et-navbar  { background: rgba(255, 255, 255, .90); }
:root:not([data-theme="dark"]) .et-brand   { color: #222222; }
:root:not([data-theme="dark"]) .et-topbar  { background: rgba(255, 255, 255, .93); }
/* الشريط الجانبي بلون مخضرّ خفيف (لا أبيض) يتماشى مع هوية Lumen. */
:root:not([data-theme="dark"]) .et-sidebar { background: rgba(21, 140, 186, .11); }
/* الجوال: الشريط الجانبي المنزلق غير شفّاف — قاعدة site.css داخل @media خصوصيّتها (0,1,0)
   والقاعدة أعلاه (0,3,0) بلا @media فتتفوّق عليها وتُرجع الشفافية. تُعاد هنا داخل نفس الاستعلام. */
@media (max-width: 991.98px) {
    :root:not([data-theme="dark"]) .et-sidebar { background: #e0edf3; }
}
:root:not([data-theme="dark"]) .et-nav-link:hover,
:root:not([data-theme="dark"]) .et-nav-link.active { background: rgba(21, 140, 186, .10); }

/* الأسطح التي عليها نصّ أبيض فوق لون العلامة (site.css:114, 171, 734).
   لون Lumen الأساسي ‎#158cba‎ تباينه مع الأبيض ‎3.82:1‎ فقط — دون حدّ WCAG AA (‎4.5:1‎).
   وبما أن التدرّج ‎135deg‎ يبدأ به، فالأزرار الصغيرة (شبكة/متابعة) لا تُظهر إلّا بدايته
   فيبهت نصّها، بينما الزرّ العريض (دخول) يصل إلى طرفه الداكن فيُقرأ جيّداً.
   الحلّ: يبدأ التدرّج من الطرف الداكن نفسه، فتتساوى كل الأحجام بوضوح زرّ «دخول».
   ‎--brand‎ نفسها لا تُمَسّ: فهي صحيحة للروابط والبلاطات على خلفية فاتحة. */
/* ‎:not(.step-num-off)‎ ضروري: الخطوة غير المتاحة تأخذ الصنفين معاً،
   وهذه القاعدة (0,4,0) تتفوّق على ‎.step-num-off‎ (0,2,0) فتُلوّنها بلون العلامة خطأً. */
:root:not([data-theme="dark"]) .btn-brand,
:root:not([data-theme="dark"]) .et-brand .logo,
:root:not([data-theme="dark"]) .simple-home .step-num:not(.step-num-off) {
    background: linear-gradient(135deg, #117095, #0e5f7d);   /* 5.56:1 و 7.11:1 */
}
:root:not([data-theme="dark"]) details.et-hint[open] > summary {
    background: #117095;
    border-color: #117095;
}

/* الأزرار (site.css:184-201) — btn-brand/btn-ghost هما زرّا التطبيق الفعليّان */
:root:not([data-theme="dark"]) .btn-ghost { background: rgba(21, 140, 186, .08); }
:root:not([data-theme="dark"]) .btn-ghost:hover { background: rgba(0, 0, 0, .06); }
:root:not([data-theme="dark"]) .btn-outline-light-soft:hover { background: rgba(0, 0, 0, .05); }

/* الشارات (site.css:216-219) — تُعاد الثلاثية كاملةً لأن اللون والخلفية والحدّ مثبّتة */
:root:not([data-theme="dark"]) .et-badge-emerald { color: #104912; background: rgba(40, 182, 44, .14);  border-color: rgba(40, 182, 44, .34); }
:root:not([data-theme="dark"]) .et-badge-orange  { color: #66350b; background: rgba(255, 133, 27, .16); border-color: rgba(255, 133, 27, .36); }
:root:not([data-theme="dark"]) .et-badge-blue,
:root:not([data-theme="dark"]) .et-badge-violet  { color: #08384a; background: rgba(21, 140, 186, .14); border-color: rgba(21, 140, 186, .36); }
/* «البنفسجي» صار أزرق الهوية — في Lumen يتبع تركوازي الشارة الزرقاء، بما في ذلك حدّ طيّة المحتوى المستنسَخ. */
:root:not([data-theme="dark"]) details.et-fold > summary.et-fold-head:has(.et-badge-violet) {
    border-color: rgba(21, 140, 186, .45); background: rgba(21, 140, 186, .10); color: #0e5f7d;
}
:root:not([data-theme="dark"]) details.et-fold > summary.et-fold-head:has(.et-badge-violet):hover {
    background: rgba(21, 140, 186, .18); border-color: rgba(21, 140, 186, .6);
}
:root:not([data-theme="dark"]) details.et-fold > summary.et-fold-head:has(.et-badge-violet)::before { color: #0e5f7d; }

/* النماذج (site.css:230-249) — الحدّ ‎#c3cedd‎ مثبّت فلا يتبع الرموز.
   الظلّ الداخلي هو توقيع Lumen البصري الوحيد المنقول. */
:root:not([data-theme="dark"]) .form-control,
:root:not([data-theme="dark"]) .form-select {
    border-color: #dee2e6;
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, .075);
}
:root:not([data-theme="dark"]) .form-control:focus,
:root:not([data-theme="dark"]) .form-select:focus {
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, .075), 0 0 0 3px var(--brand-glow);
}

/* الجداول وأشرطة التقدّم (site.css:277-309) */
:root:not([data-theme="dark"]) .et-progress { background: rgba(0, 0, 0, .10); }
:root:not([data-theme="dark"]) .et-table tr:hover td { background: rgba(0, 0, 0, .035); }

/* بلاطات الأيقونات وبطاقات الأقسام (site.css:349-350, 629-630) */
:root:not([data-theme="dark"]) .et-icon-tile,
:root:not([data-theme="dark"]) .et-section-card .ico {
    background: rgba(21, 140, 186, .12);
    border-color: rgba(21, 140, 186, .32);
}

/* روابط الشريط الجانبي والشجرة (site.css:421-492) — ألوان فقط */
:root:not([data-theme="dark"]) .et-side-link:hover,
:root:not([data-theme="dark"]) .et-tree-link:hover { background: rgba(0, 0, 0, .045); }
:root:not([data-theme="dark"]) .et-side-link.active,
:root:not([data-theme="dark"]) .et-tree-link.active {
    background: linear-gradient(135deg, rgba(21, 140, 186, .14), rgba(117, 202, 235, .12));
    border-color: rgba(21, 140, 186, .32);
}
:root:not([data-theme="dark"]) details.et-fold > summary.et-fold-head:hover { background: rgba(0, 0, 0, .04); }

/* الحُجُب والحوارات (site.css:598, 809, 1030-1034) */
/* ‎.et-backdrop.show‎ لها قاعدة داخل @media الجوال تضبط الخلفية أيضاً؛ القيمتان حجابان
   داكنان متكافئان بصرياً فلا أثر مرئي للتفوّق عليها. */
:root:not([data-theme="dark"]) .et-backdrop.show,
:root:not([data-theme="dark"]) .et-dialog::backdrop { background: rgba(0, 0, 0, .45); }
:root:not([data-theme="dark"]) .et-srch-backdrop { background: rgba(0, 0, 0, .35); }
:root:not([data-theme="dark"]) .et-dialog { box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .30); }

/* البحث والشريط المتحرّك (site.css:877, 932-934) */
:root:not([data-theme="dark"]) .et-srch-hl { background: rgba(21, 140, 186, .24); }
:root:not([data-theme="dark"]) .et-marquee {
    background: linear-gradient(90deg, rgba(21, 140, 186, .16), rgba(117, 202, 235, .20));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .06);
}

/* شريط التحليل السفلي (site.css:972-987) — كان نيلياً/بنفسجياً */
:root:not([data-theme="dark"]) .et-anbar          { box-shadow: 0 -8px 24px rgba(0, 0, 0, .12); }
:root:not([data-theme="dark"]) .et-anbar-progress { background: linear-gradient(90deg, #158cba, #75caeb); }
:root:not([data-theme="dark"]) .et-anbar-spinner  { border-top-color: #158cba; }
:root:not([data-theme="dark"]) .et-anbar-check    { color: var(--success-ink); }

/* التنبيهات المنبثقة (site.css:1104-1115) */
:root:not([data-theme="dark"]) .et-toast      { box-shadow: 0 12px 30px -14px rgba(0, 0, 0, .20); }
:root:not([data-theme="dark"]) .et-toast-ok   { border-inline-start-color: #28b62c; }
:root:not([data-theme="dark"]) .et-toast-err  { border-inline-start-color: #ff4136; }
:root:not([data-theme="dark"]) .et-toast-info { border-inline-start-color: #158cba; }
:root:not([data-theme="dark"]) .et-toast-warn { border-inline-start-color: #ff851b; }

/* شارات الإشعارات ورقائق الشواهد (site.css:1067-1084) */
:root:not([data-theme="dark"]) .et-nav-badge { background: #ff4136; box-shadow: 0 0 0 2px rgba(255, 65, 54, .22); }
:root:not([data-theme="dark"]) .et-ev-chip--pending  { color: var(--warning-ink); background: rgba(255, 133, 27, .18); }
:root:not([data-theme="dark"]) .et-ev-chip--rejected { color: var(--danger-ink);  background: rgba(255, 65, 54, .14); }

/* زرّ دور العضو (site.css:797) — الأزرق يتبع العلامة، والبنفسجي (mgr) يبقى */
:root:not([data-theme="dark"]) .et-tbtn--role.mbr { border-color: rgba(21, 140, 186, .34); }

/* ═══════════ ٤) أغطية التوافق (site.css:636-642) ═══════════
   تلك الأغطية توجّه الألوان المضمّنة (inline) المعدّة للثيم الداكن إلى
   ‎--danger/--success‎ الخامّين، وهما ضعيفا التباين في لوحة Lumen،
   فتُعاد إلى رموز الحبر. الخصوصية (0,3,0) + ترتيب مصدر لاحق ⇒ تتفوّق. */
:root:not([data-theme="dark"]) [style*="fca5a5"] { color: var(--danger-ink)  !important; }
:root:not([data-theme="dark"]) [style*="6ee7b7"] { color: var(--success-ink) !important; }
:root:not([data-theme="dark"]) .text-emerald     { color: var(--success-ink) !important; }
/* ‎[style*="93c5fd"]‎ يتبع var(--brand) تلقائياً — لا حاجة لإعادة توجيه. */


/* ═══════════════════ القسم (ب) — الوضع الليلي ═══════════════════
   الوضع الليلي يتبع الثيم المختار أيضاً. لوحة Lumen الليلية فحميّة محايدة
   (‎#222‎ / ‎#2b2b2b‎ / ‎#333‎) بلمسات تركوازية — لا أردوازية مزرقّة كالكلاسيكي.
   القيم منقولة من كتلة ‎[data-bs-theme=dark]‎ في ملف Bootswatch نفسه.

   الخصوصية: كتلة الرموز هنا (0,2,0) كما في site.css لكنها تُحمَّل بعدها فتفوز.
   وقواعد المكوّنات هنا (0,3,0) مقابل ‎[data-theme="dark"] .x‎ (0,2,0) فتفوز. */

:root[data-theme="dark"] {
    --bg-900:        #1a1a1a;
    --bg-850:        #222222;   /* lumen dark --bs-body-bg */
    --bg-800:        #2b2b2b;   /* lumen dark --bs-tertiary-bg */
    --bg-750:        #333333;   /* lumen dark --bs-secondary-bg */
    --bg-700:        #3f3f3f;

    --surface:       rgba(43, 43, 43, .72);
    --surface-2:     rgba(26, 26, 26, .60);
    --border:        rgba(222, 226, 230, .15);
    --border-strong: rgba(222, 226, 230, .28);

    --text:          #dee2e6;   /* lumen dark --bs-body-color */
    --text-muted:    #adb5bd;
    --text-dim:      #868e96;

    /* على الخلفية الفحميّة يلزم تركوازي فاتح للروابط والنصوص.
       أمّا خلفيات الأزرار فتُعالَج أدناه بتدرّج داكن حتى يبقى النصّ أبيض مقروءاً. */
    --brand:         #5bb7d6;
    --brand-2:       #75caeb;
    --brand-glow:    rgba(91, 183, 214, .35);

    --success:       #7ed380;   /* lumen dark --bs-success-text-emphasis */
    --warning:       #ffb676;   /* lumen dark --bs-warning-text-emphasis */
    --danger:        #ff8d86;   /* lumen dark --bs-danger-text-emphasis  */
    --info:          #acdff3;   /* lumen dark --bs-info-text-emphasis    */

    /* في الليلي النصّ فاتح أصلاً، فرموز «الحبر» تساوي الألوان نفسها. */
    --success-ink:   #7ed380;
    --danger-ink:    #ff8d86;
    --warning-ink:   #ffb676;
    --brand-ink:     #73bad6;

    --shadow:        0 10px 30px -10px rgba(0, 0, 0, .6);
    --shadow-lg:     0 24px 60px -15px rgba(0, 0, 0, .7);

    /* جسر Bootstrap — قيم Lumen الليلية */
    --bs-primary: #158cba;  --bs-primary-rgb: 21, 140, 186;
    --bs-success: #28b62c;  --bs-success-rgb: 40, 182, 44;
    --bs-danger:  #ff4136;  --bs-danger-rgb: 255, 65, 54;
    --bs-warning: #ff851b;  --bs-warning-rgb: 255, 133, 27;
    --bs-info:    #75caeb;  --bs-info-rgb: 117, 202, 235;

    --bs-primary-text-emphasis: #73bad6;
    --bs-success-text-emphasis: #7ed380;
    --bs-danger-text-emphasis:  #ff8d86;
    --bs-warning-text-emphasis: #ffb676;
    --bs-info-text-emphasis:    #acdff3;

    --bs-primary-bg-subtle: #041c25;  --bs-primary-border-subtle: #0d5470;
    --bs-success-bg-subtle: #082409;  --bs-success-border-subtle: #186d1a;
    --bs-danger-bg-subtle:  #330d0b;  --bs-danger-border-subtle:  #992720;
    --bs-warning-bg-subtle: #331b05;  --bs-warning-border-subtle: #995011;
    --bs-info-bg-subtle:    #17282f;  --bs-info-border-subtle:    #467a8d;

    --bs-body-color: #dee2e6;  --bs-body-color-rgb: 222, 226, 230;
    --bs-body-bg: #222222;     --bs-body-bg-rgb: 34, 34, 34;
    --bs-secondary-color: rgba(222, 226, 230, .75);
    --bs-secondary-bg: #333333;  --bs-secondary-bg-rgb: 51, 51, 51;
    --bs-tertiary-color: rgba(222, 226, 230, .5);
    --bs-tertiary-bg: #2b2b2b;   --bs-tertiary-bg-rgb: 43, 43, 43;
    --bs-border-color: #495057;

    --bs-link-color: #73bad6;        --bs-link-color-rgb: 115, 186, 214;
    --bs-link-hover-color: #8fc8de;  --bs-link-hover-color-rgb: 143, 200, 222;
    --bs-focus-ring-color: rgba(91, 183, 214, .35);

    --bs-font-sans-serif: var(--font);

    /* الألوان المضمّنة في الوجهات (انظر القسم أ) — تتبع الثيم في الليلي أيضاً */
    --hero-grad-1: #5bb7d6;
    --hero-grad-2: #75caeb;
    --jr-accent-rgb: 91, 183, 214;
    --jr-grad-1: #5bb7d6;
    --jr-grad-2: #7ed380;
    --jr-grad-3: #ffb676;
}

/* مرايا القواعد ذات الألوان المثبّتة في كتلة الوضع الليلي بـ site.css (الأسطر 672-718) */
:root[data-theme="dark"] body {
    background:
        radial-gradient(1200px 600px at 100% -10%, rgba(91, 183, 214, .10), transparent 60%),
        radial-gradient(900px 500px at -10% 10%, rgba(117, 202, 235, .07), transparent 55%),
        var(--bg-900);
}
/* ‎:not(.btn)‎ للسبب ذاته الموضَّح في القسم (أ) — ومثله في site.css بعد الإصلاح. */
:root[data-theme="dark"] a:not(.btn):hover { color: #8fc8de; }
:root[data-theme="dark"] h1, :root[data-theme="dark"] h2,
:root[data-theme="dark"] h3, :root[data-theme="dark"] h4,
:root[data-theme="dark"] h5, :root[data-theme="dark"] h6 { color: #f1f3f5; }

:root[data-theme="dark"] .et-navbar  { background: rgba(26, 26, 26, .74); }
:root[data-theme="dark"] .et-brand   { color: #f8f9fa; }
:root[data-theme="dark"] .et-topbar  { background: rgba(26, 26, 26, .84); }
:root[data-theme="dark"] .et-sidebar { background: rgba(34, 34, 34, .55); }
/* الجوال: غير شفّافين — نفس فخّ @media الموضَّح في القسم (أ) */
@media (max-width: 991.98px) {
    :root[data-theme="dark"] .et-topbar  { background: #1a1a1a; }
    :root[data-theme="dark"] .et-sidebar { background: var(--bg-850); }
}
:root[data-theme="dark"] .et-nav-link:hover,
:root[data-theme="dark"] .et-nav-link.active { background: rgba(222, 226, 230, .10); }

/* خلفيات الأزرار: ‎--brand‎ الليلي تركوازي فاتح، والنصّ عليه أبيض، فيلزم تدرّج داكن.
   ‎#14809f‎ تباينه مع الأبيض ‎4.62:1‎ و‎#0f6a8c‎ ‎6.07:1‎ — يعبران WCAG AA،
   وهما أفتح بوضوح من خلفية الصفحة ‎#1a1a1a‎ فيظهر الزرّ. */
:root[data-theme="dark"] .btn-brand,
:root[data-theme="dark"] .et-brand .logo,
:root[data-theme="dark"] .simple-home .step-num:not(.step-num-off) {
    background: linear-gradient(135deg, #14809f, #0f6a8c);
}
/* ‎[data-theme="dark"] a:hover‎ في site.css (0,2,1) تتفوّق على ‎.btn-brand:hover‎ (0,2,0)؛
   أُصلحت هناك بـ ‎:not(.btn)‎، وهذا تثبيتٌ إضافي للبياض. */
:root[data-theme="dark"] .btn-brand,
:root[data-theme="dark"] .btn-brand:hover { color: #fff; }
:root[data-theme="dark"] details.et-hint[open] > summary {
    background: #14809f;
    border-color: #14809f;
}

:root[data-theme="dark"] .btn-ghost { background: rgba(222, 226, 230, .10); }
:root[data-theme="dark"] .btn-ghost:hover { background: rgba(222, 226, 230, .18); }
:root[data-theme="dark"] .btn-outline-light-soft:hover { background: rgba(222, 226, 230, .12); }

:root[data-theme="dark"] .et-badge-emerald { color: #7ed380; }
:root[data-theme="dark"] .et-badge-orange  { color: #ffb676; }
:root[data-theme="dark"] .et-badge-blue,
:root[data-theme="dark"] .et-badge-violet  { color: #8fc8de; }
:root[data-theme="dark"] details.et-fold > summary.et-fold-head:has(.et-badge-violet) { color: #8fc8de; }
:root[data-theme="dark"] details.et-fold > summary.et-fold-head:has(.et-badge-violet)::before { color: #8fc8de; }

:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .form-select { background: var(--surface-2); border-color: var(--border); }
:root[data-theme="dark"] .form-control:focus,
:root[data-theme="dark"] .form-select:focus { background: var(--surface-2); }

:root[data-theme="dark"] .et-progress { background: rgba(222, 226, 230, .14); }
:root[data-theme="dark"] .et-table tr:hover td { background: rgba(222, 226, 230, .05); }

:root[data-theme="dark"] .et-icon-tile,
:root[data-theme="dark"] .et-section-card .ico {
    background: rgba(91, 183, 214, .14);
    border-color: rgba(91, 183, 214, .32);
}

:root[data-theme="dark"] .et-side-link:hover,
:root[data-theme="dark"] .et-tree-link:hover { background: rgba(222, 226, 230, .10); }
:root[data-theme="dark"] .et-side-link.active,
:root[data-theme="dark"] .et-tree-link.active {
    color: #fff;
    background: linear-gradient(135deg, rgba(91, 183, 214, .22), rgba(117, 202, 235, .16));
    border-color: rgba(91, 183, 214, .35);
}
:root[data-theme="dark"] details.et-fold > summary.et-fold-head:hover { background: rgba(222, 226, 230, .08); }

:root[data-theme="dark"] .et-srch-hl { background: rgba(91, 183, 214, .28); }
:root[data-theme="dark"] .et-marquee {
    background: linear-gradient(90deg, rgba(91, 183, 214, .18), rgba(117, 202, 235, .16));
    box-shadow: inset 0 -1px 0 rgba(222, 226, 230, .10);
}

:root[data-theme="dark"] .et-anbar-progress { background: linear-gradient(90deg, #5bb7d6, #75caeb); }
:root[data-theme="dark"] .et-anbar-spinner  { border-top-color: #5bb7d6; }
:root[data-theme="dark"] .et-anbar-check    { color: #7ed380; }

:root[data-theme="dark"] .et-toast-ok   { border-inline-start-color: #7ed380; }
:root[data-theme="dark"] .et-toast-err  { border-inline-start-color: #ff8d86; }
:root[data-theme="dark"] .et-toast-info { border-inline-start-color: #5bb7d6; }
:root[data-theme="dark"] .et-toast-warn { border-inline-start-color: #ffb676; }

:root[data-theme="dark"] .et-nav-badge { background: #ff8d86; box-shadow: 0 0 0 2px rgba(255, 141, 134, .22); }
:root[data-theme="dark"] .et-ev-chip--pending  { color: #ffb676; background: rgba(255, 182, 118, .16); }
:root[data-theme="dark"] .et-ev-chip--rejected { color: #ff8d86; background: rgba(255, 141, 134, .14); }

:root[data-theme="dark"] .et-tbtn--role.mbr { border-color: rgba(91, 183, 214, .34); }