.slideshow {
    margin: 0 auto; /* Центрує слайдер */

    position: relative; /* Позиціювання для контролю сусідніх елементів */
    background: #F9F1E7;
}

.slideshow .swiper-wrapper {
    overflow: visible; /* Відображення сусідніх елементів */
    margin-left: 100px; /* Зсув для показу лівого елемента */
    margin-right: 0px; /* Зсув для показу правого елемента */
}

.slideshow .swiper-slide {
    width:880px; /* Ширина кожного слайду, щоб залишити місце для сусідів */
    margin: 0 0px; /* Відстань між слайдами */
    transition: transform 0.3s ease; /* Анімація переходу */
}
.swiper-slide {
    transition: transform 0.6s ease, opacity 0.6s ease;
}
.swiper-pagination {
    position: unset;
    text-align: center;
    transition: .3s;
    transform: translate3d(0,0,0);
    z-index: 10;
    height: 70px;
    background: #F5F5F5;
    width: 70%;
    align-items: center;
    display: flex;
    justify-content: end;
  padding-right: 150px;
}

.swiper-pagination2 {
    position: unset;
    text-align: center;
    transition: .3s;
    transform: translate3d(0,0,0);
    z-index: 10;
    height: 70px;
    background: transparent;
    align-items: center;
    display: flex;
    justify-content: start;
}

.slideshow .swiper-buttons {
    display: flex; /* Встановлюємо flex-контейнер для кнопок */
    justify-content: center; /* Центруємо кнопки */
    width: 30%; /* Кнопки займають всю ширину */
    position: unset;
    align-items: center;
    gap: 30px; /* Відстань між кнопками */
    background: #FCF8F3;
}

/* Стилі для кнопок управління */

.swiper-button-next {
    background:#E69E44; /* Змінюємо фон при наведенні */ /* Напівпрозорий фон кнопок */
    color: white; /* Колір тексту або іконок */
    padding: 8px 10px;
    border-radius: 50px; /* Закруглені кути */
    cursor: pointer; /* Вказівник у вигляді руки при наведенні */
    text-align: center; /* Центруємо текст в кнопках */
    position: unset;
    margin-top: unset;
    width: 40px;
    height: 40px;
}
.swiper-button-prev
 {
    background:#E69E44; /* Змінюємо фон при наведенні */ /* Напівпрозорий фон кнопок */
    color: white; /* Колір тексту або іконок */
    padding: 8px 8px;
    border-radius: 50px; /* Закруглені кути */
    cursor: pointer; /* Вказівник у вигляді руки при наведенні */
    text-align: center; /* Центруємо текст в кнопках */
    position: unset;
    margin-top: unset;
    width: 40px;
    height: 40px;
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
    background:#E69E44; /* Змінюємо фон при наведенні */
}
.swiper-pagination-bullet{
 margin-right: 20px;
}

@media (max-width: 767px) {
    .swiper-pagination {
        width: 30%;
        justify-content: start;
        padding-right: 0px;
        padding-left: 15px;
    }
    .slideshow .swiper-buttons {
        width: 70%;
    }


}
.swiper-slide {
    display: flex;
    justify-content: center; /* Центрує зображення по горизонталі */
    align-items: center; /* Центрує зображення по вертикалі */
    text-align: center;
}

.swiper-slide img {
    max-width: 100%; /* Щоб зображення не виходило за межі слайда */
    max-height: 100%; /* Щоб не перевищувало контейнер */
    object-fit: contain; /* Зберігає пропорції */
    width: 100%;
}
.swiper-pagination-bullet-active{
    background: #E69E44;
}
.swiper-pagination-bullet-active:before{
    content: "";
    position: relative;
    display: table;
    width: 20px;
    height: 20px;
    top: -6px;
    left: -6px;
    border: 1px solid #E69E44;
    border-radius: 50px;
}