/*
  نفس خط العقد (Tajawal) مستخدَم في كل واجهة الموقع لتوحيد الهوية البصرية بين الموقع وملفات PDF.
  WOFF2 أولاً (أخف بنسبة ~65% من TTF) مع TTF كبديل للمتصفحات القديمة جدًا التي لا تدعم WOFF2.
*/
@font-face {
  font-family: 'Tajawal';
  src: url('/fonts/Tajawal-Regular.woff2') format('woff2'),
       url('/fonts/Tajawal-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Tajawal';
  src: url('/fonts/Tajawal-Bold.woff2') format('woff2'),
       url('/fonts/Tajawal-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* الألوان الأساسية لهوية شركة مارون - متغيرات CSS تدعم الوضع الفاتح والداكن */
:root {
  --maroon: #C1272D;
  --maroon-dark: #8F1D22;
  --maroon-light: #E85A5F;
  --gray-dark: #2B2B2B;
  --gray-medium: #4A4A4A;
  --gray-light: #E5E5E5;
  --white: #FFFFFF;

  --success: #2E7D32;
  --warning: #F9A825;
  --danger: #C1272D;
  --info: #1565C0;
  --secondary: #6B7280;
  --secondary-text: #475569; /* أغمق من --secondary لوضوح أكبر كنص شارة "منتهي" بدل رمادي باهت */

  --bg: #F4F4F4;
  --surface: #FFFFFF;
  --text: #1F1F1F;
  --text-muted: #666666;
  --border: #E2E2E2;

  --sidebar-bg: #1F1F1F;
  --sidebar-bg-2: #161616;
  --sidebar-text: #F2F2F2;
  --sidebar-active: var(--maroon);

  color-scheme: light;
}

[data-theme="dark"] {
  --bg: #17171A;
  --surface: #222226;
  --text: #F2F2F2;
  --text-muted: #A8A8A8;
  --border: #34343A;
  --secondary-text: #CBD5E1; /* أفتح من النسخة الفاتحة، لنفس سبب الوضوح لكن على خلفية داكنة */

  --sidebar-bg: #101012;
  --sidebar-bg-2: #0B0B0C;

  color-scheme: dark;
}

body {
  background: var(--bg);
  color: var(--text);
}

/*
  تأثير انتقال سلس بين الصفحات، بـ CSS فقط بدون أي JavaScript، عبر @view-transition -
  مدعومة في المتصفحات الحديثة المبنية على Chromium (Edge/Chrome)، وتُتجاهَل بأمان تام في غيرها
  (Firefox/Safari القديم) فيبقى التنقل عاديًا بدون أي أثر أو خطأ - تحسين تدريجي وليس أساسيًا.

  ملاحظة مهمة: هذه الحركة تُطبَّق فقط على طبقة اللقطة (::view-transition-old/new) التي يديرها
  المتصفح تلقائيًا، وليس على المحتوى الحي (.main-content) نفسه - تشغيل حركتين منفصلتين بمدتين
  مختلفتين في نفس الوقت (واحدة على اللقطة وأخرى على المحتوى الحقيقي) هو ما كان يسبب القفزة/التهنيج
  الملحوظ عند انتهاء إحداهما قبل الأخرى.
*/
@view-transition {
  navigation: auto;
}
::view-transition-old(root) {
  animation: page-fade-out .16s ease-in both;
}
::view-transition-new(root) {
  animation: page-fade-in .22s ease-out both;
}
@keyframes page-fade-out {
  to { opacity: 0; }
}
@keyframes page-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}