/* ALIGN — الهوية البصرية الموحّدة (17.3) — المصدر الوحيد للألوان والخطوط والمقاسات.
   المسار في المنتج: static/common/tokens.css — يُحمَّل قبل أي CSS آخر في كل صفحة (الموقع، والكاشير، ولوحات ALIGN، والمشتريات، والتحويل).
   لا قيمة لون أو خط مكتوبة يدويًا في أي ملف آخر: استعمل المتغيرات فقط. */

:root {
  /* الأساس — من الشعار */
  --al-ink: #0B0D12;            /* الأسود: النص الأساسي، القائمة الجانبية، الأزرار الداكنة */
  --al-brand: #004BFC;          /* أزرق الشعار: الإجراء الأساسي، الروابط، العنصر النشط */
  --al-brand-600: #0037BD;      /* حالة hover/pressed للأزرق */
  --al-brand-50: #EAF0FF;       /* خلفية أيقونات وشارات معلوماتية */

  /* الأسطح والخطوط */
  --al-bg: #F4F6FA;             /* خلفية الصفحات الداخلية */
  --al-surface: #FFFFFF;        /* البطاقات والجداول والشريط العلوي */
  --al-surface-2: #F9FAFC;      /* رأس الجداول */
  --al-line: #E3E7EF;           /* حدود البطاقات والفواصل */
  --al-line-soft: #EEF1F6;      /* فواصل صفوف الجداول */
  --al-line-strong: #C9D0DC;    /* حدود الحقول والأزرار الثانوية */

  /* النص */
  --al-text: #0B0D12;
  --al-text-2: #3A4352;         /* نص ثانوي (تباين ≥ 7:1 على الأبيض) */
  --al-muted: #4A5363;          /* تسميات وتلميحات (تباين ≥ 4.5:1 على الأبيض و#F4F6FA) */

  /* الأسطح الداكنة (القائمة الجانبية، لوحة الدفع في الكاشير، التذييل) */
  --al-dark: #0B0D12;
  --al-dark-2: #1B2030;         /* العنصر النشط داخل الداكن */
  --al-dark-line: #262B36;
  --al-dark-text: #C9D0DC;
  --al-dark-muted: #A9B2C2;

  /* الحالات — خلفية/نص (كلها ≥ 4.5:1) */
  --al-success-bg: #E6F4EE; --al-success: #0B5C3F;
  --al-warn-bg: #FFF1DE;    --al-warn: #7A4200;
  --al-danger-bg: #FDE8E7;  --al-danger: #8F1D15;   --al-danger-line: #F3C4C0;
  --al-info-bg: #EAF0FF;    --al-info: #0037BD;

  /* سلاسل الرسوم البيانية بالترتيب */
  --al-chart-1: #004BFC;
  --al-chart-2: #0B0D12;
  --al-chart-3: #A9B2C2;
  --al-chart-4: #A55A00;
  --al-chart-5: #127A55;
  --al-chart-soft: #C9D6F5;     /* أعمدة الخلفية أو غير المحددة */

  /* الخط */
  --al-font: "SaudiRiyal", "Thmanyah Sans", sans-serif;
  --al-fs-xs: 12px;
  --al-fs-sm: 13px;
  --al-fs-base: 14px;
  --al-fs-md: 15px;
  --al-fs-lg: 16px;
  --al-fs-title: 26px;          /* عنوان الصفحة */
  --al-fs-kpi: 26px;            /* قيمة بطاقة المؤشر */
  --al-fw-regular: 400; --al-fw-medium: 500; --al-fw-semibold: 600; --al-fw-bold: 700;

  /* الأشكال والمقاسات */
  --al-radius-sm: 6px;          /* الشارات */
  --al-radius: 10px;            /* الأزرار والحقول */
  --al-radius-lg: 14px;         /* البطاقات والجداول */
  --al-radius-pill: 999px;
  --al-control-h: 44px;         /* أقل ارتفاع لزر أو حقل (لمس) */
  --al-topbar-h: 64px;
  --al-sidebar-w: 248px;
  --al-sidebar-w-collapsed: 64px;
  --al-gap: 16px;
  --al-pad-card: 20px;
  --al-shadow-pop: 0 24px 60px rgba(11, 13, 18, 0.10);  /* النوافذ المنبثقة فقط */
  --al-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px #004BFC;
}

/* أساسيات مشتركة — لا تكررها في ملفات أخرى */
html { font-family: var(--al-font); }
body { font-family: var(--al-font); color: var(--al-text); font-size: var(--al-fs-base); }
:focus-visible { outline: none; box-shadow: var(--al-focus); border-radius: var(--al-radius); }
.num, td.num, th.num { font-variant-numeric: tabular-nums; }