/* Add custom CSS styles below */ 
/* ===================================================
   تحسينات عامة على خطوط ونصوص المتجر
=================================================== */
/* ===================================================
   تعريف الألوان الرئيسية لمتجر بوكيت
=================================================== */
:root {
    --pocket-primary: #E5B3B8;    /* الوردي الفاتح */
    --pocket-secondary: #3E2021;  /* البني الداكن */
    --pocket-bg-light: #FCF8F8;   /* لون الخلفية المريح */
    --pocket-white: #FFFFFF;      /* الأبيض النقي للبطاقات */
}



/* ===================================================
   تنسيق بطاقات المنتجات (النعومة والجاذبية)
=================================================== */
.s-product-card-entry {
    background-color: #ffffff;
    border: 1px solid #f1f1f1 !important;
    border-radius: 16px !important; /* زيادة استدارة الحواف */
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* تأثير عند تمرير الماوس فوق بطاقة المنتج */
.s-product-card-entry:hover {
    transform: translateY(-7px) !important; /* رفع البطاقة لأعلى بلطف */
    box-shadow: 0 15px 30px rgba(103, 40, 98, 0.08) !important; /* ظل خفيف بلون المتجر الأساسي */
    border-color: transparent !important;
}

/* ===================================================
   تنسيق الأزرار (أضف للسلة وغيرها)
=================================================== */
.s-button-btn, .s-button-element {
    border-radius: 50px !important; /* جعل الأزرار بيضاوية تماماً */
    font-weight: bold !important;
    transition: all 0.3s ease-in-out !important;
}

/* تأثير التمرير على الأزرار */
.s-button-btn:hover {
    transform: scale(1.03); /* تكبير الزر بشكل غير ملحوظ لإعطاء شعور بالتفاعل */
    box-shadow: 0 8px 20px rgba(103, 40, 98, 0.2) !important;
}


/* ===================================================
   تنسيق دوائر التصنيفات وإزالة المربع المحيط بها
=================================================== */

/* استهداف حاوية التصنيف بالكامل لجعلها شفافة */
.slide--cat-entry {
    background-color: transparent !important; /* إزالة لون الخلفية وجعلها شفافة */
    border: none !important; /* إزالة أي حدود قاسية */
    box-shadow: none !important; /* إزالة الظلال التي تعطي إيحاء المربع */
    padding: 10px 0 !important; /* ترتيب المسافات من الأعلى والأسفل */
    transition: all 0.3s ease-in-out !important; /* حركة ناعمة */
}

/* التأكد من أن الصورة نفسها شفافة الخلفية ودائرية */
.slide--cat-entry img {
    background-color: transparent !important;
    border: none !important;
    transition: transform 0.3s ease !important; /* تجهيز الصورة للحركة */
    /* width: 80px !important; يمكنك تفعيل هذا السطر إذا أردت تكبير الأيقونات قليلاً */
    /* height: 80px !important; */
}

/* إضافة تأثير جميل وبسيط عند تمرير الماوس على التصنيف */
.slide--cat-entry:hover img {
    transform: translateY(-5px); /* رفع الأيقونة للأعلى قليلاً للتفاعل */
}

/* تنسيق بسيط لنص التصنيف (مثل: أحبك، مبروك التخرج) */
.slide--cat-entry h2 {
    color: var(--pocket-secondary) !important; /* استخدام اللون البني الداكن الذي حددناه سابقاً */
    font-weight: bold !important;
    margin-top: 8px !important;
}
.s-slider-block__title-right h2{
  font-size: 2rem
}