/* ============================================================
   مجمع عقود الجمان لطب الأسنان — نظام التصميم (Design Tokens)
   هوية: كحلي عميق + ذهبي + أبيض (مستوحاة من الشعار)
   ============================================================ */
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 400; font-display: swap; src: url("../assets/fonts/plex-400-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: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 400; font-display: swap; src: url("../assets/fonts/plex-400-latin.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 500; font-display: swap; src: url("../assets/fonts/plex-500-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: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 500; font-display: swap; src: url("../assets/fonts/plex-500-latin.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 600; font-display: swap; src: url("../assets/fonts/plex-600-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: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 600; font-display: swap; src: url("../assets/fonts/plex-600-latin.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 700; font-display: swap; src: url("../assets/fonts/plex-700-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: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 700; font-display: swap; src: url("../assets/fonts/plex-700-latin.woff2") format("woff2"); }

:root {
  /* العلامة: الكحلي */
  --navy-900: #071E3D;
  --navy-800: #0B2E5C;
  --navy-700: #123F7A;
  --navy-600: #1B4F8C;
  --navy-500: #2A63A8;
  --navy-400: #4F86C6;
  --navy-300: #8FB3DE;
  --navy-200: #C5D9EF;
  --navy-100: #E3EDF8;
  --navy-50:  #F1F6FC;

  /* العلامة: الذهبي */
  --gold-700: #9A6F12;
  --gold-600: #B8861A;
  --gold-500: #D9A521;
  --gold-400: #E8BB3A;
  --gold-300: #F2D06B;
  --gold-200: #F8E5A8;
  --gold-100: #FCF3D6;
  --gold-50:  #FEFAEE;

  /* المحايدة */
  --ink-900: #0E1A2B;
  --ink-700: #2B3A4F;
  --ink-500: #55657A;
  --ink-300: #9AA7B8;
  --line-strong: #C9D3E0;
  --line: #DCE3EC;
  --line-soft: #EBF0F5;
  --surface: #FFFFFF;
  --surface-sunken: #F3F6FA;
  --surface-hover: #F7F9FC;

  /* الدلالية */
  --ok-700: #176B44; --ok-600: #1E8E5A; --ok-100: #D9F2E4; --ok-50: #ECF9F2;
  --warn-800: #7A4E12; --warn-600: #C97B0A; --warn-100: #FCEBCB; --warn-50: #FEF6E7;
  --danger-700: #A32B2B; --danger-600: #C93A3A; --danger-100: #FADCDC; --danger-50: #FDEEEE;
  --info-700: #1D5A8A; --info-600: #2670A9; --info-100: #DBEAF6; --info-50: #EDF5FB;

  /* الخط */
  --font: "IBM Plex Sans Arabic", "Segoe UI", -apple-system, BlinkMacSystemFont, system-ui, Tahoma, sans-serif;
  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-md: 0.9375rem;
  --fs-lg: 1rem;
  --fs-xl: 1.125rem;
  --fs-2xl: 1.375rem;
  --fs-3xl: 1.75rem;
  --fs-4xl: 2.25rem;
  --lh: 1.6;
  --lh-tight: 1.3;

  /* المسافات */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;

  /* الأشكال */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --shadow-sm: 0 1px 2px rgba(11, 46, 92, 0.06);
  --shadow: 0 4px 14px rgba(11, 46, 92, 0.08);
  --shadow-lg: 0 16px 40px rgba(11, 46, 92, 0.18);
  --shadow-gold: 0 8px 24px rgba(217, 165, 33, 0.35);

  /* الحركة */
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --t-fast: 140ms;
  --t-med: 240ms;
  --t-slow: 420ms;

  /* الأبعاد */
  --touch: 46px;
  --sidebar-w: 240px;
  --sidebar-w-narrow: 76px;
  --topbar-h: 66px;
  --focus-ring: 0 0 0 2px #fff, 0 0 0 4px var(--navy-500);

  /* المساحات الآمنة (الجوال) */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-med: 0ms; --t-slow: 0ms; }
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}