/* Add custom CSS styles below */ 
/* 1. توسيط عنوان قسم المنتجات وجعله عريضاً */
.s-slider-block__title {
    justify-content: center !important; /* لتوسيط المحتوى */
    text-align: center !important;
    margin-bottom: 30px !important;
}

.s-slider-block__title h2 {
    font-weight: 800 !important; /* خط بولد عريض */
    font-size: 28px !important;
    color: #0f172a !important; /* لون كحلي غامق وقور */
}

/* 2. إضافة بوردر ملون ومحدد حول كارد المنتج */
.s-products-slider-card {
    border: 1px solid blue !important; /* بوردر خفيف افتراضي */
    border-radius: 16px !important; /* زوايا منحنية متناسقة */
    transition: all 0.3s ease-in-out !important;
    overflow: hidden;
}

/* 3. تغيير لون البوردر عند مرور الماوس (تفاعل) */
.s-products-slider-card:hover {
    border-color: #2563eb !important; /* بوردر أزرق عند الهوفر */
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.1) !important; /* ظل أزرق خفيف */
    transform: translateY(-5px) !important;
}

-------------------------------------
الفوتر
------------------------------


/* تخصيص خلفية الفوتر - سفتي دوم */
.store-footer,
.store-footer__inner{
    background-color: #0d1b2e !important; /* لون كحلي غامق فخم بدلاً من الأسود */
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important; /* خط بسيط جداً في الأعلى للفصل */
}

/* لضمان تناسق ألوان النصوص والروابط داخل الفوتر */
.store-footer, 
.store-footer__inner, 
.store-footer p, 
.store-footer a {
    color: rgba(255, 255, 255, 0.8) !important; /* لون نص أبيض ناعم مريح للعين */
}

/* تغيير لون الروابط عند الهوفر ليتماشى مع هوية البراند */
.store-footer a:hover {
    color: #c41e3a !important; /* اللون الأحمر الخاص بـ سيفتي دوم */
}