/* ════════════════════════════════════════════════════════════════════════════
 * atheer-neon.css — نظام لونٍ واحد، حيٌّ في الثيمين
 *
 * الشكوى كانت دقيقة: بطاقات «إجمالي · متّصل · غير متّصل · بلا جهاز» بدت
 * **مغبَّرة** — زيتونيّ موحل ووردة مغبرّة. والسبب مقيس لا مُخمَّن:
 *
 *   القديم (الفاتح)   التشبّع            الجديد        التشبّع
 *   success #1f6a3d    ٥٥٪      ←      #007a52       ١٠٠٪
 *   warning #7e5509    ٨٧٪      ←      #946200       ١٠٠٪
 *   danger  #a6372a    ٦٠٪      ←      #c81e4a        ٧٤٪
 *   info    #245e9f    ٦٣٪      ←      #0369a1        ٩٦٪
 *
 *   القديم (الداكن)   التشبّع/التباين     الجديد     التشبّع/التباين
 *   success #46b36f   ٤٤٪ · ٦٫٥٨  ←   #2ee6a8    ٧٩٪ · ١٠٫٧٨
 *   warning #e0a53a   ٧٣٪ · ٧٫٩٧  ←   #ffc53d   ١٠٠٪ · ١١٫٠٣
 *   danger  #e68074   ٧٠٪ · ٦٫٣٩  ←   #ff6b81   ١٠٠٪ · ٦٫٣٦
 *   info    #6ba0de   ٦٤٪ · ٦٫٣٩  ←   #5ad1ff   ١٠٠٪ · ٩٫٩٥
 *
 * **كلّ قيمة هنا قيست قبل كتابتها**، وكلّها تتجاوز AA على سطحها وعلى
 * خلفيّتها الناعمة معًا — لا لونَ اختير لأنّه «يبدو حيًّا» وحده:
 *   الفاتح: أدنى تباين ٤٫٧٠ على الأبيض · ٤٫٤٣ على `#f0f3f9`
 *   الداكن: أدنى تباين ٥٫٥٨ على الخلفيّة الناعمة · ٦٫٣٦ على السطح
 *
 * ولماذا «فسفوريّ» يعني شيئين مختلفين في الثيمين: أصفرٌ نيونيّ على أبيض
 * لا يُقرأ. ففي الداكن الحياةُ **ضياء** (إشراق عالٍ)، وفي الفاتح الحياةُ
 * **نقاءُ صبغة** (تشبّع كامل بإشراقٍ منخفض). عكسُ ذلك يُنتج شاشةً جميلةً
 * في لقطة وغيرَ مقروءة في الاستعمال.
 *
 * وطبقةٌ متأخّرة لا تعديلٌ في `atheer-vireo-map.css`: كلّ من يستهلك هذه
 * الألوان يقرؤها بـ`var(--at-…)`، فتعريفها هنا يحرّك النظام كلّه — البطاقات
 * والشارات والمعالجات والرسوم — بلا لمس ملفٍّ واحد من مستهلكيها.
 * ════════════════════════════════════════════════════════════════════════════ */

/* ── الثيم الفاتح ───────────────────────────────────────────────────────── */
:root {
  --at-success:      #007a52;   --at-success-bg: #beddd3;
  --at-warning:      #946200;   --at-warning-bg: #e2d5bb;
  --at-danger:       #c81e4a;   --at-danger-bg:  #f3cdd6;
  --at-info:         #0369a1;   --at-info-bg:    #c2dae8;

  /* الأزرق الأساس: الصبغة نفسها (٢٢٠° ← ٢٢٢°) والتشبّع ٦٦٪ ← ٨٦٪.
   * والتباين ارتفع ٥٫٨٢ ← ٦٫٢٧، فالحيويّة هنا لم تُشترَ من المقروئيّة. */
  --at-accent:       #1152e4;
  --at-accent-hover: #0d45c4;
  --at-accent-soft-bg: #c7d7f9;
  /* 🔴 السلسلة الأولى تتبع الأساس بالتعريف — تُركت في الداكن وحده أوّلَ مرّة،
   * فكان الرسم في الفاتح بأزرقٍ وبقيّةُ الشاشة بأزرقَ آخر. */
  --chart-1:         #1152e4;

  /* الأشقّاء — تُترك واحدةً منها فيبقى نصف الشاشة على اللون القديم.
   * هذا سابع تكرارٍ للنمط، فعُدّدت كلّها بالبحث لا بالذاكرة. */
  --status-success-fg: #007a52;  --status-warning-fg: #946200;
  --status-error-fg:   #c81e4a;  --status-info-fg:    #0369a1;
  --status-success:    #007a52;  --status-warning:    #946200;
  --ce-success:        #007a52;  --ce-warning:        #946200;
  --sv-success:        #007a52;  --sv-warning:        #946200;
}

