/* ============================================================================
   نظام التصميم — المتغيّرات
   الهوية منقولة من التصميم القديم في index.html:
     كحلي #1e4268 (وتحويمه #132b45، ومشتقّه الفاتح #2b5c8f)
     أرضية #f4f6f9 · حدود #cbd5e1 · نص #1f2937
     خطر #dc2626 · نجاح #16a34a · تحذير #d97706
   والخط Arial كما كان — لا خط زخرفي ولا خط محمَّل من الشبكة.

   السُّلَّمان أدناه مشتقّان من لوني الهوية لا معزولان عنهما: الدرجة 600 في
   الكحلي هي لون الهوية نفسه، و700 هي لون التحويم، و500 هي اللون المشتقّ.
   ============================================================================ */

:root {
  /* ─── الكحلي: سُلَّم حول #1e4268 ──────────────────────────────────────── */
  --nv-50:  #f1f5f9;
  --nv-100: #dde7f0;
  --nv-200: #bcd0e2;
  --nv-300: #8fb0cd;
  --nv-400: #5b86ad;
  --nv-500: #2b5c8f;   /* المشتقّ الفاتح — accent-blue القديم */
  --nv-600: #1e4268;   /* الأساس — primary-color القديم */
  --nv-700: #132b45;   /* التحويم — primary-hover القديم */
  --nv-800: #0d1f33;
  --nv-900: #081422;

  /* ─── الكهرماني: سُلَّم حول #d97706 (لون التحذير القديم) ──────────────── */
  --am-50:  #fdf6ec;
  --am-100: #fbe9cd;
  --am-200: #f6d199;
  --am-300: #eeb45c;
  --am-400: #e19527;
  --am-500: #d97706;
  --am-600: #ad5f05;
  --am-700: #7d4404;

  /* ─── محايدات باردة تناسب الكحلي ─────────────────────────────────────── */
  --n-0:   #ffffff;
  --n-25:  #fbfcfd;
  --n-50:  #f4f6f9;   /* bg-color القديم */
  --n-100: #eef2f6;
  --n-200: #e2e8f0;   /* section-bg القديم */
  --n-300: #cbd5e1;   /* border-color القديم */
  --n-400: #94a3b8;
  --n-500: #64748b;
  --n-600: #475569;
  --n-700: #334155;
  --n-800: #1f2937;   /* text-color القديم */
  --n-900: #131c29;
  --n-950: #0b131c;

  /* ─── دلالية ─────────────────────────────────────────────────────────── */
  --ok:      #16a34a;  --ok-bg:      #e8f7ee;  --ok-br:      #a7dfbd;
  --warn:    #d97706;  --warn-bg:    #fdf3e3;  --warn-br:    #f3cd92;
  --danger:  #dc2626;  --danger-bg:  #fdecec;  --danger-br:  #f5b4b4;
  --info:    #0369a1;  --info-bg:    #e6f2fa;  --info-br:    #a3cde7;

  /* ─── ألوان الرسوم ───────────────────────────────────────────────────── */
  /* مشتقّة من هوى الكحلي (250°) والكهرماني (65°) ثم مُرِّرت على مدقّق مهارة
     dataviz حتى اجتازت: نطاق الإضاءة · أرضية التشبّع · فصل عمى الألوان ·
     التباين مقابل السطح.
       viz-1/2  فئوي (سلسلتان) ΔE 30.1 نهاري · 28.9 ليلي. الكهرماني النهاري
                تباينه 2.76:1 دون 3:1، فيلزمه تعويض: تسمية مباشرة عند طرف
                الخط وعرض جدولي — وكلاهما مشحون في المخططات.
       viz-ord  ترتيبي ٦ درجات (مراحل الاعتماد) — هوى واحد، ΔL ≥ 0.06
       viz-heat متدرّج ٤ درجات (عدد المخاطر) — طرفه الفاتح يقترب من السطح
                عمدًا، وهذا مسموح للمقاييس المتدرّجة دون الترتيبية */
  --viz-1: #005eb3;
  --viz-2: #e18600;

  --viz-ord-1: #73b6fa;  --viz-ord-2: #5d9fe2;  --viz-ord-3: #4789ca;
  --viz-ord-4: #3073b3;  --viz-ord-5: #175e9b;  --viz-ord-6: #004985;

  --viz-heat-1: #93d7ff; --viz-heat-2: #69acef;
  --viz-heat-3: #4082c3; --viz-heat-4: #125a98;
  /* حبر العدد داخل الخلية: يتبع إضاءة التعبئة لا قيمة الخلية */
  --viz-heat-1-ink: #0b131c; --viz-heat-2-ink: #0b131c;
  --viz-heat-3-ink: #ffffff; --viz-heat-4-ink: #ffffff;

  /* ─── أدوار الأسطح ───────────────────────────────────────────────────── */
  --bg:         var(--n-50);
  --surface:    var(--n-0);
  --surface-2:  var(--n-25);
  --surface-3:  var(--n-100);
  --border:     var(--n-300);
  --border-str: var(--n-400);

  --text:      var(--n-800);
  --text-2:    var(--n-600);
  --text-3:    var(--n-500);
  --text-inv:  var(--n-0);

  --brand:      var(--nv-600);
  --brand-hov:  var(--nv-700);
  --brand-soft: var(--nv-50);
  --accent:     var(--am-500);

  --sidebar-bg:     var(--nv-700);
  --sidebar-text:   #c2d2e2;
  --sidebar-hover:  var(--nv-600);
  --sidebar-active: var(--nv-500);

  /* ─── مقاسات ─────────────────────────────────────────────────────────── */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;  --sp-12: 48px;

  /* أنصاف الأقطار كما في التصميم القديم: 4 · 6 · 8 · 12 */
  --r-sm: 4px;   --r: 6px;      --r-lg: 8px;   --r-xl: 12px;   --r-full: 999px;

  --fs-xs: .75rem;   --fs-sm: .8125rem;  --fs-base: .875rem;
  --fs-md: 1rem;     --fs-lg: 1.125rem;  --fs-xl: 1.375rem;   --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;

  --sh-sm: 0 1px 2px rgba(15,31,43,.06);
  --sh:    0 2px 8px rgba(15,31,43,.08), 0 1px 2px rgba(15,31,43,.04);
  --sh-lg: 0 8px 28px rgba(15,31,43,.12), 0 2px 6px rgba(15,31,43,.06);
  --sh-up: 0 -2px 12px rgba(15,31,43,.08);

  --sidebar-w: 248px;
  --topbar-h:  60px;

  --ease: cubic-bezier(.4, 0, .2, 1);
  --t-fast: .13s var(--ease);
  --t:      .2s var(--ease);

  /* الخط كما في التصميم القديم: Arial أولًا، ثم بدائل عربية للأنظمة التي
     لا تُجوّد رسمها العربي */
  --font: Arial, Helvetica, "Segoe UI", "Noto Sans Arabic", Tahoma, sans-serif;
  --mono: Consolas, "SF Mono", "Cascadia Code", "Courier New", monospace;
}

