/* ===================================================================
   assets/theme.css — لوحة الألوان: مصدر واحد لكل الصفحات السبع

   ولماذا ملف مستقل لا داخل بناء Tailwind؟ لأن لوحة الإدارة (index.html)
   لا تستعمل Tailwind إطلاقًا — لها رموزها الخاصة في manage.css. ولو
   عاشت القيم داخل الملف المبنيّ لاحتاجت اللوحة نسخة ثانية منها، ونسختان
   تعنيان أن إحداهما ستتخلّف عن الأخرى فيظهر لونان مختلفان لشيء واحد.

   ★ يُربط قبل tailwind.css وقبل كتلة <style> في كل صفحة. ★

   ───────────────────────────────────────────────────────────────────
   ★ ثلاث عائلات لونية، لا ثمان. ★

   كان المشروع يشغّل ثمانيًا: ذهبًا بخمس درجات، وعنبر Tailwind بستّ،
   ومحايدًا دافئًا، وثلاثة ألوان باردة لا تمتّ إلى الهوية بصلة (فضّي،
   وسماوي، وأزرق رمادي)، وأخضر، وأحمرين. والباردُ منها كان يقاوم الهوية
   بصريًّا، والعنبرُ لوحةً ثانية للذهب نفسه اضطرّت هذا الملف إلى تسع
   قواعد ‎!important‎ لتصحيحها ليلًا.

   فصارت:
     ١ — الذهب      هوية العلامة، وسلّمه أربع درجات ونقطة تحذير واحدة
     ٢ — محايد دافئ  الأسطح والحدود والحبر، سلّم واحد يميل إلى حرارة الذهب
     ٣ — الحبر       أغمق درجات المحايد نفسه
   ولونا حالة اثنان لا يظهران إلا في شارة أو تنبيه: أخضر وأحمر.

   ولا وجود بعد اليوم لـ silver ولا secondary ولا tertiary ولا error
   (كانت مكرّرة لـ error-red) — حُذفت من الملف ومن مواضع استعمالها
   القليلة، لا أُخفيت خلف أسماء مستعارة.
   =================================================================== */

  /* ===================================================================
     الوضع النهاري — أبيض وذهبي ومحايد دافئ

     ★ لم تتغيّر قيمة واحدة هنا. ★ الوضع النهاري لم يكن مكسورًا، فما جرى
     له حذفُ الدخيل ودمجُ المكرّر فحسب. وأيّ تعديل «تجميلي» على قيمة
     يقرؤها زبون في وضح النهار هو مخاطرة بلا مقابل.
     =================================================================== */
  :root {
    /* ── الذهب ── */
    --c-primary: 117 91 0;              /* أغمق الذهب — نصّ وأيقونات على فاتح */
    --c-primary-container: 201 162 39;  /* ذهب العلامة — الأزرار والتعبئة */
    --c-brand-gold: 201 162 39;         /* الاسم نفسه بقيمة واحدة في الوضعين */
    --c-deep-gold: 184 144 31;          /* درجة بين العلامة وأغمقها — للتدرّجات */
    --c-gold-soft: 238 193 78;          /* ذهب فاتح للتعبئة (كان tertiary-container) */
    --c-on-gold-soft: 77 57 0;          /* حبره — ينقلب معه، فهما زوج */

    /* ── نقطة التحذير: درجة على محور الذهب نفسه، أشبع منه لا أغرب ──
       شريط انقطاع الشبكة وصفوف الأرقام المشكوك فيها. ولماذا لا ذهب
       العلامة نفسه؟ لأن وظيفة التنبيه أن يُلاحَظ، ولو صار بلون الهوية
       ذاب وسط الذهب المنتشر في الصفحة — في شاشة الاستقبال، ليلة
       المناسبة. فهو ذهب أميل إلى البرتقالي (‎40°‎ لا ‎46°‎) وأشبع (‎87٪‎ لا
       ‎67٪‎): من العائلة، ومتميّز داخلها. */
    --c-warning: 176 122 12;
    --c-warning-ink: 110 76 8;          /* نصّه — التشبّع العالي لا يُقرأ صغيرًا */

    /* ── المحايد الدافئ: سلّم واحد من الخلفية إلى الحبر ── */
    --c-background: 253 249 242;
    --c-surface: 253 249 242;
    --c-surface-lowest: 255 255 255;
    --c-surface-container-low: 247 243 236;
    --c-surface-container-high: 236 232 225;
    --c-surface-container-highest: 230 226 220;
    --c-outline-variant: 209 197 175;   /* الحدود الخفيفة */
    --c-outline: 127 118 99;            /* الحدود والأيقونات الباهتة */
    --c-muted-gold: 138 133 119;        /* النصّ الثانوي */
    --c-on-surface-variant: 77 70 53;   /* نصّ ثانوي أوضح */
    --c-on-surface: 28 28 24;           /* الحبر */
    --c-on-background: 28 28 24;

    /* ── حبر على ذهب: لا ينقلب (انظر ملاحظة الوضع الليلي) ── */
    --c-charcoal: 43 42 38;

    /* ── الحالة ──
       ★ هذان اللونان غُمّقا في ٢٩ أغسطس ٢٠٢٦، وهما التغيير النهاري
       الوحيد في هذا العمل — وليس تجميلًا. ★

       كانا 63 174 107 و 212 87 78، أي 2.7:1 و 3.8:1 على خلفية الصفحة،
       والحدّ 4.5 للنصّ الصغير و3.0 للعناصر الرسومية. فالأحمر كان يجتاز
       حدّ الأشكال دون النصّ، والأخضر كان دون الحدّين معًا — حتى نقاط
       التقويم الخضراء كانت تحته.

       وموضع الضرر معروف: كلمة «سليم» في معاينة أرقام صفحة القائمة،
       ونصّ الشارات، والأبيض فوق زرّ «انشره في واتساب» الأخضر (2.8:1).
       والعروسان يفتحان تلك الصفحة على جوّالهما في ضوء النهار.

       وبعد التغميق: 5.1:1 و 5.9:1 — وزاوية اللون كما هي، فلم يخرجا
       عن دفء اللوحة. والوضع الليلي لم يُمسّ: قيمتاه هناك عند 6.4 و6.1
       أصلًا، فالخلل كان نهاريًّا وحده. ── */
    --c-success-green: 26 122 74;
    --c-error-red: 176 52 44;
  }

  /* ===================================================================
     الوضع الليلي — برجندي غامق وذهبي شامبانيا
     (Deep Burgundy & Champagne Gold — قرار المالك، ١٩ سبتمبر ٢٠٢٦)

     حلّ محلّ البنّي الدافئ السابق. والذهب هو الجسر بين الوضعين: شامبانيا
     هنا، وذهب العلامة نهارًا — العائلة نفسها، والدور نفسه.

     ★ العمق من سلّم محسوب، لا من كتلة برجندية واحدة. ★ خمس درجات على
     زاوية لون واحدة (~335°)، كلّ منها أعلى من سابقتها بخطوة ثابتة:

         الأرضية      #090407  Obsidian      ← background · surface
         البطاقة      #14080D  Deep Wine     ← surface-lowest
         السطح الداخلي #190B11  Calendar Wine ← container-low
         المرتفع      #211018  Raised Merlot ← container-high
         المحدَّد      #2A1520  (مشتقّة)      ← container-highest

     والفرق بين درجتين متجاورتين صغير عمدًا (≈1.04:1)، فالذي يرسم حدود
     البطاقات هو الحدّ البرجندي #3E1D28 لا فرق السطوع — وهكذا تبقى
     الصفحة غامقة من غير أن تذوب الطبقات بعضها في بعض.

     ★ النصّ الأساسي #E4D4D8 لا #F4E7E9. ★ العاجي المورّد كما هو يعطي
     16:1 على الأرضية، وقد خُفّض الحبر الليلي من قبل لهذا بعينه: التباين
     الزائد يُحدث هالة حول الحروف العربية. فهو الدرجة نفسها أخفت قليلًا
     — 13.7:1 على البطاقة.

     التباين على البطاقة #14080D (الحدّ 4.5 للنصّ الصغير):
         الحبر       13.7     الذهب       9.7     الأخضر   7.3
         نصّ ثانوي    7.9     البرونزي     6.1     الأحمر   6.3
         نصّ خافت     5.6     الموف        4.9     التحذير  8.0
         حبر على الشامبانيا 9.1 · وعلى البرونزي (طرف التدرّج) 5.7

     ★ الذهب مرشَّد. ★ للنصّ المميّز والأيقونات المهمّة والتركيز واليوم
     الحالي والعنصر النشط — لا للحدود العادية، فتلك برجندية.

     ★ رمز واحد لا ينقلب عن قصد: ★
       charcoal   حبر داكن على الذهب. وهو يُستعمل على أزرار ذهبية فقط،
                  فلو انقلب صار نصًّا فاتحًا على خلفية ذهبية — أي لا
                  يُقرأ في الوضعين. قيمته الليلية حبر نبيتي (#1E1109)
                  لينتمي إلى البرجندي، وتبقى داكنة.
     =================================================================== */
  [data-theme="dark"] {
    /* أشرطة التمرير وقوائم الاختيار ومنتقي التاريخ من المتصفّح نفسه —
       كانت تُرسم بيضاء وسط النافذة الداكنة */
    color-scheme: dark;

    /* ── الذهب: شامبانيا للكتابة والتعبئة، برونزي لطرف التدرّج ── */
    --c-primary: 213 177 108;             /* Champagne Gold */
    --c-primary-container: 213 177 108;
    --c-brand-gold: 213 177 108;
    --c-deep-gold: 185 133 69;            /* Antique Bronze — تدرّج لا نصّ */
    --c-gold-soft: 59 42 30;              /* شامبانيا ممزوجة بالنبيتي */
    --c-on-gold-soft: 235 211 160;        /* 9.4:1 على gold-soft */

    /* ── التحذير: عنبر أسخن من الشامبانيا (33° لا 39°) كي لا يذوب فيها ── */
    --c-warning: 224 150 58;
    --c-warning-ink: 240 194 126;

    /* ── سلّم البرجندي ── */
    --c-background: 9 4 7;                /* Obsidian Burgundy */
    --c-surface: 9 4 7;
    --c-surface-lowest: 20 8 13;          /* Deep Wine — البطاقات والنوافذ */
    --c-surface-container-low: 25 11 17;  /* Calendar Wine — التقويم والأسطح الداخلية */
    --c-surface-container-high: 33 16 24; /* Raised Merlot — الرؤوس والتحويم والمحدَّد */
    --c-surface-container-highest: 42 21 32;
    --c-outline-variant: 62 29 40;        /* Burgundy Border — الحدّ الافتراضي */
    --c-outline: 143 122 128;             /* Archived Mauve — حدّ قويّ، معطّل، منتهٍ */
    --c-muted-gold: 156 131 139;          /* وردي ترابي أخفت — نصّ خافت */
    --c-on-surface-variant: 185 158 164;  /* Dusty Rose — نصّ ثانوي */
    --c-on-surface: 228 212 216;          /* Ivory Blush مخفَّف (انظر أعلاه) */
    --c-on-background: 228 212 216;

    --c-charcoal: 30 17 9;                /* Dark Wine Ink — على الذهب فقط */

    /* ── الحالة: منفصلة عن الهوية دلاليًّا ── */
    --c-success-green: 120 169 135;       /* Muted Sage */
    --c-error-red: 202 125 118;           /* Soft Coral Red */
  }

  /* ★ حلقة التركيز ذهبية لا زرقاء — في الوضعين. ★ إضافة forms في Tailwind
     ترسم حول الحقل المركَّز حلقةً بلونها الافتراضي ‎#2563eb‎: أزرق بارد،
     وهو اللون الذي تمنعه اللوحة صراحةً. فهي هنا ‎primary‎ — ذهبٌ داكن نهارًا
     وشامبانيا ليلًا، أي لونُ الحدّ نفسه (‎focus:border-primary‎)، فيتّحد
     الإطار والحلقة في خطٍّ واحد. وصنفُ ‎focus:ring-*‎ الصريح يغلب هذه
     القاعدة، فمن أراد لونًا آخر لحقلٍ بعينه كتبه عليه.
     و‎:root‎ في أوّلها ليس زينة: محدِّد الإضافة ‎[type='text']:focus‎ أثقل
     من ‎input:focus‎ ويأتي بعده (tailwind.css بعد هذا الملفّ)، فبغيرها
     تبقى الحلقة زرقاء نهارًا. */
  :root :is(input, select, textarea):focus { --tw-ring-color: rgb(var(--c-primary)); }

  /* زخرفة الخلفية أخفت في الليل: العلامة المائية الذهبية على خلفية
     داكنة تبدو أوضح مما ينبغي بالنسبة نفسها. */
  [data-theme="dark"] .watermark-bg { opacity: .035; }