/* ── الثيم الداكن ──────────────────────────────────────────────────────────
 * 🔴 الحالتان إلزاميّتان: الاختيار الصريح، وتفضيل النظام دون اختيار.
 * كتلةٌ واحدة تترك نصف المستخدمين على اللون القديم. */
:root[data-theme="dark"] {
  --at-success:      #2ee6a8;   --at-success-bg: #1b413d;
  --at-warning:      #ffc53d;   --at-warning-bg: #423a28;
  /* 🔴 `#2c1219` كان تباينه مع السطح **١٫٠٠** — أي رقاقةٌ غيرُ مرئيّةٍ
   * كشكل، لونُ نصّها وحده يُظهرها. رُفع إلى ١٫١٤ ليطابق أشقّاءه. */
  --at-danger:       #ff6b81;   --at-danger-bg:  #54303c;
  --at-info:         #5ad1ff;   --at-info-bg:    #233e4e;

  /* الأساس: ٢١٧° ← ٢٠٥°، التشبّع ١٠٠٪ كما كان، والتباين ٦٫٨٨ ← ٨٫١٤.
   * أي أنّ المكسب **ضياء** لا تشبّعًا — وهو تعريف «فسفوريّ» على سطح داكن. */
  --at-accent:         #5ab9ff;
  --at-accent-hover:   #7cc9ff;
  --at-accent-on:      #0a0c11;   /* نصّ داكن فوق الملء الفاتح — ٩٫١٥ */
  --at-accent-soft-bg: #253d53;
  --chart-1:           #5ab9ff;

  --status-success-fg: #2ee6a8;  --status-warning-fg: #ffc53d;
  --status-error-fg:   #ff6b81;  --status-info-fg:    #5ad1ff;
  --status-success:    #2ee6a8;  --status-warning:    #ffc53d;
  --ce-success:        #2ee6a8;  --ce-warning:        #ffc53d;
  --sv-success:        #2ee6a8;  --sv-warning:        #ffc53d;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --at-success:      #2ee6a8;   --at-success-bg: #1b413d;
    --at-warning:      #ffc53d;   --at-warning-bg: #423a28;
    --at-danger:       #ff6b81;   --at-danger-bg:  #54303c;
    --at-info:         #5ad1ff;   --at-info-bg:    #233e4e;

    --at-accent:         #5ab9ff;
    --at-accent-hover:   #7cc9ff;
    --at-accent-on:      #0a0c11;
    --at-accent-soft-bg: #253d53;
    --chart-1:           #5ab9ff;

    --status-success-fg: #2ee6a8;  --status-warning-fg: #ffc53d;
    --status-error-fg:   #ff6b81;  --status-info-fg:    #5ad1ff;
    --status-success:    #2ee6a8;  --status-warning:    #ffc53d;
    --ce-success:        #2ee6a8;  --ce-warning:        #ffc53d;
    --sv-success:        #2ee6a8;  --sv-warning:        #ffc53d;
  }
}


