/* استایل‌های بهبود یافته برای Swiper Navigation */
.custom-swiper-button {
    width: 40px !important;
    height: 40px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 50% !important;
    color: #be1515 !important; /* رنگ آیکون‌ها */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 20 !important;
    transition: all 0.3s ease !important;
}

.custom-swiper-button:hover {
    background: white !important;
    color: #a71e1e !important;
    transform: scale(1.05) !important;
    box-shadow: 0 6px 12px -2px rgba(0, 0, 0, 0.15) !important;
}

.custom-swiper-button i {
    font-size: 16px !important;
    margin: 0 !important;
    display: inline-block !important;
    color: inherit !important;
}

/* بازنویسی استایل‌های پیش‌فرض Swiper */
.swiper-button-next::after,
.swiper-button-prev::after {
    display: none !important;
    content: none !important;
}

/* دکمه‌های پیش‌فرض Swiper را مخفی نکن؛ فقط pseudo-elementها را غیر فعال کردیم.
   رنگ را از کلاس custom-swiper-button می‌گیریم. */

/* نمایش صریح آیکون‌ها */
.custom-swiper-button .fas {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}