/* ============================================================
   مستودع زكرياء — ملف التنسيق الموحّد
   كل قاعدة مكتوبة مرة واحدة فقط. لا تكرار. لا تعارض.
   ============================================================ */

/* -------- الأساس -------- */
body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  background-color: #f8fafc !important;
  color: #1e293b !important;
}

/* -------- الحاويات الداكنة الأصلية من Tailwind → بيضاء -------- */
.bg-slate-950,
body.bg-slate-950 {
  background-color: #ffffff !important;
}

.bg-slate-900,
#sectionAdminDashboard {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
}

/* -------- حقول الإدخال العامة -------- */
select,
input,
textarea {
  background-color: #ffffff !important;
  color: #0f172a !important;
  border-color: #e2e8f0 !important;
}

/* -------- القائمة الجانبية -------- */
aside.bg-slate-900 {
  background-color: #fcfcfc !important;
  border-left: 1px solid #e2e8f0 !important;
}

/* -------- بطاقة ملخص الفاتورة (glass-card) -------- */
/* تعريف واحد فقط — أزرق سماوي واضح */
.glass-card {
  background-color: #e0f2fe !important;
  border: 2px solid #bae6fd !important;
  box-shadow: 0 4px 12px rgba(3, 105, 161, 0.08) !important;
  backdrop-filter: none !important;
}

.glass-card h3 {
  color: #0369a1 !important;
  font-weight: 900 !important;
  border-bottom-color: #7dd3fc !important;
}

.glass-card label {
  color: #075985 !important;
}

.glass-card input,
.glass-card select,
.glass-card textarea {
  background-color: #ffffff !important;
  border: 1.5px solid #7dd3fc !important;
  color: #0f172a !important;
}

/* -------- بنود السلة داخل الفاتورة -------- */
#cartItems > div {
  background-color: #ffffff !important;
  border: 1px solid #e0f2fe !important;
}

#cartItems p.font-bold       { color: #1e293b !important; }
#cartItems p.text-slate-400  { color: #64748b !important; }

/* -------- كروت المنتجات -------- */
#catalogGrid > div {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

#catalogGrid > div:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 4px 12px rgba(148, 163, 184, 0.12) !important;
}

/* شارة المخزون داخل الكرت */
#catalogGrid > div .absolute.top-3.left-3 {
  background-color: #f0fdf4 !important;
  color: #16a34a !important;
  border: 1px solid #bbf7d0 !important;
  font-size: 10px !important;
}

/* أيقونة المنتج الصغيرة */
#catalogGrid > div .w-10.h-10.bg-slate-950 {
  background-color: #f0f9ff !important;
  border-color: #bae6fd !important;
}

/* -------- صندوق عنوان القسم الحالي -------- */
/* تعريف واحد فقط — أزرق أعمق للثبات البصري */
#sectionStorefront > div.flex-col,
[id="sectionStorefront"] > div:first-child {
  background-color: #e0f2fe !important;
  border: 2px solid #bae6fd !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
}

#currentCategoryTitle {
  color: #0369a1 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  margin: 0 !important;
}

#sectionStorefront > div.flex-col p {
  color: #0284c7 !important;
  font-size: 11px !important;
  margin-top: 2px !important;
}

/* -------- كشف ديون المحلات (creditList) -------- */
/* تعريف واحد فقط — وردي مشبع وثابت */
#creditList > div {
  background-color: #ffe4e6 !important;
  border: 1.5px solid #fecdd3 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  transition: border-color 0.2s ease !important;
}

#creditList > div:hover {
  border-color: #fda4af !important;
}

#creditList > div p.font-bold {
  color: #9f1239 !important;
}

#creditList > div p.text-slate-500 {
  color: #be123c !important;
  opacity: 0.85;
}

#creditList > div p.font-black {
  color: #be123c !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

/* -------- صناديق الملخص الجانبية -------- */
.bg-slate-950\/40,
.bg-slate-950\/60,
.bg-slate-900\/60 {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}

/* -------- الطباعة العامة -------- */
h1          { font-size: 1.1rem  !important; font-weight: 900 !important; color: #0f172a !important; }
h2          { font-size: 1rem    !important; font-weight: 900 !important; color: #0f172a !important; }
h3, h4      { font-size: 0.85rem !important; font-weight: 700 !important; color: #1e293b !important; }
p, span, label, td, th { font-size: 11px !important; color: #475569 !important; }

/* -------- الهوية اللونية (أصفر دافئ للأسعار والأزرار النشطة) -------- */
.text-amber-500,
.text-amber-400 { color: #d97706 !important; }

.bg-amber-500 {
  background-color: #fbbf24 !important;
  color: #0f172a !important;
}
.bg-amber-500:hover { background-color: #f59e0b !important; }

/* -------- أزرار الأقسام -------- */
.category-btn            { color: #64748b !important; }
.category-btn:hover      { background-color: #f1f5f9 !important; color: #0f172a !important; }

/* -------- أزرار الكمية (+ / -) -------- */
button.w-7.h-7 {
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #e2e8f0 !important;
}
button.w-7.h-7:hover { background-color: #e2e8f0 !important; }
span.w-10             { color: #0f172a !important; font-size: 11px !important; }

/* -------- شارة عدد الطلبات -------- */
#orderCount,
#ordersCountBadge {
  background-color: #f0fdf4 !important;
  color: #16a34a !important;
  border: 1px solid #bbf7d0 !important;
  font-weight: 900 !important;
  font-size: 11px !important;
  padding: 2px 8px !important;
}

/* -------- زر إغلاق لوحة الإدارة -------- */
#sectionAdminDashboard button[onclick="toggleAdminView()"] {
  background-color: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #bae6fd !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  transition: all 0.2s ease !important;
}
#sectionAdminDashboard button[onclick="toggleAdminView()"]:hover {
  background-color: #bae6fd !important;
  color: #0c4a6e !important;
}

/* -------- شارة "مفتوح" بجانب زر الإدارة -------- */
#btnToggleAdmin span {
  background-color: #f0fdf4 !important;
  color: #16a34a !important;
  border: 1px solid #bbf7d0 !important;
  font-weight: 700 !important;
}

/* -------- إخفاء شريط التمرير -------- */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* -------- حركة تلاشي ناعمة عند تبديل القسم -------- */
#catalogGrid,
#sectionAdminDashboard {
  animation: smoothViewFade 0.3s ease-out forwards;
}
@keyframes smoothViewFade {
  from { opacity: 0; transform: translateY(3px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* -------- صندوق التنبيهات المنبثق (Toast) -------- */
#toastNotification {
  pointer-events: none;
  transform: translate(-50%, -100px);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.3s ease;
}
#toastNotification.show {
  transform: translate(-50%, 24px);
  opacity: 1;
  pointer-events: auto;
}