/* ─── الوضع الليلي ─────────────────────────────────────────────────────── */
/* التصميم القديم بلا وضع ليلي، والنظام الجديد يحتاجه. الهوية لا تنقلب:
   الكحلي يفتح ليبقى مقروءًا على خلفية داكنة، والأرضية تأخذ ميلًا كحليًا
   بدل الرمادي المحايد حتى تبقى الشاشة من العائلة نفسها. */

[data-theme="dark"] {
  --bg:         #0a121a;
  --surface:    #111c26;
  --surface-2:  #16232f;
  --surface-3:  #1d2c3a;
  --border:     #26374a;
  --border-str: #35495e;

  --text:     #e3ebf3;
  --text-2:   #a9bbcc;
  --text-3:   #7d92a6;
  --text-inv: var(--n-900);

  --brand:      var(--nv-300);
  --brand-hov:  var(--nv-200);
  --brand-soft: #142433;
  --accent:     var(--am-300);

  --sidebar-bg:     #0c1722;
  --sidebar-text:   #9db1c4;
  --sidebar-hover:  #16242f;
  --sidebar-active: var(--nv-600);

  --ok:     #4ade80;  --ok-bg:     #10261a;  --ok-br:     #1e5136;
  --warn:   #fbbf24;  --warn-bg:   #2a2011;  --warn-br:   #574117;
  --danger: #f87171;  --danger-bg: #2c1618;  --danger-br: #5d2629;
  --info:   #60a5fa;  --info-bg:   #101f2e;  --info-br:   #1e3b5a;

  --viz-1: #3899f3;
  --viz-2: #c66d00;

  --viz-ord-1: #0e5794;  --viz-ord-2: #2c6fae;  --viz-ord-3: #4587c8;
  --viz-ord-4: #5ea0e3;  --viz-ord-5: #76bafe;  --viz-ord-6: #90d4ff;

  --viz-heat-1: #003e78; --viz-heat-2: #2468a6;
  --viz-heat-3: #5295d6; --viz-heat-4: #80c3ff;
  --viz-heat-1-ink: #ffffff; --viz-heat-2-ink: #ffffff;
  --viz-heat-3-ink: #0b131c; --viz-heat-4-ink: #0b131c;

  --sh-sm: 0 1px 2px rgba(0,0,0,.4);
  --sh:    0 2px 10px rgba(0,0,0,.45);
  --sh-lg: 0 10px 34px rgba(0,0,0,.55);
  --sh-up: 0 -2px 14px rgba(0,0,0,.45);
}