/* ===================================================================
   ★ ولا قاعدة ‎!important‎ واحدة بعد اليوم. ★

   كانت هنا تسع قواعد تصحّح ألوان Tailwind الجاهزة (amber · sky) ليلًا،
   لأنها قيم ثابتة مصمّمة لخلفية بيضاء: تركُها يعطي مستطيلات فاتحة ساطعة
   وسط صفحة داكنة ونصًّا داكنًا لا يُقرأ عليها.

   وقد زالت لأن مواضعها زالت: شريط الانقطاع وصفوف المعاينة وبطاقة مراجعة
   التكرار صارت على ‎warning‎، وشارة المزامنة على المحايد — وكلّها رموز
   تنقلب من تلقائها، فصنف واحد يعمل في الوضعين.
   =================================================================== */


/* ===================================================================
   ‎.sicon‎ — الأيقونة المرسومة داخل الصفحة

   تسكن هنا لأن هذا الملفّ هو الوحيد الذي تربطه الصفحات الثماني كلّها.
   ووضعُها في ‎manage.css‎ يخدم لوحة الإدارة وحدها، وفي ‎venue.css‎
   الصفحة العامّة وحدها — فتصير لها ثلاث نسخ تتخلّف إحداها.

   ★ الرسم كلّه هنا، ولا شيء منه في ملفّ الأيقونة. ★ ملفّات Lucide
   تحمل ‎stroke-width‎ و‎fill‎ و‎linecap‎ على وسم ‎<svg>‎ نفسه، وهو
   الوسم الذي يسقط حين تصير الأيقونةُ ‎<symbol>‎. فلو نُقلت تلك
   الصفات إلى كل رمز لصارت اثنتين وستّين نسخة من قرارٍ واحد، وتغييرُ
   سماكة الخطّ يلزمه اثنتان وستّون لمسة. وهي هنا سطرٌ واحد.

   ★ و‎1.6‎ لا ‎2‎. ★ سماكة Lucide الافتراضيّة اثنان، وهي صحيحة لواجهةٍ
   عامّة وثقيلةٌ قليلًا إلى جانب خطّ Cairo الرفيع وذهبِ الهويّة. و‎1.6‎
   أرقّ من غير أن تبهت على شاشةٍ عاديّة الكثافة — وهي المقبض الوحيد
   لو أُريد الشكل أرقّ أو أمتن.

   ★ والمقاس من حجم الخطّ لا برقمٍ ثابت. ★ ‎1em‎ تعني أن الأيقونة
   تكبر وتصغر مع النصّ الذي تجاوره، فلا تحتاج صنفًا لكل موضع؛ ومن
   أراد مقاسًا بعينه كتبه على الحاوية (‎text-[18px]‎) كما كان يفعل مع
   خطّ الأيقونات تمامًا.
   =================================================================== */
