/* =====================================================================
   TMC BRAND THEME — المصدر الوحيد للون الرئيسي في واجهة العميل
   ---------------------------------------------------------------------
   لتغيير هوية الموقع بالكامل لاحقًا عدّل سطرين فقط:
       --tmc-primary       اللون الرئيسي (HEX)
       --tmc-primary-rgb   نفس اللون كقنوات RGB (تُستخدم للشفافيات)
   وكل ما تبقّى — الدرجات والحدود والظلال والتدرّجات — يُشتق منهما.

   اللون الحالي: البني الداكن المعتمد في لوحة التحكم (#32221b).
   ملاحظة: هذا الملف يجب أن يُحمَّل قبل client.css.
   ===================================================================== */

:root {
   /* ================= اللون الرئيسي ================= */
   --tmc-primary: #32221b;
   --tmc-primary-rgb: 50, 34, 27;

   /* ================= الدرجات المشتقة =================
      سلّم مبني على درجة اللون نفسها (H≈18°) من الأفتح إلى الأغمق. */
   --tmc-primary-50: #f9f5f3;
   --tmc-primary-100: #f2ebe9;
   --tmc-primary-200: #e1d5d0;
   --tmc-primary-300: #c6b2a9;
   --tmc-primary-400: #967769;
   --tmc-primary-500: #76594c;
   --tmc-primary-600: #604539;
   --tmc-primary-700: #493227;
   --tmc-primary-800: var(--tmc-primary);
   --tmc-primary-900: #1f1511;
   --tmc-primary-950: #120c0a;

   /* ================= الأدوار الدلالية =================
      استعمل هذه الأسماء في الأنماط بدل الدرجات الرقمية. */
   --tmc-primary-dark: var(--tmc-primary-900);      /* hover / active */
   --tmc-primary-strong: var(--tmc-primary-700);    /* طرف التدرّجات */
   --tmc-primary-deep: var(--tmc-primary-600);      /* عناوين ثانوية */
   --tmc-primary-muted: var(--tmc-primary-500);     /* نص خافت */
   --tmc-primary-subtle: var(--tmc-primary-400);    /* أيقونات خافتة */
   --tmc-primary-border: var(--tmc-primary-300);    /* حدود ظاهرة */
   --tmc-primary-line: var(--tmc-primary-200);      /* فواصل رفيعة */
   --tmc-primary-soft: var(--tmc-primary-100);      /* خلفية ناعمة */
   --tmc-primary-tint: var(--tmc-primary-50);       /* أفتح خلفية */
   --tmc-primary-on: #ffffff;                       /* النص فوق اللون الرئيسي */

   /* تدرّجات وظلال جاهزة — كلها مشتقّة من اللون الرئيسي */
   --tmc-primary-gradient: linear-gradient(135deg, var(--tmc-primary-strong) 0%, var(--tmc-primary) 100%);
   --tmc-shadow-rgb: var(--tmc-primary-rgb);

   /* ================= أسماء قديمة (توافقية) =================
      أبقيناها لأن أنماطًا كثيرة ما زالت تشير إليها. */
   --tmc-gold: var(--tmc-primary);
   --tmc-gold-dark: var(--tmc-primary-dark);
   --tmc-brand: var(--tmc-primary);
   --tmc-brand-dark: var(--tmc-primary-dark);
   --tmc-brand-soft: var(--tmc-primary-soft);
   --tmc-ivory: var(--tmc-primary-50);
   --tmc-cream: var(--tmc-primary-100);
}

/* ربط متغيّرات Bootstrap باللون الرئيسي نفسه.
   نكرّر التعريف على سمات الثيم لأن Bootstrap يعرّفها عليها بنفس الأولوية. */
:root,
[data-bs-theme='light'],
[data-bs-theme='dark'] {
   --bs-primary: var(--tmc-primary);
   --bs-primary-rgb: var(--tmc-primary-rgb);
   --bs-primary-text-emphasis: var(--tmc-primary-dark);
   --bs-primary-bg-subtle: var(--tmc-primary-soft);
   --bs-primary-border-subtle: var(--tmc-primary-border);
   --bs-link-color: var(--tmc-primary);
   --bs-link-color-rgb: var(--tmc-primary-rgb);
   --bs-link-hover-color: var(--tmc-primary-dark);
}

/* أزرار SweetAlert تتبع لون الهوية بدل البنفسجي الافتراضي.
   نرفع التخصيص لأن أنماط المكتبة تستخدم :where() عديم الأولوية. */
body div.swal2-container button.swal2-styled.swal2-confirm {
   background-color: var(--tmc-primary);
   color: var(--tmc-primary-on);
}
body div.swal2-container button.swal2-styled.swal2-confirm:hover {
   background-color: var(--tmc-primary-dark);
}
body div.swal2-container button.swal2-styled.swal2-confirm:focus {
   box-shadow: 0 0 0 3px rgba(var(--tmc-primary-rgb), .45);
}
body div.swal2-container button.swal2-styled.swal2-cancel {
   background-color: var(--tmc-primary-soft);
   color: var(--tmc-primary);
}