/* =========================================================================
   MASTER CUSTOM STYLE SHEET - AL-SAFFA E-COMMERCE PLATFORM
   ========================================================================= */

/* تحسين الخط العام وتجربة التصفح */
body {
    font-family: 'Cairo', sans-serif !important;
    background-color: #F8FAFC;
    transition: background-color 0.3s ease;
}

/* تأثير الزجاج المتطور (Glassmorphism Premium) */
.glassmorphism {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 8px 32px 0 rgba(15, 82, 186, 0.04) !important;
}

/* تحسينات بطاقات المنتجات وحركات الـ Hover */
.group {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.group:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -15px rgba(15, 82, 186, 0.12);
}

/* محاكي عرض الصور للمنتجات عبر الخلفيات الذكية (Product Images Injection) */
.bg-slate-50.rounded-xl.h-44 {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    transition: transform 0.5s ease;
}

.group:hover .bg-slate-50.rounded-xl.h-44 {
    transform: scale(1.03);
}

/* إخفاء الأيقونة الافتراضية للعلبة عند تحميل الصورة بنجاح */
.bg-slate-50.rounded-xl.h-44 i {
    display: none !important;
}

/* =========================================================================
   حقن روابط صور حقيقية للمنتجات بناءً على معرّف المنتج (ID) أو الترتيب
   ========================================================================= */

/* المنتجات البارزة (Featured) والكتالوج حسب الـ ID المعرف بالـ JavaScript */
/* 1. دوسية الفيزياء */
div[onclick*="101"] .bg-slate-50.rounded-xl.h-44,
#home-featured-products-grid div:nth-child(1) .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1614064641938-3bbee52942c7?auto=format&fit=crop&w=500&q=80') !important;
}

/* 2. آلة حاسبة كاسيو */
div[onclick*="102"] .bg-slate-50.rounded-xl.h-44,
#home-featured-products-grid div:nth-child(2) .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1635070041078-e363dbe005cb?auto=format&fit=crop&w=500&q=80') !important;
}

/* 3. دفتر سلك جامعي */
div[onclick*="103"] .bg-slate-50.rounded-xl.h-44,
#home-featured-products-grid div:nth-child(3) .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1531346878377-a5be20888e57?auto=format&fit=crop&w=500&q=80') !important;
}

/* 4. بطاقة شحن جو أكاديمي */
div[onclick*="104"] .bg-slate-50.rounded-xl.h-44,
#home-featured-products-grid div:nth-child(4) .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1580894732444-8fecef2271ff?auto=format&fit=crop&w=500&q=80') !important;
}

/* 5. دوسية الكيمياء */
div[onclick*="105"] .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1532187863486-abf9d39d6618?auto=format&fit=crop&w=500&q=80') !important;
}

/* 6. علبة ألوان فابر كاستل */
div[onclick*="106"] .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1513364776144-60967b0f800f?auto=format&fit=crop&w=500&q=80') !important;
}

/* 7. حقيبة ظهر مقاومة للماء */
div[onclick*="107"] .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1553062407-98eeb64c6a62?auto=format&fit=crop&w=500&q=80') !important;
}

/* 8. علبة أدوات هندسية */
div[onclick*="108"] .bg-slate-50.rounded-xl.h-44 {
    background-image: url('https://images.unsplash.com/photo-1509062522246-3755977927d7?auto=format&fit=crop&w=500&q=80') !important;
}

/* صورة قسم تفاصيل المنتج الكبيرة */
#product-detail-injection-wrapper .bg-slate-50.rounded-2xl.h-80 {
    background-image: url('https://images.unsplash.com/photo-1456513080510-7bf3a84b82f8?auto=format&fit=crop&w=800&q=80') !important;
    background-size: cover;
    background-position: center;
}
#product-detail-injection-wrapper .bg-slate-50.rounded-2xl.h-80 i {
    display: none !important;
}

/* تخصيص شكل أزرار الشراء والفلاتر لتتناسب مع روح الهوية الفخمة */
.bg-brand-blue {
    background-color: #0F52BA !important;
    box-shadow: 0 4px 12px rgba(15, 82, 186, 0.2);
}
.bg-brand-blue:hover {
    background-color: #0A3982 !important;
}

/* تخصيص مؤشر التمرير (Scrollbar) ليصبح أنعم */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #F1F5F9;
}
::-webkit-scrollbar-thumb {
    background: #CBD5E1;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94A3B8;
}