/* ============================================================================
   صفّارة — الرموز المشتركة (Design tokens)
   يُحمَّل قبل أوراق كل واجهة. خط واحد (Readex Pro) مستضاف ذاتياً، أخضر واحد،
   سلّم رمادي مخضرّ، زوايا ومسافات ثابتة، ووضعان داكن/فاتح.
   كل واجهة تُبقي أسماء متغيراتها القديمة لكنها تشير إلى هذه القيم.
   ============================================================================ */

/* ---------- الخطوط (ملفات في shared/public/fonts/) ---------- */
@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/shared/fonts/readexpro-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/shared/fonts/readexpro-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* خط العناوين الكبيرة في الصفحة الرئيسية فقط (هوية العلامة) */
@font-face {
  font-family: 'Lalezar';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/shared/fonts/lalezar-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Lalezar';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/shared/fonts/lalezar-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- الرموز: الوضع الداكن (الافتراضي) ---------- */
:root {
  /* الخط */
  --sf-font: 'Readex Pro', system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;
  --sf-display: 'Lalezar', var(--sf-font);
  /* أسماء قديمة ما زالت الواجهات تستخدمها */
  --font-ar: var(--sf-font);
  --font-en: var(--sf-font);
  --font-num: var(--sf-font);
  --font: var(--sf-font);
  --body: var(--sf-font);
  --display: var(--sf-display);

  /* الأخضر الواحد (العشب تحت الكشافات) ونصه الداكن */
  --sf-green: #2fd08a;
  --sf-green-ink: #04140c;
  --sf-green-soft: rgba(47, 208, 138, 0.14);
  --sf-green-line: rgba(47, 208, 138, 0.5);
  --sf-green-glow: rgba(47, 208, 138, 0.35);
  --sf-green-deep: #1aa86b;        /* للتدرجات والحالات المضغوطة */

  /* الأصفر (ضوء الكشافات)، الخطر، المعلومات */
  --sf-flood: #ffd27a;
  --sf-flood-ink: #2a1d00;
  --sf-danger: #ff8a7a;
  --sf-danger-ink: #2a0b07;
  --sf-danger-soft: rgba(255, 138, 122, 0.12);
  --sf-danger-line: rgba(255, 138, 122, 0.55);
  --sf-info: #7cc4ff;

  /* سلّم الرمادي المخضرّ: أرضية، لوح، لوح ثانٍ، خطوط، حبر، باهت، خافت */
  --sf-ground: #06120c;
  --sf-panel: #0b1d15;
  --sf-panel-2: #10271c;
  --sf-line: rgba(234, 255, 244, 0.14);
  --sf-line-strong: rgba(234, 255, 244, 0.4);   /* حدود الحقول: ≥ 3:1 على الأرضية */
  --sf-ink: #eafff4;
  --sf-muted: #9dc3b0;    /* 7.9:1 على الأرضية */
  --sf-dim: #7a9c89;      /* 4.9:1 على الأرضية */
  --sf-ground-glass: rgba(6, 18, 12, 0.85);
  --sf-panel-glass: rgba(11, 29, 21, 0.92);

  /* الزوايا والمسافات */
  --sf-r-sm: 8px;
  --sf-r-md: 12px;
  --sf-r-lg: 16px;
  --sf-r-xl: 24px;
  --sf-pill: 999px;
  --sf-s1: 4px; --sf-s2: 8px; --sf-s3: 12px; --sf-s4: 16px; --sf-s5: 24px; --sf-s6: 32px; --sf-s7: 48px; --sf-s8: 72px;

  /* الظل، حلقة التركيز، الحركة */
  --sf-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  --sf-focus: 0 0 0 3px var(--sf-green-glow);
  --sf-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --sf-fast: 0.18s;

  /* أهداف اللمس */
  --sf-tap: 44px;

  color-scheme: dark;
}

/* ---------- الوضع الفاتح (تطبيق اللاعب وأي واجهة تعلن data-theme="light") ---------- */
:root[data-theme="light"] {
  --sf-green: #0b7f4b;           /* 4.6:1 مع الأبيض، 5.6:1 على الأرضية الفاتحة */
  --sf-green-ink: #ffffff;
  --sf-green-soft: rgba(11, 127, 75, 0.10);
  --sf-green-line: rgba(11, 127, 75, 0.5);
  --sf-green-glow: rgba(11, 127, 75, 0.30);
  --sf-green-deep: #086139;
  --sf-flood: #9a6314;           /* 4.6:1 على الأبيض */
  --sf-flood-ink: #ffffff;
  --sf-danger: #c2412d;
  --sf-danger-ink: #ffffff;
  --sf-danger-soft: rgba(194, 65, 45, 0.08);
  --sf-danger-line: rgba(194, 65, 45, 0.55);
  --sf-info: #1d6fb8;
  --sf-ground: #f3f7f4;
  --sf-panel: #ffffff;
  --sf-panel-2: #eaf2ed;
  --sf-line: rgba(6, 30, 18, 0.12);
  --sf-line-strong: rgba(6, 30, 18, 0.4);
  --sf-ink: #0b1d15;
  --sf-muted: #4b6e5c;           /* 5.6:1 على الأرضية الفاتحة */
  --sf-dim: #5f7d6d;
  --sf-ground-glass: rgba(243, 247, 244, 0.85);
  --sf-panel-glass: rgba(255, 255, 255, 0.92);
  --sf-shadow: 0 14px 34px rgba(11, 29, 21, 0.10);
  color-scheme: light;
}