/* =====================================================================
   رامه الذكية — نظام التصميم (الرموز)
   Ramh Smart — Design tokens
   ===================================================================== */

:root {
  /* ---------- الألوان الأساسية / core palette ---------- */
  --bg-0:        #0B1220;   /* أعمق طبقة */
  --bg-1:        #111A2B;   /* خلفية الصفحة */
  --bg-2:        #16202F;   /* أقسام متبادلة */
  --surface-1:   #1B2739;   /* البطاقات */
  --surface-2:   #223046;   /* بطاقات مرفوعة */
  --surface-3:   #2C3B54;   /* حالات التمرير */
  --overlay:     rgba(11, 18, 32, .78);

  /* ---------- ثلاثيات RGB (تُستخدم داخل rgba وتتبع الثيم) ---------- */
  --rgb-bg-0:      11, 18, 32;
  --rgb-bg-1:      17, 26, 43;
  --rgb-bg-2:      22, 32, 47;
  --rgb-surface-1: 27, 39, 57;
  --rgb-brand:     46, 122, 209;
  --rgb-brand-400: 78, 151, 228;
  --rgb-accent:    56, 208, 234;
  --rgb-line:      150, 184, 224;

  /* ---------- الهوية / brand ---------- */
  --brand-900:   #10315C;
  --brand-800:   #17417A;
  --brand-700:   #1D5297;
  --brand-600:   #2565B4;
  --brand-500:   #2E7AD1;   /* اللون الرئيسي من الشعار */
  --brand-400:   #4E97E4;
  --brand-300:   #7FB6F0;
  --brand-200:   #B4D5F8;

  /* ---------- لون تقني مساند / technical accent ---------- */
  --cyan-600:    #0E8FA8;
  --cyan-500:    #17B3D1;
  --cyan-400:    #38D0EA;
  --cyan-300:    #7CE3F5;

  /* ---------- دلالات / semantic ---------- */
  --ok:          #29C08A;
  --ok-dim:      rgba(41, 192, 138, .14);
  --warn:        #E9A93C;
  --warn-dim:    rgba(233, 169, 60, .14);
  --danger:      #E8595F;
  --danger-dim:  rgba(232, 89, 95, .14);
  --info:        #4E97E4;
  --info-dim:    rgba(78, 151, 228, .14);

  /* ---------- النص / text ---------- */
  --text-1:      #EAF1FA;
  --text-2:      #B7C6DA;
  --text-3:      #93A6BF;
  --text-4:      #8698B1;   /* أفتح من السابق ليحقّق تباين AA على كل الأسطح */
  --text-on-brand: #FFFFFF;

  /* ---------- الحدود والفواصل / lines ---------- */
  --line-1:      rgba(150, 184, 224, .15);
  --line-2:      rgba(150, 184, 224, .24);
  --line-3:      rgba(150, 184, 224, .36);
  --line-glow:   rgba(46, 122, 209, .45);

  /* ---------- تدرجات / gradients ---------- */
  --grad-brand:  linear-gradient(135deg, var(--brand-600) 0%, var(--brand-400) 55%, var(--cyan-400) 100%);
  --grad-brand-soft: linear-gradient(135deg, rgba(37,101,180,.20) 0%, rgba(23,179,209,.14) 100%);
  --grad-surface: linear-gradient(160deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,0) 60%);
  --grad-text:   linear-gradient(100deg, #FFFFFF 0%, #B4D5F8 45%, #7CE3F5 100%);
  --grad-line:   linear-gradient(90deg, transparent, var(--line-glow), transparent);

  /* ---------- الظلال / shadows ---------- */
  --sh-xs:  0 1px 2px rgba(0,0,0,.4);
  --sh-sm:  0 2px 8px rgba(0,0,0,.35);
  --sh-md:  0 10px 28px -8px rgba(0,0,0,.55);
  --sh-lg:  0 24px 60px -18px rgba(0,0,0,.7);
  --sh-xl:  0 40px 90px -28px rgba(0,0,0,.8);
  --glow-brand: 0 0 0 1px rgba(46,122,209,.35), 0 12px 40px -12px rgba(46,122,209,.55);
  --glow-cyan:  0 0 0 1px rgba(23,179,209,.30), 0 12px 40px -14px rgba(23,179,209,.5);

  /* ---------- الخطوط / typography ---------- */
  --font-ar: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --font-en: "IBM Plex Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", ui-monospace, Menlo, Consolas, monospace;
  --font: var(--font-ar);

  --fs-3xs: .6875rem;  /* 11 */
  --fs-2xs: .75rem;    /* 12 */
  --fs-xs:  .8125rem;  /* 13 */
  --fs-sm:  .875rem;   /* 14 */
  --fs-md:  .9375rem;  /* 15 */
  --fs-base: 1rem;     /* 16 */
  --fs-lg:  1.125rem;
  --fs-xl:  1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;
  --fs-5xl: 3.75rem;

  --lh-tight: 1.2;
  --lh-snug: 1.45;
  --lh-normal: 1.75;

  /* ---------- المسافات / spacing ---------- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.25rem; --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-10: 2.5rem;
  --sp-12: 3rem;   --sp-16: 4rem;   --sp-20: 5rem;   --sp-24: 6rem;
  --sp-32: 8rem;

  /* ---------- الأنصاف / radii ---------- */
  --r-xs: 4px;  --r-sm: 8px;  --r-md: 12px; --r-lg: 16px;
  --r-xl: 22px; --r-2xl: 30px; --r-pill: 999px;

  /* ---------- التخطيط / layout ---------- */
  --container: 1240px;
  --container-wide: 1440px;
  --header-h: 78px;
  --header-h-sm: 64px;

  /* ---------- الحركة / motion ---------- */
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: .16s;
  --t-base: .28s;
  --t-slow: .5s;

  --z-base: 1; --z-sticky: 100; --z-header: 200; --z-drawer: 300;
  --z-modal: 400; --z-toast: 500;
}

/* الوضع الفاتح (اختياري لصفحات الطباعة فقط) */
@media print {
  :root { --bg-1: #fff; --text-1: #000; --text-2: #333; }
}
