/* tokens.css — عقد التوكِنات (الخطة 22-style-tokens-foundation)
   ── عقد الاثنين والأربعين ──
   1) مدخلات الثيم السبعة: يصبّها /api/brand.css في كل طلب (theme.js tokensCss) — أسماؤها عقد، لا تُعاد تسميتها.
   2–7) ألوان العقد والشكل والخطوط والكثافة والمكوّنات والأيقونات: تُشتق من المدخلات أو تُثبَّت هنا،
      والحزم القادمة (خطة 24) تصبّ في هذه الأسماء لا في المدخلات مباشرة.
   ── مشتقّات الهيكل الداكن (أربعة، خارج عقد الحزم — لا تصبّها الحزم مباشرة) ──
   --on-chrome-2 --on-chrome-3 --chrome-hover --chrome-soft: درجات داخل السطح الداكن الثابت؛
   --chrome داكن بالوضعين فتبقى هذه ثابتة في الوضعين أيضاً. الحزمة تصبّ --chrome/--on-chrome وهذه تتبعها. */
:root {
  /* ===== ١) مدخلات الثيم — يصبّها /api/brand.css · لا تُعاد تسميتها ===== */
  --ink: #121417; --ink-2: #4A4F57; --ink-3: #656A72;
  --paper: #F3F0E9; --line: #CCC4B4; --volt: #C9A24E; --deal: #B3321F;

  /* ===== ٢) ألوان العقد — ١٧ ===== */
  /* أسطح */
  --surface: #FFFFFF;            /* = --white القديم */
  --img-bg: #FFFFFF;             /* لوحات صور المنتجات — بيضاء في كل الحزم (قرار قائم) */
  --stripe: #F6F4EF;             /* صفوف الجداول الزوجية */
  /* نصوص وحدود — الاشتقاق من المدخل إلى الاسم الجديد (عكسه يكسر الثيمات الثمانية) */
  --text: var(--ink);
  --text-2: var(--ink-2);
  --text-3: var(--ink-3);
  --edge: var(--ink);
  /* تعبئات + لون النص فوقها */
  --on-ink: #FFFFFF;             /* نص فوق التعبئة التفاعلية --ink — يحلّ نصوص البياض العشرين الحرفية */
  --on-volt: var(--ink);         /* نص فوق --volt — يحلّ خطأ تباين الهيرو (أ٢-٢) دائمياً */
  --on-deal: #FFFFFF;
  /* تعبئة الهيكل: شريط علوي، فوتر، شريط نصّي، رأس المحادثة، القائمة الجانبية — داكنة بالوضعين.
     تُصبّ صراحةً من brand.css لا مشتقّة (الخطة 23 ستقلب --ink ليلاً و--chrome يبقى داكناً) */
  --chrome: var(--ink);
  --on-chrome: #FFFFFF;
  /* حالات */
  --ok: #1E7B45;
  --warn: #B45309;

  /* ===== ٣) شكل — ٨ ===== */
  --radius-sm: 2px; --radius-lg: 2px;   /* sm: أزرار وحقول وبطاقات · lg: لوحات وهيرو وصور — اليوم = sm */
  --radius-pill: 999px;                 /* شارات الحالة والعدّادات */
  --bw-1: 1px;                   /* خطوط فاصلة */
  --bw-2: 2px;                   /* حدود بارزة: أزرار، حقول، هيرو */
  --shadow-1: 0 8px 24px rgba(18, 20, 23, .12);   /* قوائم منسدلة وتوست */
  --shadow-2: 0 8px 24px rgba(18, 20, 23, .18);   /* عائم: زر المحادثة */
  --shadow-3: 0 16px 40px rgba(18, 20, 23, .2);   /* لوحة المحادثة */

  /* ===== ٤) خطوط — ٧ ===== */
  --font-head: 'Alexandria', sans-serif;
  --font-body: 'IBM Plex Sans Arabic', sans-serif;
  --fw-head: 800;
  --fw-body: 400;
  --scale-head: 1;               /* مضاعف مقاسات العناوين */
  --track-head: 0;               /* letter-spacing للعناوين */
  --lh-body: 1.7;

  /* ===== ٥) كثافة — ٣ ===== */
  --sp: 4px;                     /* وحدة المسافة الأساس */
  --dens: 1;                     /* مضاعف الحشوات: 0.82 … 1.30 */
  --container: 1320px;

  /* ===== ٦) مكوّنات — ٤ ===== */
  --card-img-pad: 24px;
  --btn-pad: 12px 24px;
  --hdr-h: 72px;
  --grid-gap: 1px;

  /* ===== ٧) أيقونات ===== */
  --icon-sw: 2;

  /* ===== ٨) توافق خلفي — أسماء قديمة مستعملة في CSS/JS قائم =====
     تحذير الترتيب: --white: var(--surface) لا --surface: var(--white) — العكس يعطّل صبّ الحزم (خطة 24). */
  --white: var(--surface);
  --stock-ok: var(--ok);
  --stock-low: var(--warn);

  /* أسطح مساعدة (من الخطة 20) */
  --admin-bg: #F2F1EE;
  --warn-bg: #FFF8E1;
  --err-bg: #FEE2E2;
  --err-tx: #991B1B;

  /* مشتقّات الهيكل الداكن — ثابتة في الوضعين (انظر رأس الملف) */
  --on-chrome-2: #E3DED5;   /* نص ثانوي فوق الهيكل الداكن: topbar, footer, aside */
  --on-chrome-3: #A9ADB5;   /* نص خافت فوقه */
  --chrome-hover: #2A2E33;  /* تعبئة الهيكل عند المرور + خطوطه الفاصلة */
  --chrome-soft:  #1D2024;  /* سطح ثانوي داخل الهيكل (عناصر القائمة الجانبية) */

  /* حالات الطلب — كما هي */
  --st-pending_review-bg: #FEF3C7; --st-pending_review-tx: #92400E;
  --st-paid-bg: #DBEAFE;          --st-paid-tx: #1D4ED8;
  --st-preparing-bg: #CFFAFE;     --st-preparing-tx: #0E7490;
  --st-shipped-bg: #E2E8F0;       --st-shipped-tx: #334155;
  --st-delivered-bg: #DCFCE7;     --st-delivered-tx: #166534;
  --st-cancelled-bg: #FEE2E2;     --st-cancelled-tx: #991B1B;
}