/* ══════════════════════════════════════════════════════════════════════════
 * الخلفيّات الناعمة — رُفعت لأنّها كانت **غير مرئيّة** لا خافتة
 *
 * الشكوى: «الألوان باهتة جدًّا وبالكاد تُرى». والقياس أثبتها:
 *   الفاتح: التباين مع الأبيض **١٫١١–١٫١٧** — أي أقلّ ممّا تفرّقه العين.
 *   الداكن: ١٫٠٩–١٫١٤ مع سطح البطاقة.
 * وصارت **١٫٤٥** في الفاتح و**١٫٥٥** في الداكن — رقاقةٌ تُرى شكلًا لا لونًا
 * وحده، ودون أن تصير كتلةً تسحب النظر من الرقم.
 *
 * 🔴 والحدّ المستعمَل للأيقونة داخلها **٣:١ لا ٤٫٥:١**: الأيقونة عنصرٌ
 * رسوميّ لا نصّ، وحدّ النصّ عليها يمنع أيّ تلوينٍ مرئيّ أصلًا — فهما
 * متعارضان رياضيًّا. أدنى تباين للأيقونة بعد التغيير: ٣٫٦١ فاتح · ٤٫١١ داكن.
 * ══════════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════════════
 * رقاقة المؤشّر — تلوينٌ قويّ بأيقونةٍ حيّة (وهذا ما اعتمده المالك)
 *
 * جُرّبت ثلاث درجات، والمعتمَدة هي الوسطى:
 *   ١٫١١ تباين  → «بالكاد تُرى»       ✗
 *   ملءٌ مصمت   → كتلةٌ تسحب النظر     ✗
 *   **١٫٤٥ تباين + أيقونة بلون النبرة** ✓
 *
 * والقاعدة التي تفسّر الاختيار: **اللون في الأيقونة والرقم، والرقاقة أرضٌ
 * تحملهما**. فالعين تقع على المعلومة (الرقم) لا على الخلفيّة، والبطاقة
 * تبقى خفيفةً في شبكةٍ من أربع.
 *
 * 🔴 والحدّ للأيقونة **٣:١ لا ٤٫٥:١** — الأيقونة عنصرٌ رسوميّ لا نصّ،
 * وحدّ النصّ عليها يمنع أيّ تلوينٍ مرئيّ أصلًا (متعارضان رياضيًّا).
 * ══════════════════════════════════════════════════════════════════════════ */
.at-metric-card[data-tone="success"] .at-metric-card__icon { background: var(--at-success-bg); color: var(--at-success); }
.at-metric-card[data-tone="warning"] .at-metric-card__icon { background: var(--at-warning-bg); color: var(--at-warning); }
.at-metric-card[data-tone="danger"]  .at-metric-card__icon,
.at-metric-card[data-tone="error"]   .at-metric-card__icon { background: var(--at-danger-bg);  color: var(--at-danger); }
.at-metric-card[data-tone="info"]    .at-metric-card__icon { background: var(--at-info-bg);    color: var(--at-info); }
.at-metric-card[data-tone="brand"]   .at-metric-card__icon { background: var(--at-accent-soft-bg); color: var(--at-accent); }
/* 🔴 المحايد لم يعد رماديًّا: الصفحات تُسنِد `neutral` لكلّ ما ليس نجاحًا
 * أو خطرًا، فكان الرماديّ هو الأغلب لا الاستثناء — وثلاث بطاقات من أربع
 * تخرج بلا لون. صار أزرقَ الهويّة: حيًّا، ولا يدّعي حالة. */
.at-metric-card[data-tone="neutral"] .at-metric-card__icon,
.at-metric-card:not([data-tone])     .at-metric-card__icon {
  background: var(--at-accent-soft-bg); color: var(--at-accent);
}
.at-metric-card[data-tone="neutral"] .at-metric-card__value,
.at-metric-card:not([data-tone])     .at-metric-card__value { color: var(--at-accent); }

/* الرقاقة: مقاسٌ ثابت وحوافّ النظام. */
.at-metric-card__icon {
  inline-size: 34px; block-size: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--at-radius-sm, 4px);
}
.at-metric-card__icon .icon,
.at-metric-card__icon .material-symbols-rounded { font-size: 18px; }
/* والشريط العلويّ يحمل اللون كاملًا لا مخفَّفًا. */
.at-metric-card[data-tone]:not([data-tone="neutral"])::before {
  background: var(--mc-tone, var(--at-accent)) !important;
  opacity: 1 !important;
}