/* =====================================================================
   مرصدك — tokens.css
   الطبقة الأولى في نظام التصميم: الخطوط، الألوان، المقاييس، الظلال،
   الطبقات (z-index)، ومنحنيات الحركة. لا تكتب هنا أي قاعدة تنسيق.
   ترتيب التحميل الإلزامي:
   tokens.css → base.css → layout.css → components.css → animations.css
   ثم (اختياري لكل صفحة): pages.css / map.css / admin.css
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) الخطوط — خط "ثمانية" المحلي (fonts/thmanyah/)
   --------------------------------------------------------------------- */

@font-face{font-family:'Thmanyah';src:url('../../fonts/thmanyah/thmanyah-300.woff2')format('woff2');font-weight:300;font-display:swap;font-style:normal}
@font-face{font-family:'Thmanyah';src:url('../../fonts/thmanyah/thmanyah-400.woff2')format('woff2');font-weight:400;font-display:swap;font-style:normal}
@font-face{font-family:'Thmanyah';src:url('../../fonts/thmanyah/thmanyah-500.woff2')format('woff2');font-weight:500;font-display:swap;font-style:normal}
@font-face{font-family:'Thmanyah';src:url('../../fonts/thmanyah/thmanyah-700.woff2')format('woff2');font-weight:700;font-display:swap;font-style:normal}
@font-face{font-family:'Thmanyah';src:url('../../fonts/thmanyah/thmanyah-900.woff2')format('woff2');font-weight:900;font-display:swap;font-style:normal}

