.evo-buttons-carousel {
    --evo-items-per-view: 2;
    --evo-slides-to-scroll: 1;
    --evo-gap: 24px;
    position: relative;
    max-width: 100%;
    box-sizing: border-box;
}

.evo-buttons-carousel,
.evo-buttons-carousel * {
    box-sizing: border-box;
}

.evo-buttons-carousel__inner {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.evo-buttons-carousel__viewport {
    width: 100%;
    overflow: hidden;
}

.evo-buttons-carousel__track {
    display: flex;
    align-items: stretch;
    gap: var(--evo-gap);
    will-change: transform;
    transform: translate3d(0, 0, 0);
}

.evo-buttons-carousel__slide {
    flex: 0 0 calc((100% - (var(--evo-gap) * (var(--evo-items-per-view) - 1))) / var(--evo-items-per-view));
    min-width: 0;
}

.evo-buttons-carousel__button {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
    line-height: 1.2;
    transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, transform 0.25s ease-in-out;
}

.evo-buttons-carousel__button:hover,
.evo-buttons-carousel__button:focus {
    text-decoration: none;
    outline: none;
}

.evo-buttons-carousel__button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.evo-buttons-carousel__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    transition: color 0.25s ease-in-out, fill 0.25s ease-in-out;
}

.evo-buttons-carousel__icon svg,
.evo-buttons-carousel__icon i {
    display: block;
}

.evo-buttons-carousel__text {
    display: inline-block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.evo-buttons-carousel--icon-right .evo-buttons-carousel__button {
    flex-direction: row-reverse;
}

.evo-buttons-carousel__arrows {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
    z-index: 3;
}

.evo-buttons-carousel__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    padding: 0;
    cursor: pointer;
    pointer-events: auto;
    transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.evo-buttons-carousel__arrow:hover {
    transform: scale(1.05);
}

.evo-buttons-carousel__arrow:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.evo-buttons-carousel-arrows-inside .evo-buttons-carousel__arrow--prev {
    margin-left: 4px;
}

.evo-buttons-carousel-arrows-inside .evo-buttons-carousel__arrow--next {
    margin-right: 4px;
}

.evo-buttons-carousel-arrows-outside .evo-buttons-carousel__arrow--prev {
    transform: translateX(-115%);
}

.evo-buttons-carousel-arrows-outside .evo-buttons-carousel__arrow--next {
    transform: translateX(115%);
}

.evo-buttons-carousel-arrows-outside .evo-buttons-carousel__arrow:hover {
    transform: translateX(var(--evo-arrow-outside-x, 0)) scale(1.05);
}

.evo-buttons-carousel-arrows-outside .evo-buttons-carousel__arrow--prev:hover {
    --evo-arrow-outside-x: -115%;
}

.evo-buttons-carousel-arrows-outside .evo-buttons-carousel__arrow--next:hover {
    --evo-arrow-outside-x: 115%;
}

.evo-buttons-carousel__progress {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 999px;
}

.evo-buttons-carousel__progress-fill {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0%;
    border-radius: inherit;
    transition: width 0.35s ease-in-out;
}

.evo-buttons-carousel.is-continuous .evo-buttons-carousel__track {
    transition: none !important;
}

.evo-buttons-carousel.is-dragging .evo-buttons-carousel__track {
    transition: none !important;
}
