/*!
 * مدد — MADAD — Design Tokens (tokens.css)
 * هوية «مدد» — الاتجاه «أزرق طبي» (D25-26، 2026-10-24) بدل «سماوي سريري»: أزرق الثقة الطبي #1F5FD6 لكل الإجراءات
 * (5.7:1 على الأبيض، ≥ 5:1 على كل الخلفيات، و#6EA8FF على الداكن)، كحلي #0F1F3D للقائمة الجانبية والفوتر والنص الداكن،
 * وفيروزي الشعار #2EC4CE لون التمييز الثاني (خلفية بنص كحلي 7.7:1، أو كنص #0A6B73 بتباين 6.2:1).
 * الذهبي للشعار فقط (--jb-gold-1/2). خلفيات بيضاء مائلة للزرقة بهدوء، وحالات دلالية ثابتة.
 * المصدر الوحيد للألوان والخطوط والمسافات والزوايا والظلال والحركة.
 * أي لون جديد لازم ينقاس تباينه قبل ما ينضاف (الخطة 10.2.1).
 * الوضع الداكن: [data-bs-theme="dark"] على <html> (بيضبطه boot.js قبل أول رسم).
 */

/* ===== الوضع الفاتح (الافتراضي) ===== */
:root {
  /* الألوان الأساسية */
  --jb-primary: #1F5FD6;          /* 5.73:1 على الأبيض، 5.0:1 على primary-subtle */
  --jb-primary-hover: #174BB0;
  --jb-primary-subtle: #E8F0FE;
  --jb-on-primary: #FFFFFF;
  --jb-primary-rgb: 31, 95, 214;
  --jb-turquoise: #2EC4CE;        /* الفيروزي الأصلي للهوية (زخرفة وشعار — ليس لنص على الأبيض) */

  /* لون التمييز: خلفية فقط، والنص فوقه --jb-on-accent */
  --jb-accent: #2EC4CE;           /* فيروزي الشعار — خلفية فقط */
  --jb-accent-rgb: 46, 196, 206;
  --jb-on-accent: #0F1F3D;        /* 7.71:1 */
  --jb-accent-text: #0A6B73;      /* فيروزي داكن كنص: 6.24:1 */
  --jb-gold-1: #C9A227;           /* تدرّج اسم «مدد» بالشعار */
  --jb-gold-2: #8E6E14;
  --jb-ink: #0F1F3D;              /* كحلي طبي */

  /* الأسطح والنصوص — الاتجاه A (2.2): canvas أبيض نقي للموقع العام، band للأقسام المتناوبة */
  --jb-canvas: #FFFFFF;
  --jb-band: #F5F8FC;
  --jb-bg: #F5F8FC;
  --jb-surface: #FFFFFF;
  --jb-surface-2: #EEF3FA;
  --jb-border: #DFE6F0;
  --jb-border-input: #75839A;     /* 3.84:1 على الأبيض، 3.44:1 على surface-2 */
  --jb-text: #0F1E36;
  --jb-text-muted: #50607A;       /* 6.37:1 على الأبيض، 5.72:1 على surface-2 */
  --jb-text-rgb: 15, 30, 54;

  /* الحالات */
  --jb-success: #15803D;
  --jb-warning: #B45309;
  --jb-sto-files: #7C6FD1; --jb-sto-images: #E0A43A; --jb-sto-voice: #C2557A;
  --jb-danger: #B91C1C;
  --jb-info: #0369A1;
  --jb-on-success: #FFFFFF;
  --jb-on-danger: #FFFFFF;
  --jb-on-warning: #FFFFFF;
  --jb-on-info: #FFFFFF;

  /* شارات حالات الموعد (نص / خلفية) — 10.2.2 */
  --jb-st-booked: #475569;     --jb-st-booked-bg: #EEF1F4;
  --jb-st-confirmed: #0369A1;  --jb-st-confirmed-bg: #E0F2FE;
  --jb-st-arrived: #92400E;    --jb-st-arrived-bg: #FEF3C7;
  --jb-st-with-doctor: #6D28D9; --jb-st-with-doctor-bg: #EDE9FE;
  --jb-st-completed: #166534;  --jb-st-completed-bg: #DCFCE7;
  --jb-st-no-show: #BE123C;    --jb-st-no-show-bg: #FFE4E6;
  --jb-st-cancelled: #475569;  --jb-st-cancelled-bg: #EEF1F4;

  /* الرسوم البيانية: ترتيب ثابت للفئات (مفحوص بأداة التحقق لعمى الألوان والتباين) */
  --jb-chart-1: #2F6FE0;          /* أزرق */
  --jb-chart-2: #14A39A;          /* فيروزي */
  --jb-chart-3: #334866;          /* كحلي */
  --jb-chart-4: #6D28D9;          /* بنفسجي */
  --jb-chart-5: #D97706;          /* كهرماني — يتميّز عن الأزرق */
  --jb-chart-grid: rgba(15, 30, 54, .08);

  /* الخطوط — 10.3 */
  --jb-font: "Readex Pro", system-ui, "Segoe UI", Tahoma, sans-serif;
  --fs-display: clamp(2.25rem, 1.35rem + 3.2vw, 3.75rem);
  --fs-section: clamp(1.75rem, 1.25rem + 1.9vw, 2.625rem);
  --fs-h1: clamp(1.75rem, 1.3rem + 1.6vw, 2.25rem);
  --fs-h2: 1.5rem;
  --fs-h3: 1.25rem;
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;
  --lh-body: 1.7;
  --lh-heading: 1.3;

  /* المسافات (نظام 4px) — 10.4 */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;

  /* الزوايا */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;

  /* الظلال */
  /* ظلال طبقية ناعمة جداً (الاتجاه A) */
  --sh-xs: 0 1px 2px rgba(15, 31, 61, .05);
  --sh-sm: 0 1px 3px rgba(15, 31, 61, .06), 0 1px 2px rgba(15, 31, 61, .04);
  --sh-md: 0 8px 24px -6px rgba(15, 31, 61, .10), 0 2px 6px rgba(15, 31, 61, .04);
  --sh-lg: 0 24px 48px -12px rgba(15, 31, 61, .18), 0 4px 12px rgba(15, 31, 61, .05);
  --jb-focus-ring: 0 0 0 3px rgba(31, 95, 214, .45);

  /* الحركة — 10.7 */
  --mo-fast: 150ms;
  --mo-base: 250ms;
  --mo-slow: 400ms;
  --mo-ease: cubic-bezier(.2, .8, .2, 1);

  /* التخطيط */
  --jb-container: 1200px;
  --jb-header-h: 72px;

  color-scheme: light;
}

