.breakdance-swiper-wrapper {
--swiper-navigation-size: 20px;
--swiper-pagination-color: #2563eb;
--swiper-theme-color: #2563eb;
--swiper-padding-h: 42px;
position: relative;
padding: 0 var(--swiper-padding-h);
width: 100%;
}
.swiper {
overflow: hidden;
width: 100%;
}
.swiper-button-prev > svg,
.swiper-button-next > svg {
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
width: 100%;
}
.swiper-button-disabled {
opacity: 0.35;
cursor: auto;
pointer-events: none;
}
.swiper-button-prev,
.swiper-button-next {
position: absolute;
top: 50%;
width: var(--swiper-navigation-size);
height: var(--swiper-navigation-size);
z-index: 10;
cursor: pointer;
align-items: center;
justify-content: center;
}
.swiper-button-prev {
left: 12px;
}
.swiper-button-next {
right: 12px;
} .swiper-button-prev .swiper-pagination-bullet {
display: none;
}
.swiper-pagination {
margin-top: 8px;
position: initial;
}
.swiper-pagination,
.swiper-pagination-bullet {
color: #2563eb;
}
.swiper-pagination-bullet:not(.swiper-pagination-bullet-active):hover {
transition: opacity 0.2s ease-in;
opacity: 0.4;
}
.swiper-pagination-bullet {
background-color: #2563eb;
margin: 0 4px !important;
border-radius: 100%;
bottom: initial;
}
.breakdance-swiper-wrapper .swiper-pagination-progressbar {
background: rgba(0, 0, 0, 0.25);  width: calc(100% - (var(--swiper-padding-h) * 2));
left: var(--swiper-padding-h);
}