/* =================================================================
   محور — ملف الألوان
   -----------------------------------------------------------------
   المبدأ: الترقيم بالحُمرة.

   في تقليد المخطوط العربي يُكتب المتن بالمِداد الأسود، ويُفرد
   اللون الأحمر لما يدلّ على البنية ولما يجب أن تقع عليه العين:
   العناوين، الفواصل، التنبيه. هذه الواجهة تمشي على القاعدة نفسها:

     • السطح كله بلا لون — مِداد ورقّ ورماد.
     • الأحمر لا يظهر إلا حيث يُطلب إنسان: متأخرة، عاجلة،
       والموضع الذي أنت فيه الآن.

   لذلك لا توجد هنا ألوان حالات ولا ألوان أولويات ولا ألوان
   أشخاص. اللون إشارة، لا زينة. من أراد تغيير الهوية فليغيّر
   ‎--rubric‎ وحده، فيتبعه الموقع كله.
   ================================================================= */

:root {
  /* ---- المِداد والورق --------------------------------------- */
  --ink:        #17191C;   /* المتن، وأرضية الشريط           */
  --ink-soft:   #2A2D31;   /* طبقة أعلى داخل الشريط          */
  --field:      #DEDCD6;   /* أرضية الصفحة — رقّ رمادي دافئ  */
  --field-deep: #D4D1CA;   /* الغائر: الحقول والخانات        */
  --sheet:      #F7F6F3;   /* الورقة: البطاقات والجداول      */
  --sheet-alt:  #EFEEEA;   /* صفّ متناوب، ورأس عمود          */

  /* ---- النصوص ------------------------------------------------ */
  --text:       #17191C;
  --quiet:      #4C4942;   /* ثانوي                           */
  --faint:      #6B675F;   /* تسميات وأرقام خافتة             */
  --on-ink:     #E9E7E2;   /* نصّ فوق المِداد                 */
  --on-ink-dim: #B3AFA6;

  /* ---- الخطوط الفاصلة ---------------------------------------- */
  --rule:       #C5C1B8;   /* الشعرة الفاصلة                  */
  --rule-firm:  #A8A298;   /* فاصل أوضح                       */
  --rule-ink:   #34373C;   /* فاصل داخل الشريط                */

  /* ---- الحُمرة: الإشارة الوحيدة ------------------------------ */
  --rubric:      #C02E1E;
  --rubric-deep: #9B2317;  /* عند الضغط                       */
  --rubric-wash: #F2DFDB;  /* خلفية التنبيه، بلا تشبّع        */

  /* ---- الظل: موضع واحد فقط ----------------------------------- */
  /* لا ظلال على البطاقات ولا على الأزرار. الظل يعني «فوق
     الصفحة»، فلا يُستعمل إلا للنوافذ المنبثقة. */
  --lift: 0 24px 60px rgba(23, 25, 28, .28);

  /* ---- الشكل --------------------------------------------------- */
  /* زوايا شبه قائمة: الورقة تُقصّ ولا تُذوّب. */
  --r:    2px;
  --r-lg: 3px;

  /* ---- الخطوط -------------------------------------------------- */
  /* عرض: كوفي هندسي، يُستعمل بإمساك — العناوين ورؤوس الأعمدة.
     متن: بلكس عربي.
     بيانات: بلكس أحادي — كل تاريخ وعدد ووقت، بأرقام متساوية
     العرض حتى تصطفّ الأعمدة تحت بعضها. */
  --font-display: "Noto Kufi Arabic", "Reem Kufi", Tahoma, sans-serif;
  --font:         "IBM Plex Sans Arabic", "Segoe UI", Tahoma, system-ui, sans-serif;
  /* المُنَضَّد بلا حروف عربية: الأرقام واللاتيني منه، والعربي
     يسقط على خط المتن. بهذا الترتيب لا يظهر خطّ نظام غريب. */
  --font-data:    "IBM Plex Mono", "IBM Plex Sans Arabic", ui-monospace, monospace;

  --ease: cubic-bezier(.2, 0, 0, 1);
}

/* =================================================================
   الوضع الليلي — يُقلب المِداد والورق، وتبقى الحُمرة حُمرة.
   يتبع الجهاز، ويتقدّم عليه اختيار المستخدم من زر الشريط.
   ================================================================= */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink:        #0B0C0E;
    --ink-soft:   #16181B;
    --field:      #121417;
    --field-deep: #0D0F11;
    --sheet:      #1A1D20;
    --sheet-alt:  #212427;

    --text:       #E6E4DF;
    --quiet:      #B5B1A8;
    --faint:      #938F86;
    --on-ink:     #E6E4DF;
    --on-ink-dim: #A5A199;

    --rule:       #2E3236;
    --rule-firm:  #434750;
    --rule-ink:   #2A2D31;

    --rubric:      #EC5B46;
    --rubric-deep: #F47A68;
    --rubric-wash: #351512;

    --lift: 0 24px 60px rgba(0, 0, 0, .72);
  }
}

:root[data-theme="dark"] {
  --ink:        #0B0C0E;
  --ink-soft:   #16181B;
  --field:      #121417;
  --field-deep: #0D0F11;
  --sheet:      #1A1D20;
  --sheet-alt:  #212427;

  --text:       #E6E4DF;
  --quiet:      #B5B1A8;
  --faint:      #938F86;
  --on-ink:     #E6E4DF;
  --on-ink-dim: #A5A199;

  --rule:       #2E3236;
  --rule-firm:  #434750;
  --rule-ink:   #2A2D31;

  --rubric:      #EC5B46;
  --rubric-deep: #F47A68;
  --rubric-wash: #351512;

  --lift: 0 24px 60px rgba(0, 0, 0, .72);
}