/* تنظیمات اصلی اسلایدر */
.testimonials-container {
    position: relative;
    min-height: 600px;
    margin: 0 auto;
    max-width: 1200px;
}

.testimonials {
    position: absolute;
    left: 40%;
    top: 25%;
    transition: 0.5s ease;
    width: 250px; /* کوچک‌تر شدن تصاویر جلویی */
    text-align: center;
}

/* تنظیم تصویر پروفایل */
.elementor-image-box-img {
    position: relative;
    width: 100%;
    aspect-ratio: 1/1; /* پیشفرض مربع */
}

.elementor-image-box-img img {
    width: 100%;
    height: 100%;
    object-fit: var(--image-fit, cover); /* در صورت عدم تعریف متغیر از cover استفاده شود */
    object-position: var(--image-position, center);
    border-radius: 15px !important;
    border: solid 1px #ffffff26 !important;
}

/* تنظیم باکس متن روی عکس (قالب پایه مشترک) */
.elementor-image-box-content {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    width: 85%;
    text-align: center;
    color: #fff;
    border: solid 1px #ffffff26;
}

/* تنظیمات اختصاصی باکس محصولات/پست‌ها */
.product-post-slider-content {
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
    padding: 15px;
    border-radius: 15px;
}

/* تنظیمات اختصاصی باکس نظرات */
.testimonial-slider-content {
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
    padding: 15px;
    border-radius: 15px;
}

/* استایل آیدی اینستاگرام */
.instagram {
    font-family: "Peyda";
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 5px;
    color: #fff;
    font-size: 14px;
}

.instagram i {
    font-size: 18px;
}

/* تنظیم دکمه‌های کنترلی اسلایدر */
.slider-controls {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    z-index: 10;
}

.next-btn-te, 
.prev-btn-te {
    cursor: pointer;
    font-size: 19px;
    color: #331080;
    background: rgb(255, 255, 255);
    padding: 8px 14px 6px;
    border-radius: 23px;
}

/* تنظیم موقعیت‌های اسلاید‌ها */
.pos_1 { 
    z-index: 5; 
    transform: scale(1.05); /* کاهش اندازه عکس اصلی */
}
.pos_2 { 
    z-index: 4; 
    filter: blur(2px); 
    transform: scale(0.75) translate(300px, -20px);
}
.pos_9 { 
    z-index: 4; 
    filter: blur(2px); 
    transform: scale(0.75) translate(-300px, -20px);
}
.pos_3 { 
    z-index: 3; 
    filter: blur(6px); 
    transform: scale(0.6) translate(650px, -50px);
}
.pos_8 { 
    z-index: 3; 
    filter: blur(6px); 
    transform: scale(0.6) translate(-650px, -50px);
}
.pos_4 { 
    z-index: 2; 
    filter: blur(8px); 
    transform: scale(0.5) translate(600px, -90px);
}
.pos_7 { 
    z-index: 2; 
    filter: blur(8px); 
    transform: scale(0.5) translate(-600px, -90px);
}
.pos_5 { 
    z-index: 1; 
    filter: blur(10px); 
    transform: scale(0.4) translate(250px, -100px);
}
.pos_6 { 
    z-index: 1; 
    filter: blur(10px); 
    transform: scale(0.4) translate(-250px, -100px);
}

/* استایل‌های اضافی برای ویجت‌های جدید */
.item-title {
    font-size: 18px;
    margin-bottom: 10px;
    color: #fff;
}

.item-price {
    font-size: 16px;
    color: #4CAF50;
    font-weight: bold;
}

/* ریسپانسیو برای موبایل */
@media (max-width: 767px) {
    .testimonials {
        left: 25%;
        top: 20%;
        width: 220px; /* کوچک‌تر کردن تصویر در موبایل */
    }

    .elementor-image-box-content {
        width: 90%;
        font-size: 14px;
        padding: 10px;
    }
    
    .next-btn-te, 
    .prev-btn-te {
        margin-top: 20%;
    }
    
    .item-title { 
        font-size: 16px; 
    }
    .item-price { 
        font-size: 14px; 
    }
}

/* ریسپانسیو برای تبلت */
@media (min-width: 768px) and (max-width: 1024px) {
    .testimonials {
        left: 35%;
        top: 15%;
        width: 250px;
    }
    
    .next-btn-te, 
    .prev-btn-te {
        margin-top: 10%;
    }
}

/* حالت‌های مختلف نمایش تصویر */
.elementor-image-box-img img[style*="object-fit: cover"] {
    object-fit: cover;
}

.elementor-image-box-img img[style*="object-fit: contain"] {
    object-fit: contain;
}

.elementor-image-box-img img[style*="object-fit: fill"] {
    object-fit: fill;
}
