/* ==========================================================================
   BLAZMA — Design Tokens
   نظام الرموز التصميمية: ألوان، خطوط، مسافات، أنصاف أقطار، ظلال، انتقالات
   ========================================================================== */

:root {
  /* ---------- Brand ---------- */
  --brand-1: #ef670d;
  --brand-2: #ffb36f;
  --brand-3: #d95708;
  --brand-grad: linear-gradient(135deg, #ef670d 0%, #ff8a38 100%);
  --brand-grad-soft: linear-gradient(135deg, rgba(239, 103, 13, .18) 0%, rgba(255, 179, 111, .10) 100%);
  --violet: #ef670d;
  --violet-soft: rgba(239, 103, 13, .14);
  --cyan: #ffb36f;

  /* ---------- Surfaces ---------- */
  --bg: #171717;
  --bg-2: #1e1e1e;
  --card: #252525;
  --card-2: #2a2a2a;
  --card-3: #343434;
  --overlay: rgba(12, 12, 12, .78);

  /* ---------- Borders ---------- */
  --border: #3d3d3d;
  --border-strong: #505050;
  --border-accent: rgba(255, 179, 111, .42);

  /* ---------- Text ---------- */
  --text: #ffffff;
  --text-2: #c4cece;
  --text-3: #899697;
  --text-inverse: #20130b;

  /* ---------- Status ---------- */
  --success: #2ecc82;
  --success-bg: rgba(46, 204, 130, .12);
  --warning: #ffb020;
  --warning-bg: rgba(255, 176, 32, .12);
  --danger: #ff4d4d;
  --danger-bg: rgba(255, 77, 77, .12);
  --info: #ffb36f;
  --info-bg: rgba(255, 179, 111, .12);
  --neutral-bg: rgba(255, 255, 255, .06);

  /* ---------- Typography ---------- */
  --font-ar: "IBM Plex Sans Arabic", "Cairo", "Tajawal", "Segoe UI", system-ui, sans-serif;
  --font-en: "Plus Jakarta Sans", "Inter", "Segoe UI", system-ui, sans-serif;
  --font: var(--font-ar);
  --font-mono: "JetBrains Mono", "SFMono-Regular", ui-monospace, Consolas, monospace;

  --fs-display: clamp(2.4rem, 1.4rem + 3.6vw, 4.2rem);
  --fs-h1: clamp(1.9rem, 1.3rem + 2.2vw, 3rem);
  --fs-h2: clamp(1.5rem, 1.15rem + 1.3vw, 2.1rem);
  --fs-h3: clamp(1.18rem, 1.02rem + .6vw, 1.5rem);
  --fs-h4: 1.06rem;
  --fs-body: .95rem;
  --fs-sm: .86rem;
  --fs-xs: .78rem;
  --fs-caption: .72rem;

  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-body: 1.7;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 800;

  /* ---------- Spacing scale ---------- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;
  --s-24: 96px;

  /* ---------- Radius ---------- */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ---------- Shadows ---------- */
  --sh-sm: 0 1px 2px rgba(0, 0, 0, .5);
  --sh-md: 0 8px 24px -12px rgba(0, 0, 0, .8);
  --sh-lg: 0 24px 60px -24px rgba(0, 0, 0, .9);
  --sh-glow: 0 12px 40px -14px rgba(239, 103, 13, .42);
  --sh-inset: inset 0 1px 0 rgba(255, 255, 255, .05);

  /* ---------- Motion ---------- */
  --t-fast: 120ms cubic-bezier(.4, 0, .2, 1);
  --t: 200ms cubic-bezier(.4, 0, .2, 1);
  --t-slow: 380ms cubic-bezier(.22, 1, .36, 1);

  /* ---------- Layout ---------- */
  --container: 1320px;
  --container-narrow: 940px;
  --pad-x: 16px;
  --header-h: 68px;
  --subnav-h: 46px;
  --z-header: 100;
  --z-drawer: 300;
  --z-modal: 400;
  --z-toast: 500;
}

@media (min-width: 768px) {
  :root { --pad-x: 24px; }
}
@media (min-width: 1100px) {
  :root { --pad-x: 32px; --header-h: 76px; }
}

/* لغة الواجهة الإنجليزية تستخدم خط لاتيني مخصص */
html[lang="en"] { --font: var(--font-en); }

/* الوضع الفاتح (اختياري من لوحة الإدارة) */
html[data-theme="light"] {
  --bg: #f5f5f5;
  --bg-2: #eeeeee;
  --card: #ffffff;
  --card-2: #f8f8f8;
  --card-3: #efefef;
  --overlay: rgba(20, 20, 20, .45);
  --border: rgba(20, 20, 20, .10);
  --border-strong: rgba(20, 20, 20, .18);
  --text: #121212;
  --text-2: #5a5a5a;
  --text-3: #858585;
  --neutral-bg: rgba(20, 20, 20, .05);
  --sh-md: 0 8px 24px -14px rgba(20, 20, 20, .35);
  --sh-lg: 0 24px 60px -28px rgba(20, 20, 20, .35);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t: 0ms; --t-slow: 0ms; }
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}