/* ===== الوضع الداكن ===== */
[data-bs-theme="dark"] {
  --jb-primary: #6EA8FF;          /* 7.06:1 على السطح */
  --jb-primary-hover: #9CC3FF;
  --jb-primary-subtle: #14284A;
  --jb-on-primary: #071530;       /* 7.51:1 */
  --jb-primary-rgb: 110, 168, 255;

  --jb-accent: #2EC4CE;
  --jb-accent-rgb: 46, 196, 206;
  --jb-on-accent: #0F1F3D;
  --jb-accent-text: #5ED6DE;      /* 9.84:1 */
  --jb-gold-1: #F2D27A;
  --jb-gold-2: #C9A227;

  --jb-canvas: #0A1222;
  --jb-band: #0D172B;
  --jb-bg: #0A1222;
  --jb-surface: #111C31;
  --jb-surface-2: #17253F;
  --jb-border: #24334F;
  --jb-border-input: #6B7FA0;     /* 4.19:1 */
  --jb-text: #E7EDF7;             /* 14.5:1 */
  --jb-text-muted: #A3B1C8;       /* 7.84:1 */
  --jb-text-rgb: 231, 237, 247;

  --jb-success: #4ADE80;
  --jb-warning: #FBBF24;
  --jb-sto-files: #A99BF5; --jb-sto-images: #F2C25C; --jb-sto-voice: #F08BB4;
  --jb-danger: #F87171;
  --jb-info: #38BDF8;
  --jb-on-success: #0A1222;
  --jb-on-danger: #0A1222;
  --jb-on-warning: #0A1222;
  --jb-on-info: #0A1222;

  --jb-st-booked: #CBD5E4;     --jb-st-booked-bg: #1E2D49;
  --jb-st-confirmed: #7DD3FC;  --jb-st-confirmed-bg: #0C2D48;
  --jb-st-arrived: #FCD34D;    --jb-st-arrived-bg: #3A2A0A;
  --jb-st-with-doctor: #C4B5FD; --jb-st-with-doctor-bg: #2E1A5E;
  --jb-st-completed: #86EFAC;  --jb-st-completed-bg: #0F2E1C;
  --jb-st-no-show: #FDA4AF;    --jb-st-no-show-bg: #4A1020;
  --jb-st-cancelled: #A3B1C8;  --jb-st-cancelled-bg: #1E2D49;

  --jb-chart-1: #6EA8FF;
  --jb-chart-2: #2EC4CE;
  --jb-chart-3: #CBD5E4;
  --jb-chart-4: #C4B5FD;          /* ≥ 3:1 على السطح الداكن */
  --jb-chart-5: #FBBF24;
  --jb-chart-grid: rgba(231, 237, 247, .08);

  /* بالداكن الظلال بتتبدل بحدود أفتح */
  --sh-xs: 0 0 0 1px rgba(255, 255, 255, .07);
  --sh-sm: 0 0 0 1px rgba(255, 255, 255, .08);
  --sh-md: 0 0 0 1px rgba(255, 255, 255, .09), 0 8px 24px rgba(0, 0, 0, .5);
  --sh-lg: 0 0 0 1px rgba(255, 255, 255, .10), 0 20px 48px rgba(0, 0, 0, .6);
  --jb-focus-ring: 0 0 0 3px rgba(110, 168, 255, .5);

  color-scheme: dark;
}