/* == الوضع الداكن الاحتياطي: الأسطح والنصوص فقط — تُطغى عليه كتلة /api/brand.css الليلية (نفس المحدِّد، تُربط أخيراً)
   لوحة volt هنا = لوحة الثيم الافتراضي حرفياً، فتبقى الصفحة سليمة لو فشل جلب brand.css.
   قواعد .btn اليدوية حُذفت (خطة 23): التعبئة التفاعلية --ink تنقلب ليلياً ونصّها --on-ink */
html[data-mode="dark"] {
  color-scheme: dark;
  --paper: #0B0B0D; --surface: #141417; --line: #3B393E;
  --text: #EFE9DC; --edge: #6F6656; --ink-2: #BEB6A6; --ink-3: #948C7D;
  --deal: #F0655A; --ok: #4ADE80; --warn: #FBBF24;
  /* احتياطاً فقط: لو فشل جلب /api/brand.css تبقى التعبئة داكنة — brand.css الليلي يقلب --ink ويضبط --on-ink */
  --ink: #121417;      --on-ink: #FFFFFF;
  --chrome: #121417;   --on-chrome: #FFFFFF;
  --on-volt: #121417;
  /* --on-deal يبقى أبيض ليلاً كما هو مطبَّق اليوم: النص الأبيض الحرفي فوق --deal الليلي #F0655A
     (إضاءته 0.286 < 0.45 ⇒ onColor يرجع الأبيض) — أي تغيير هنا يكسر شرط صفر التغيير */
  --on-deal: #FFFFFF;
  --img-bg: #FFFFFF;
  --stripe: #202329;
  --admin-bg: #101214; --warn-bg: #3A3010; --err-bg: #3B1A1A; --err-tx: #FCA5A5;
  --st-pending_review-bg: #4A3405; --st-pending_review-tx: #FDE68A;
  --st-paid-bg: #1E2F5A; --st-paid-tx: #BFDBFE;
  --st-preparing-bg: #0F3B44; --st-preparing-tx: #A5F3FC;
  --st-shipped-bg: #2A3340; --st-shipped-tx: #CBD5E1;
  --st-delivered-bg: #113A22; --st-delivered-tx: #BBF7D0;
  --st-cancelled-bg: #4A1414; --st-cancelled-tx: #FECACA;
}
/* الشعار الداكن على سطح داكن: لوحة بيضاء صغيرة (كما صور المنتجات) */
/* الهيدر والفوتر داكنان بالوضعين ويحملان شعاراً مخصّصاً للسطح الداكن (store.css) ⇒ خارج هذه القاعدة */
html[data-mode="dark"] :is(.login-box .logo, .aside .brand img) { background: var(--img-bg); padding: 3px; border-radius: var(--radius-sm); }
/* الكتل الممتلئة بلون --ink تحتاج حدّاً خفيفاً على السطح الداكن */
html[data-mode="dark"] :is(.chat-h, .aside) { box-shadow: inset 0 0 0 var(--bw-1) var(--line); }

@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-arabic-600-normal.woff2') format('woff2');
  font-weight: 600; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-arabic-800-normal.woff2') format('woff2');
  font-weight: 800; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-latin-800-normal.woff2') format('woff2');
  font-weight: 800; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-arabic-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'Alexandria';
  src: url('/fonts/alexandria-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2') format('woff2');
  font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2') format('woff2');
  font-weight: 500; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-arabic-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/ibm-plex-sans-arabic-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0000-00FF;
}

/* خط العرض (الفاخر الصناعي): ريم كوفي للعناوين الكبيرة فقط — OFL 1.1 (web/fonts/OFL-reem-kufi.txt) */
@font-face {
  font-family: 'Reem Kufi';
  src: url('/fonts/reem-kufi-arabic-600-normal.woff2') format('woff2');
  font-weight: 600; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'Reem Kufi';
  src: url('/fonts/reem-kufi-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-display: swap; unicode-range: U+0000-00FF;
}
@font-face {
  font-family: 'Reem Kufi';
  src: url('/fonts/reem-kufi-arabic-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF;
}
@font-face {
  font-family: 'Reem Kufi';
  src: url('/fonts/reem-kufi-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-display: swap; unicode-range: U+0000-00FF;
}