/* =====================================================================
   tokens.css — نظام التصميم (StepFace-WordPress-Theme-Spec.md §١)
   الوضع الفاتح على :root. الوضع الداكن في dark.css (§٩).
   يتضمّن: رموز المواصفة + أسماء الرموز القديمة (aliases) لواجهة الجلسة.
   قاعدة إلزامية: لا لون مباشر في أي قاعدة/نمط — استخدم var(--sf-*).
   ===================================================================== */
:root {
  /* ---- الألوان: أسطح وخلفيات ---- */
  --sf-bg:#EFE6D2;
  --sf-bg-desk:#D8CDB4;
  --sf-surface:#FFFFFF;
  /* سطحٌ «مرفوع» لأزرار الواجهة (1.95.2): في الفاتح هو السطح نفسه تمامًا، وفي
     الداكن أفتح درجةً كي تنفصل البطاقة عن الخلفية — طلب المستخدم. رمزٌ مستقلّ
     لا تعديلٌ على --sf-surface: الأخير يحمل كلّ أسطح الموقع، وتفتيحه يطال
     لوحات التقييم والنوافذ ومربّعات النماذج معها. */
  --sf-surface-raised:var(--sf-surface);
  --sf-surface-soft:#FBF7EF;
  --sf-surface-warm:#F3EAD6;
  --sf-surface-amber:#FBF4E3;
  --sf-surface-tint:#FFFDF9;
  --sf-stripe-a:#F3EAD6;
  --sf-stripe-b:#EFE3C8;

  /* ---- الحدود ---- */
  --sf-border:#CBB683;
  --sf-border-soft:#EAD9B0;
  --sf-border-line:#D8C79E;

  /* ---- النصّ والأسطح الداكنة ---- */
  --sf-ink:#3D2F18;            /* النصّ الأساسي */
  --sf-ink-surface:#3D2F18;    /* دور منفصل: خلفيات داكنة (شريط علوي، بطاقة داكنة، مشغّل) — يصبح شديد الدُّكنة في الوضع الداكن */
  --sf-ink-2:#5C4A2A;
  --sf-ink-3:#6B5326;
  --sf-muted:#8A5E16;
  --sf-muted-2:#A89366;
  --sf-faint:#C2B48E;

  /* ---- الذهبي والعلامة ---- */
  --sf-gold:#A8741A;
  --sf-gold-2:#C99A2E;
  --sf-gold-3:#E8C45F;
  --sf-gold-grad:linear-gradient(140deg,#C99A2E,#A8741A);
  --sf-gold-grad-h:linear-gradient(90deg,#C99A2E,#A8741A);

  /* ---- الدلالية ---- */
  --sf-ok:#7FA84E;   --sf-ok-bg:#F1F7E8;  --sf-ok-ink:#457018;  --sf-ok-dark:#3F7C42; /* ok-ink غُمّق ليجتاز التباين على ok-bg الفاتح */
  --sf-err:#C0492F;  --sf-err-bg:#FBEDE8; --sf-err-ink:#B0341C; /* نصّ خطأ مقروء (نظير --sf-ok-ink) */

  /* ---- نصّ على داكن ---- */
  --sf-on-dark:#F3EAD6;
  --sf-on-dark-2:#D8C79E;

  /* ---- الظلال (§١٫٢) ---- */
  --sf-sh-card:0 2px 10px rgba(120,90,30,.07);
  --sf-sh-raise:0 8px 22px rgba(120,90,30,.14);
  --sf-sh-hero:0 20px 50px rgba(120,90,30,.16);
  --sf-sh-gold:0 8px 20px rgba(168,116,26,.35);
  --sf-sh-dark:0 12px 30px rgba(61,47,24,.20);
  --sf-sh-lift:0 14px 32px rgba(120,90,30,.14);

  /* ---- أنصاف الأقطار (§١٫٢) ---- */
  --sf-r-xs:8px;  --sf-r-sm:11px; --sf-r-md:13px;
  --sf-r-lg:16px; --sf-r-xl:18px; --sf-r-2xl:22px;
  --sf-r-3xl:24px; --sf-r-pill:999px;

  /* ---- الخطوط (§١٫٣) ---- */
  --sf-font:'Tajawal',system-ui,sans-serif;
  --sf-font-read:'IBM Plex Serif',Georgia,serif;
  --sf-font-mono:ui-monospace,monospace;

  /* =================================================================
     أسماء رموز واجهة الجلسة القديمة (aliases) — تبقى لتوافق stepface.js
     تُعاد قيمها في dark.css أيضًا.
     ================================================================= */
  --sf-surface-2:#FBF7EF;      /* = surface-soft */
  --sf-cream:#F3EAD6;          /* = surface-warm */
  --sf-prompt-bg:#FBF4E3;      /* = surface-amber */
  --sf-gold-deep:#8A5E16;      /* = muted */
  --sf-bad:#C0492F;            /* = err */
  --sf-bad-bg:#FBEDE8;         /* = err-bg */
  --sf-grad:linear-gradient(140deg,#C99A2E,#A8741A);
  --sf-radius:16px;
  --sf-shadow:0 2px 10px rgba(120,90,30,.07);
  /* ملاحظة: في هذا النظام القديم --sf-muted=#C2B48E (دور faint). نُبقيه للتوافق: */
  --sf-muted-legacy:#C2B48E;
}