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

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

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

  /* ===================================================================
     الوضع النهاري — أبيض وذهبي وفضّي
     =================================================================== */
  :root {
    --c-primary: 117 91 0;
    --c-primary-container: 201 162 39;
    --c-on-surface: 28 28 24;
    --c-on-surface-variant: 77 70 53;
    --c-on-background: 28 28 24;
    --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: 127 118 99;
    --c-outline-variant: 209 197 175;
    --c-secondary: 89 95 100;
    --c-tertiary: 119 90 0;
    --c-tertiary-container: 238 193 78;
    --c-on-tertiary-container: 77 57 0;
    --c-error: 186 26 26;
    --c-brand-gold: 201 162 39;
    --c-deep-gold: 184 144 31;
    --c-charcoal: 43 42 38;
    --c-muted-gold: 138 133 119;
    --c-success-green: 63 174 107;
    --c-error-red: 212 87 78;
    --c-silver: 170 176 182;
  }

  /* ===================================================================
     الوضع الليلي

     ليس عكسًا حسابيًّا للنهاري. فالخلفية دافئة تميل إلى البنّي لا رمادية
     محايدة، لتبقى الهوية الذهبية متّسقة معها.

     ★ ثلاثة رموز لا تنقلب عن قصد: ★
       primary-container  الذهب يبقى ذهبًا — هو هوية العلامة
       charcoal           حبر داكن على الذهب. وهو يُستعمل على أزرار
                          ذهبية فقط، فلو انقلب صار نصًّا فاتحًا على
                          خلفية ذهبية — أي لا يُقرأ في الوضعين
       silver             فضّي محايد أصلًا، مقروء على الاثنين
     =================================================================== */
  [data-theme="dark"] {
    --c-primary: 227 195 91;
    --c-primary-container: 201 162 39;
    --c-on-surface: 240 236 226;
    --c-on-surface-variant: 205 197 178;
    --c-on-background: 240 236 226;
    --c-background: 26 24 21;
    --c-surface: 26 24 21;
    --c-surface-lowest: 34 31 27;
    --c-surface-container-low: 35 32 27;
    --c-surface-container-high: 46 42 35;
    --c-surface-container-highest: 56 51 42;
    --c-outline: 154 145 124;
    --c-outline-variant: 74 68 55;
    --c-secondary: 185 191 196;
    --c-tertiary: 238 193 78;
    --c-tertiary-container: 92 71 8;
    --c-on-tertiary-container: 245 226 168;
    --c-error: 255 180 171;
    --c-brand-gold: 217 181 63;
    --c-deep-gold: 227 195 91;
    --c-charcoal: 43 42 38;
    --c-muted-gold: 168 161 145;
    --c-success-green: 92 196 135;
    --c-error-red: 232 139 132;
    --c-silver: 170 176 182;
  }

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

/* ===================================================================
   ألوان Tailwind الجاهزة (amber · sky) داخل الوضع الليلي

   هذه ليست من لوحتنا ولا تتبع متغيّراتها — فهي قيم ثابتة في Tailwind
   مصمّمة لخلفية بيضاء. وتركها كما هي في الليل يعطي مستطيلات فاتحة
   ساطعة وسط صفحة داكنة، ونصًّا داكنًا لا يُقرأ عليها.

   والمواضع محدودة ومعروفة: شريط انقطاع الشبكة في شاشة الاستقبال،
   وصفوف المعاينة الملوّنة في صفحة القائمة، وبطاقة مراجعة التكرار.
   =================================================================== */
[data-theme="dark"] .bg-amber-100  { background-color: rgb(69 46 8) !important; }
[data-theme="dark"] .bg-amber-50   { background-color: rgb(54 38 10) !important; }
[data-theme="dark"] .bg-amber-100\/40 { background-color: rgb(69 46 8 / .4) !important; }
[data-theme="dark"] .text-amber-800,
[data-theme="dark"] .text-amber-900 { color: rgb(252 231 168) !important; }
[data-theme="dark"] .text-amber-600 { color: rgb(240 199 100) !important; }
[data-theme="dark"] .border-amber-300 { border-color: rgb(146 108 24) !important; }

[data-theme="dark"] .bg-sky-100    { background-color: rgb(14 46 66) !important; }
[data-theme="dark"] .text-sky-800  { color: rgb(186 222 248) !important; }
[data-theme="dark"] .border-sky-300{ border-color: rgb(46 94 130) !important; }