/* tokens.css — هوية «شركة منارة للاستيراد والتوريد» (نسخة ٣ — هوية العميل).

   الأساس في ../../_system/css/tokens.css — لا يُعدَّل.

   سبب التغيير (2026-10-02): وصلت **حزمة هوية العميل**: لوغو + لوحة ألوان + خط.
   فالهوية صارت من العميل لا منّا. المصدر: `assets/brand-assets/brand-color-palette.md`
   + لوحة الألوان المصوّرة. والنسخة السابقة (حبر بحري + ورق بارد + أصفر سلامة) كانت اجتهادنا
   في غياب هوية، وقد حُلّت محلّها.

   ملاحظتان من النقل، محفوظتان لأن النظام كان يمنعهما:
   (١) ‏`--ink` هنا يخدم دورين: **لون النص** في الوضع الفاتح، و**خلفية الأقسام الغامقة** —
       وهذا موافق لمواصفة العميل نفسها (Light Mode: Text #00306E · Dark Background #00306E).
   (٢) الوصف النصي في العميل (#3D4F63) خالٍ من مشكلة `--ink-subtle` القديمة: الرمادي #6B7C8F
       يبقى **لغير النص** (3.9:1)، والوصف النصي 8.0:1. */

:root{
  /* --- الأزرق الأساسي (Primary scale) --- */
  --brand:        #055AB3;   /* Primary — الأفعال والروابط والعناصر التفاعلية */
  --brand-dark:   #04408F;   /* الأزرق الأغمق للتحويم (مواصفة العميل) */
  --brand-deep:   #00306E;   /* Primary Dark — اللوغو والعناوين والخلفيات الغامقة */
  --brand-soft:   #D6EBFC;   /* تدرّج فاتح جدًا — خلفيات خفيفة */
  --brand-ink:    #ffffff;   /* النص فوق الأزرق */

  /* --- المحايدات --- */
  --ink:          #00306E;   /* نص أساسي + خلفية الأقسام الغامقة */
  --ink-muted:    #3D4F63;   /* نص ثانوي — 8.0:1 على الأبيض */
  --ink-subtle:   #6B7C8F;   /* ⚠ لغير النص فقط — 3.9:1 على الأبيض */

  --surface:      #ffffff;
  --surface-2:    #F7FAFC;   /* خلفية الأقسام البديلة */
  --surface-3:    #E8EEF4;
  --line:         #E8EEF4;   /* فواصل زخرفية — معفاة من نسبة التباين */
  --line-strong:  #A8B5C4;   /* إبراز زخرفي */
  --line-control: #6B7C8F;   /* حد العناصر التفاعلية: ≥ 3:1 (WCAG 1.4.11) */

  /* --- الفعل --- */
  --accent:       var(--brand);
  --accent-soft:  var(--brand-soft);
  --action:       #055AB3;   /* مواصفة العميل: الزر الافتراضي */
  --action-hover: #04408F;
  --action-active:#00306E;
  --action-ink:   #ffffff;   /* أبيض على #055AB3 = 5.9:1 ✓ */

  /* --- ألوان الحالات (Accent colors من الحزمة) --- */
  --success:      #0D9488;
  --warning:      #D97706;
  --danger:       #DC2626;
  --highlight:    #F59E0B;   /* ذهبي دافئ — للتفاصيل الصغيرة فقط، لا للأزرار */

  /* --- الخطوط --- */
  --font-body:    'IBMPlexSansArabic', system-ui, 'Segoe UI', sans-serif;
  --font-display: 'IBMPlexSansArabic', system-ui, 'Segoe UI', sans-serif;

  /* --- الاستدارة: هندسية كما في اللوغو (زوايا حادة الشكل) --- */
  --radius:8px; --radius-lg:14px;
  --measure:58ch;
}

.section--ink{background:var(--ink)}
.hero--tinted{background:linear-gradient(180deg, var(--brand-soft), var(--surface))}

/* الزر الأساسي بلون الفعل، ونصّه أبيض */
.btn--primary{background:var(--action); color:var(--action-ink); border-color:var(--action)}
.btn--primary:hover{background:var(--action-hover); border-color:var(--action-hover)}
.btn--primary:active{background:var(--action-active); border-color:var(--action-active)}
.btn--link{color:var(--brand)}
.nav__toggle{border-color:var(--line-control)}

/* نجوم التقييم: اللون القديم (#b8860b) كان من اللوحة السابقة.
   #D97706 على الأبيض = 3.35:1 ✓ (حد العناصر الرسومية 3:1) */
.stars{color:var(--warning)}

/* الأيقونات داخل المربّعات الملّونة */
.service__icon{background:var(--brand-soft); color:var(--brand-deep)}