/* ============================================================
   TrainHub — نظام التصميم
   قائمة كحلية داكنة + شريط علوي فاتح + تمييز برتقالي
   ============================================================ */
:root {
  /* --- الهوية --- */
  --brand-primary: #0B1F3A;
  --brand-accent: #FF7A59;          /* البرتقالي — الإجراءات والروابط الأساسية */
  --accent-hover: #EE6B4D;
  --accent-soft: #FFF0EB;           /* خلفية مخفّفة للتمييز */

  /* --- القائمة الجانبية الداكنة --- */
  --nav-bg: #1B2A3A;
  --nav-bg-2: #17242F;              /* رأس العلامة والقوائم المنبثقة */
  --nav-text: #B4C4D4;
  --nav-text-strong: #FFFFFF;
  --nav-hover: rgba(255,255,255,.07);
  --nav-active-bg: rgba(255,122,89,.12);
  --nav-line: rgba(255,255,255,.09);

  /* --- الأسطح --- */
  --canvas: #F5F8FA;
  --surface: #FFFFFF;
  --surface-2: #F5F8FA;
  --surface-3: #EAF0F6;

  /* --- النصوص --- */
  --heading: #1B2538;
  --text: #33475B;
  --text-2: #516F90;
  --text-3: #7C98B6;

  /* --- الحدود --- */
  --line: #DFE3EB;
  --line-strong: #CBD6E2;

  /* --- الروابط --- */
  --link: #00A4BD;

  /* --- الحالات --- */
  --ok: #00A38D;      --ok-bg: #D6F0EA;
  --green: #4E9A2F;   --green-bg: #E3F3D9;
  --warn: #C87D22;    --warn-bg: #FFEBD6;
  --danger: #D93B45;  --danger-bg: #FDE4E5;
  --info: #2E7CD6;    --info-bg: #DEEAF9;
  --muted-bg: #EAF0F6;

  /* --- ألوان بطاقات المؤشرات --- */
  --k-orange: #FF7A59;
  --k-teal:   #00BDA5;
  --k-blue:   #2E7CD6;
  --k-purple: #7C5CD6;
  --k-green:  #4E9A2F;
  --k-pink:   #E8607B;

  /* --- القياسات --- */
  --radius: 8px;
  --radius-sm: 6px;
  --radius-xs: 4px;
  --radius-pill: 999px;
  --sidebar-w: 232px;
  --sidebar-w-min: 62px;
  --topbar-h: 60px;

  /* --- الظلال --- */
  --shadow: 0 1px 2px rgba(27,42,58,.06);
  --shadow-md: 0 3px 12px rgba(27,42,58,.10);
  --shadow-lg: 0 12px 34px rgba(27,42,58,.18);
  --ring: 0 0 0 3px rgba(255,122,89,.22);

  /* --- الخطوط --- */
  --font: 'IBM Plex Sans Arabic', 'Lexend Deca', system-ui, sans-serif;
  --font-num: 'Lexend Deca', system-ui, sans-serif;

  --t-fast: .12s ease;
  --t: .2s cubic-bezier(.25,.6,.3,1);
}
html[dir="ltr"] { --font: 'Lexend Deca', system-ui, sans-serif; }

/* ============================================================
   الوضع الليلي
   ============================================================ */
html[data-theme-resolved="dark"] {
  --canvas: #16212C;
  --surface: #1E2B38;
  --surface-2: #24333F;
  --surface-3: #2C3E4C;
  --heading: #F0F4F8;
  --text: #DCE6EF;
  --text-2: #A3B6C7;
  --text-3: #7F94A6;
  --line: #2C3E4C;
  --line-strong: #3A4F60;
  --link: #4FC3DC;
  --accent-soft: rgba(255,122,89,.14);
  --ok: #3FD0B6;     --ok-bg: rgba(63,208,182,.15);
  --green: #7CC65A;  --green-bg: rgba(124,198,90,.15);
  --warn: #E7A951;   --warn-bg: rgba(231,169,81,.15);
  --danger: #F2757E; --danger-bg: rgba(242,117,126,.15);
  --info: #6BA8E8;   --info-bg: rgba(107,168,232,.15);
  --muted-bg: rgba(163,182,199,.13);
  --nav-bg: #14202B;
  --nav-bg-2: #101A23;
  --shadow: 0 1px 2px rgba(0,0,0,.4);
  --shadow-md: 0 3px 14px rgba(0,0,0,.45);
  --shadow-lg: 0 14px 38px rgba(0,0,0,.55);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}