.sicon {
  width: 1em; height: 1em;
  flex: none;
  display: inline-block;
  vertical-align: -0.145em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;          /* حدُّ الخطّ لا يُقصّ عند حافة الـ viewBox */
  pointer-events: none;       /* الضغط يصيب الزرّ لا الرسم داخله */
}

/* أيقونةٌ وحدها في زرّ: تكبر قليلًا لأن لا نصَّ بجوارها يحدّد مقاسها */
.sicon-lg { width: 1.35em; height: 1.35em; vertical-align: -0.27em; }

/* ===================================================================
   ‎.auth-loading‎ — شاشة الانتظار أثناء الدخول (pinGate في utils.js)

   فوق شاشة الرمز (#pinLock عند 100) وفوق الصفحة، بأرضية الصفحة نفسها،
   فلا يرى المستخدم زرَّ الدخول وهو ينتظر ردّ الخادم.
   =================================================================== */
.auth-loading {
  position: fixed; inset: 0; z-index: 300;
  background: rgb(var(--c-surface));
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  color: rgb(var(--c-on-surface-variant)); font-weight: 700; font-size: 1rem; text-align: center; padding: 24px;
}
.auth-loading[hidden] { display: none; }
.auth-loading p { margin: 0; }
.auth-spin {
  width: 38px; height: 38px; border-radius: 50%;
  border: 3px solid rgb(var(--c-brand-gold) / .22);
  border-top-color: rgb(var(--c-brand-gold));
  animation: auth-spin .8s linear infinite;
}
@keyframes auth-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .auth-spin { animation-duration: 2.4s; } }

/* ===================================================================
   ‎.is-suggested‎ — قيمةٌ اقترحها النظام ولم يكتبها المستخدم

   ★ الاقتراح لا يلبس ثوب الإدخال. ★ رقمٌ داكن عريض في حقلٍ يُقرأ قرارًا
   اتُّخذ، فلا يعرف المالك أنه يستطيع تغييره — أو يظنّه كتبه من قبل.
   فالمقترح باهت ووزنه عاديّ كالنصّ الإرشاديّ، ويعود إلى لون الإدخال مع
   أول حرفٍ يكتبه المستخدم (markSuggested في js/ui.js).
   =================================================================== */
input.is-suggested, textarea.is-suggested, select.is-suggested {
  color: rgb(var(--c-outline)) !important;
  font-weight: 400 !important;
}