@font-face{font-family:'Thmanyah Display';src:url('../../fonts/thmanyah/thmanyah-display-400.woff2')format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah Display';src:url('../../fonts/thmanyah/thmanyah-display-700.woff2')format('woff2');font-weight:700;font-display:swap}

@font-face{font-family:'Thmanyah Serif';src:url('../../fonts/thmanyah/thmanyah-serif-400.woff2')format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah Serif';src:url('../../fonts/thmanyah/thmanyah-serif-700.woff2')format('woff2');font-weight:700;font-display:swap}

/* ---------------------------------------------------------------------
   2) المتغيّرات الجذرية
   --------------------------------------------------------------------- */

:root{

  /* --- 2.1 عائلات الخطوط ---
     --font-display : العناوين الكبيرة والأرقام الضخمة فقط
     --font-sans    : كل نصوص الواجهة والمتون
     --font-serif   : الاقتباسات وسطر الافتتاحية في الأخبار فقط */
  --font-sans:'Thmanyah',system-ui,'Segoe UI',sans-serif;
  --font-display:'Thmanyah Display','Thmanyah',sans-serif;
  --font-serif:'Thmanyah Serif','Thmanyah',serif;
  --font-mono:ui-monospace,'Cascadia Mono','Segoe UI Mono',Consolas,monospace;

  /* --- 2.2 الألوان: الكحلي (أساس الهوية) --- */
  --navy-950:#070C26;
  --navy-900:#0A1236;
  --navy-800:#101B4F;
  --navy-700:#1B2A6B;
  --navy-600:#2A3B87;
  --navy-500:#3C4FA6;

  /* --- 2.3 الألوان: البنفسجي (لون الحركة والتمييز) --- */
  --violet-700:#5B3FD1;
  --violet-600:#6D3DD6;
  --violet-500:#8139D6;
  --violet-400:#9B5DE8;
  --violet-300:#B98BF0;
  --violet-200:#D8CCF7;
  --violet-100:#EDE6FD;
  --violet-50:#F6F2FE;

  /* --- 2.4 الألوان: الأبيض الكريمي (خلفية الموقع) --- */
  --cream-50:#FDFBF7;
  --cream-100:#FAF7F1;
  --cream-200:#F4EFE7;
  --cream-300:#E9E2D6;

  /* --- 2.5 النص والحدود --- */
  --ink:#101B4F;
  --ink-soft:#44508A;
  /* غُمّق ليحقّق ≥4.5:1 على الأبيض وعلى --cream-100 و--violet-50 (A11Y-03).
     #5B6488 ≈ 5.8:1 على الأبيض و≈5.4:1 على خلفية الموقع الكريمية. */
  --muted:#5B6488;
  --line:#E4E0F2;
  --white:#FFFFFF;

  /* --- 2.6 ألوان الحالة --- */
  --ok:#19A974;
  --warn:#E8A317;
  /* غُمّق قليلاً ليحقّق ≥4.5:1 نصاً على أبيض وأبيض عليه (A11Y-12): ≈5.5:1 */
  --danger:#C13440;
  --info:#2F7FE0;

  /* خلفيات ناعمة مشتقّة من ألوان الحالة (للتنبيهات والشارات) */
  --ok-soft:#E4F7EF;
  --warn-soft:#FDF3DE;
  --danger-soft:#FBE8EA;
  --info-soft:#E6F0FC;
  --ok-ink:#0C6B48;
  --warn-ink:#8A5F06;
  --danger-ink:#94222C;
  --info-ink:#1A4E8F;

  /* --- 2.7 التدرّجات --- */
  --grad-brand:linear-gradient(135deg,#101B4F 0%,#3B2E9E 45%,#8139D6 100%);
  --grad-soft:linear-gradient(135deg,#F6F2FE 0%,#FDFBF7 100%);
  --grad-violet:linear-gradient(135deg,#6D3DD6 0%,#8139D6 100%); /* الطرف الفاتح #8139D6 يعطي 6:1 مع الأبيض (كان #9B5DE8 = 4.1:1) */
  --grad-navy:linear-gradient(160deg,#0A1236 0%,#101B4F 55%,#1B2A6B 100%);
  --grad-line:linear-gradient(90deg,#8139D6 0%,#5B3FD1 60%,transparent 100%);
  --grad-sheen:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);

  /* --- 2.8 نصف الأقطار --- */
  --r-sm:10px;
  --r-md:14px;
  --r-lg:20px;
  --r-xl:28px;
  --r-2xl:36px;
  --r-pill:999px;

  /* --- 2.9 المسافات --- */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:24px;
  --sp-6:32px;
  --sp-7:48px;
  --sp-8:64px;
  --sp-9:96px;

  /* --- 2.10 الظلال --- */
  --shadow-xs:0 1px 2px rgba(16,27,79,.06);
  --shadow-sm:0 2px 8px rgba(16,27,79,.07);
  --shadow-md:0 8px 24px rgba(16,27,79,.09);
  --shadow-lg:0 20px 48px rgba(16,27,79,.13);
  --shadow-glow:0 12px 40px rgba(129,57,214,.25);
  --shadow-inset:inset 0 1px 0 rgba(255,255,255,.6);

  /* --- 2.11 العرض والحركة --- */
  --container:1240px;
  --container-narrow:760px;
  --container-wide:1440px;
  --gutter:clamp(16px,4vw,32px);
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-1:.14s;
  --dur-2:.24s;
  --dur-3:.38s;
  --dur-4:.6s;

  /* --- 2.12 مقياس الطبقات (z-index) — لا تستخدم أرقاماً حرّة أبداً --- */
  --z-base:0;
  --z-raised:10;
  --z-sticky:100;
  --z-map-ui:200;
  --z-header:600;
  --z-dropdown:700;
  --z-drawer:800;
  --z-backdrop:850;
  --z-modal:900;
  --z-toast:950;
  --z-tooltip:980;
  --z-max:1000;

  /* --- 2.13 مقياس الخط السائل ---
     letter-spacing يبقى صفراً دائماً: تباعد الحروف يكسر اتصال العربية. */
  --fs-xs:.78rem;
  --fs-sm:.875rem;
  --fs-base:1rem;
  --fs-md:1.075rem;
  --fs-lg:1.25rem;
  --fs-xl:1.5rem;
  --fs-2xl:clamp(1.75rem,3vw,2.25rem);
  --fs-3xl:clamp(2.1rem,4.4vw,3.1rem);
  --fs-4xl:clamp(2.6rem,6vw,4.4rem);

  /* ارتفاعات الأسطر — العربية تحتاج فسحة رأسية أكبر من اللاتينية */
  --lh-tight:1.25;   /* العناوين */
  --lh-snug:1.45;    /* العناوين الصغيرة وسطور البطاقات */
  --lh-body:1.75;    /* النص الجاري */
  --lh-prose:1.85;   /* المقالات الطويلة */
  --tracking:0;      /* إلزامي: لا تباعد حروف للعربية */

  /* أوزان الخط المتاحة فعلياً */
  --fw-light:300;
  --fw-regular:400;
  --fw-medium:500;
  --fw-bold:700;
  --fw-black:900;

  /* --- 2.14 مقابض تُعاد كتابتها في مكوّنات بعينها --- */
  --stack-gap:var(--sp-4);       /* .stack */
  --cluster-gap:var(--sp-3);     /* .cluster */
  --grid-gap:var(--sp-5);        /* .grid */
  --section-y:var(--sp-9);       /* .section */
  --card-pad:var(--sp-5);        /* .card__body */
  --field-h:52px;                /* ارتفاع حقول الإدخال */
  --field-h-sm:42px;
  --header-h:76px;               /* ارتفاع الرأس اللاصق */
  --ring:0 0 0 4px rgba(129,57,214,.18);   /* حلقة التركيز الناعمة */
  --ring-danger:0 0 0 4px rgba(214,69,80,.18);

  /* ألوان أنواع الفعاليات — تُستعمل في الشارات ودبابيس الخريطة.
     كلها من سلّمي الكحلي والبنفسجي في §3.2 من العقد: لا ألوان دخيلة
     (حُذف الوردي #C23F8E والأخضر والبرتقالي والأزرق) — REQ-04.
     ألوان --ok/--warn/--danger/--info مخصّصة لحالات النظام فقط. */
  --t-conference:#5B3FD1;   /* violet-700 */
  --t-forum:#2A3B87;        /* navy-600   */
  --t-workshop:#8139D6;     /* violet-500 */
  --t-exhibition:#101B4F;   /* navy-800   */
  --t-ceremony:#6D3DD6;     /* violet-600 */
  --t-training:#1B2A6B;     /* navy-700   */
  --t-hackathon:#9B5DE8;    /* violet-400 */
  --t-meetup:#3C4FA6;       /* navy-500   */
}

/* على الشاشات الصغيرة نضغط الإيقاع الرأسي قليلاً */
@media (max-width:768px){
  :root{
    --section-y:var(--sp-7);
    --card-pad:var(--sp-4);
    --header-h:64px;
  }
}

@media (max-width:560px){
  :root{
    --field-h:48px;
    --grid-gap:var(--sp-4);
  }
}