/* Add custom CSS styles /* إضافة إطار بنفسجي لبطاقات المنتجات في سلة */
.product-card {
    border: 2px solid #8e44ad !important; /* سمك وسط ولون بنفسجي */
    border-radius: 15px !important; /* لضمان انحناء الحواف */
    overflow: hidden; 
    transition: 0.3s; /* لإضافة نعومة عند التفاعل */
}

/* اختياري: إضافة ظل خفيف عند مرور الماوس */
.product-card:hover {
    box-shadow: 0 4px 15px rgba(142, 68, 173, 0.3);
    transform: translateY(-5px);
}

    100% {
        background-position: 0% 50%;
    }

/* --- إعداد مسرح العمليات (الفوتر) --- */
footer, .s-footer, body > footer {
    position: relative !important;
    background-color: #120524 !important; /* لون السماء الليلية الغامق */
    overflow: hidden !important;
    z-index: 1 !important;
    border-top: 1px solid rgba(142, 68, 173, 0.3) !important;
    background-image: linear-gradient(to bottom, #120524 0%, #290a42 100%) !important;
}

/* --- الطبقة الأولى: نجوم وأجواء ضبابية (مدمجة) --- */
footer::before, .s-footer::before {
    content: "" !important;
    position: absolute !important;
    top: 0; left: 0; width: 100%; height: 100%;
    /* كود SVG مباشر لنجوم وأجواء خفيفة لا ينحذف أبداً */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Ccircle cx='20' cy='20' r='1' fill='%23fff' opacity='0.4'/%3E%3Ccircle cx='150' cy='80' r='1.5' fill='%23fff' opacity='0.2'/%3E%3Cpath d='M100,100 Q105,90 110,100 Q115,110 105,115 Z' fill='%23ffffff' opacity='0.05'/%3E%3C/svg%3E") !important; 
    background-size: 200px 200px !important;
    z-index: -1 !important;
    animation: ghostsFloat 40s linear infinite !important;
}

/* --- الطبقة الثانية: مشهد المقبرة والقلعة المسكونة (مدمج) --- */
footer::after, .s-footer::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0; left: 0; width: 200%; height: 100%;
    /* رسمة SVG مدمجة لمدينة مسكونة باللون الأسود البنفسجي */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 200' preserveAspectRatio='none'%3E%3Cpath fill='%230a0216' d='M0,200 V120 Q50,140 100,110 T200,130 T300,90 T400,140 T500,100 T600,150 T700,110 T800,160 T900,120 T1000,150 V200 Z'/%3E%3Cpath fill='%2305010a' d='M0,200 V150 Q60,170 120,130 T240,160 T360,110 T480,170 T600,120 T720,180 T840,140 T960,170 V200 Z'/%3E%3Crect x='150' y='100' width='30' height='100' fill='%2305010a' rx='15'/%3E%3Crect x='450' y='120' width='25' height='80' fill='%2305010a' rx='10'/%3E%3Crect x='750' y='90' width='40' height='110' fill='%2305010a' rx='20'/%3E%3Cpolygon points='850,150 850,80 830,80 860,40 890,80 870,80 870,150' fill='%2305010a'/%3E%3Cpolygon points='250,160 250,100 235,100 255,70 275,100 260,100 260,160' fill='%230a0216'/%3E%3C/svg%3E") !important;
    background-repeat: repeat-x !important;
    background-position: bottom left !important;
    background-size: 50% 100% !important; 
    z-index: -1 !important;
    animation: sceneScroll 25s linear infinite !important;
}

/* --- تنظيف الطبقات لثيم سيليا --- */
footer *, .s-footer *, .footer-inner, .footer-widgets, .footer-copyright {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* --- تنسيق النصوص لتبدو واضحة كالقمر --- */
footer p, footer a, footer span, footer h3, footer i, 
.s-footer h1, .s-footer h2, .s-footer h3, .s-footer li {
    color: #ffffff !important;
    text-shadow: 0 2px 6px rgba(0,0,0,1) !important; /* ظل أسود قوي جداً لضمان القراءة */
    position: relative !important;
    z-index: 10 !important;
}

/* لون أيقونات التواصل */
.social-icons a i { 
    color: #ffffff !important; 
    border-color: #ffffff !important; 
}

/* --- تعريف حركة المشي والطيران --- */
@keyframes sceneScroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

@keyframes ghostsFloat {
    from { background-position: 0 0; }
    to { background-position: 200px -200px; }
}