.our-shops-widget .city-info {
    text-align: center;
}

.our-shops-widget .slider-cities.swiper {
    padding-bottom: 50px !important;
    height: 350px;
}

.our-shops-widget .swiper-viewport {
    border: 0 !important;
    box-shadow: none !important;
}

.our-shops-widget .slider-cities .swiper-slide {
    padding-left: 10px;
    padding-right: 10px;
    overflow-y: auto;
}

.our-shops-widget .city-tabs {
    margin-bottom: 10px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.our-shops-widget .city-tab {
    border: 1px solid #000;
    padding: 5px 15px;
    background: white;
    cursor: pointer;
}

.our-shops-widget .city-tab.active {
    background: #000;
    color: white;
}

/* Позиціонування стрілок/пагінації - раніше йшло з opencart.css (стара jQuery-версія
   Swiper), яку прибрали в v1.1 разом з бібліотекою. Сучасний бандл сам задає ширину/
   висоту/вертикальне центрування кнопок (--swiper-navigation-size, z-index:10) - тут
   лише те, чого бандл НЕ знає: .swiper-pager - наша ВЛАСНА обгортка (не клас Swiper),
   без position:absolute вона лишається в звичайному потоці документа й "випадає" з
   350px-вікна слайдера (overflow:hidden у бандла) - звідси й погане клікання, кнопки
   малювались не там, де реально перебували в DOM. */
.our-shops-widget .swiper-pager {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    pointer-events: none;
}

.our-shops-widget .swiper-button-prev,
.our-shops-widget .swiper-button-next {
    opacity: 0.7;
    pointer-events: auto;
    transition: opacity .3s ease, left .3s ease, right .3s ease;
}

.our-shops-widget .swiper-button-prev { left: 10px; }
.our-shops-widget .swiper-button-next { right: 10px; }

@media (min-width: 768px) {
    .our-shops-widget .swiper-button-prev { opacity: 0; left: -20px; }
    .our-shops-widget .swiper-button-next { opacity: 0; right: -20px; }
    .our-shops-widget .swiper-viewport:hover .swiper-button-prev { opacity: 0.7; left: 10px; }
    .our-shops-widget .swiper-viewport:hover .swiper-button-next { opacity: 0.7; right: 10px; }
}

.our-shops-widget .swiper-pagination {
    bottom: -40px;
}

.our-shops-widget .swiper-pagination-bullet {
    background: rgba(0, 0, 0, 0.5);
    opacity: 1;
}

.our-shops-widget .swiper-pagination-bullet-active {
    background: rgba(0, 0, 0, 0.9);
}
