/* Add custom CSS styles below */ 
/* عنوان السلايدر */
.advanced-slider__caption__inner__content__heading {
    color: #ffffff !important;
}

/* وصف السلايدر */
.advanced-slider__caption__inner__content__text {
    color: #ffffff !important;
}
.advanced-slider__caption__inner__content__heading,
.advanced-slider__caption__inner__content__text {
    text-shadow: 0 2px 8px rgba(0,0,0,0.6);
}





/* --- بداية تنسيق قسم التصنيفات catag_ama --- */

/* 1. ضبط حاوية الصورة لتكون دائرية بأبعاد ثابتة تماماً */
.catag_ama .swiper-slide .overflow-hidden {
    /* --- التعديلات الجديدة لتوحيد الأحجام --- */
    width: 150px !important;  /* عرض ثابت للإطار */
    height: 150px !important; /* طول ثابت (مساوي للعرض لتصبح مربع/دائرة) */
    margin: 0 auto;           /* توسيط الدائرة في المنتصف */
    display: flex !important; /* لضمان توسيط الصورة داخل الدائرة */
    justify-content: center;
    align-items: center;
    
    /* --- التنسيقات الجمالية السابقة --- */
    border-radius: 50%; 
    padding: 5px; 
    background: #fff; 
    border: 2px dashed #48cae4; /* أزرق فاتح */
    box-shadow: 0 0 10px rgba(72, 202, 228, 0.2); 
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
    position: relative;
    overflow: hidden !important; /* ضروري لقص أجزاء الصورة الطويلة */
}

/* 2. تحسين مظهر الصورة داخل الدائرة وقص الزوائد */
.catag_ama .swiper-slide img {
    border-radius: 50%; 
    width: 100% !important; /* تأخذ كامل عرض الإطار */
    height: 100% !important; /* تأخذ كامل طول الإطار */
    object-fit: cover !important; /* السحر هنا: يقص الصورة لتملأ الدائرة دون تمطيط */
    object-position: center !important; /* يركز على منتصف الصورة */
    transition: transform 0.5s ease; 
}

/* --- تأثيرات عند تمرير الماوس (Hover Effects) --- */

/* عند الوقوف على العنصر: تغيير الحدود للبرتقالي مع دوران */
.catag_ama .swiper-slide:hover .overflow-hidden {
    border-color: #ff6b00; 
    border-style: solid; 
    box-shadow: 0 0 0 4px rgba(255, 107, 0, 0.1), 0 10px 20px rgba(0,0,0,0.1); 
    transform: translateY(-5px) rotate(5deg); 
}

/* عند الوقوف على العنصر: تكبير الصورة (Zoom In) */
.catag_ama .swiper-slide:hover img {
    transform: scale(1.1);
}

/* 3. تنسيق عنوان التصنيف (h3) */
.catag_ama h3 {
    transition: color 0.3s ease;
    font-weight: bold;
    margin-top: 15px;
}

/* تغيير لون النص عند الهوفر */
.catag_ama .swiper-slide:hover h3 {
    color: #ff6b00 !important; 
}

/* --- نهاية التنسيق --- */