.stat-bars__bar {
    background-color: var(--white);
    border: 2px solid transparent;
    border-radius: 20px;
}
.stat-bars__bar[data-bar-color='gradient'] {
    border-color: var(--black);
}
.stat-bars__bar[data-bar-color='dark-grey'] {
    border-color: var(--dark-grey);
}
.stat-bars__bar-fill {
    width: 0;
    border-radius: 20px;
}
.stat-bars--animate .stat-bars__bar-fill,
.swiper-slide--animated .stat-bars__bar-fill {
    width: 100%;
    transition: width 4s ease;
}
[data-bar-color='gradient'] .stat-bars__bar-fill {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        90deg,
        #fad506 0%,
        #da0083 81.46%,
        #a91bb7 100%
    );
}
[data-bar-color='dark-grey'] .stat-bars__bar-fill {
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background-color: var(--light-grey);
    border: 2px solid var(--dark-grey);
}
.stat-bars--animate [data-bar-color='dark-grey'] .stat-bars__bar-fill {
    transition-duration: 20s;
    transition-delay: 500ms;
    transition-delay: 3s;
}
.swiper-slide--animated [data-bar-color='dark-grey'] .stat-bars__bar-fill {
    transition-duration: 10s;
}
.stat-bars__bar[data-bar-color='gradient'] .stat-bars__bar-value * {
    font-weight: bold;
}
.stat-bars__bar[data-bar-value-color='light'] .stat-bars__bar-value * {
    color: var(--white);
}
.stat-bars__bar-bubble {
    color: var(--white);
    top: -25px;
    left: 40px;
    border-radius: 64px 64px 64px 0;
    font-size: 16px;
    line-height: 18px;
}
.stat-bars__bar-bubble strong {
    font-size: 18px;
}
.stat-bars__swiper-pagination.swiper-pagination-fraction,
.stat-bars__swiper-pagination.swiper-pagination-custom,
.stat-bars__swiper-pagination.swiper-horizontal > .swiper-pagination-bullets,
.stat-bars__swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
    left: unset;
    bottom: unset;
    width: auto;
    column-gap: 14px;
}
.swiper-pagination-horizontal.swiper-pagination-bullets
    button.stat-bars__swiper-pagination-bullet {
    height: 14px;
    width: 14px;
    margin: 0;
    background-color: var(--grey);
    opacity: 1;
}
button.stat-bars__swiper-pagination-bullet:hover,
button.stat-bars__swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--yellow);
}
