.carousel-header--ready {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 32px;
    width: 100%;
}

.carousel-header--ready + * {
    margin-block-start: 32px !important;
}

.carousel-header__heading {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none !important;
    margin-inline: 0 !important;
}

.carousel-header__heading > :last-child {
    margin-bottom: 0;
}

.carousel-header__controls {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    max-width: none !important;
    margin-inline: 0 !important;
}

.carousel-header .cb-button-prev,
.carousel-header .cb-button-next {
    position: static;
    inset: auto;
    display: flex;
    flex: 0 0 52px;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin: 0;
    padding: 0;
    color: white;
    background-color: #133751;
    border: 0;
    border-radius: 50%;
    transform: none;
    cursor: pointer;
    transition: opacity 0.2s ease, background-color 0.2s ease;
}

.carousel-header .cb-button-prev::after,
.carousel-header .cb-button-next::after {
    content: '';
    display: block;
    width: 24px;
    height: 9px;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg%20width='24'%20height='9'%20viewBox='0%200%2024%209'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M16.5579%208.97621C16.7846%208.38688%2017.0339%207.84288%2017.3059%207.34421C17.5779%206.82288%2017.8839%206.33554%2018.2239%205.88221H-9.74536e-05V3.09421H18.2239C17.9066%202.64088%2017.6119%202.16488%2017.3399%201.66621C17.0679%201.14488%2016.8186%200.589544%2016.5919%200.000209689H19.1759C20.5812%201.65488%2022.1226%202.91288%2023.7999%203.77421V5.23621C22.1226%206.05221%2020.5812%207.29888%2019.1759%208.97621H16.5579Z'%20fill='white'/%3E%3C/svg%3E");
}

.carousel-header .cb-button-prev::after {
    transform: rotate(180deg);
}

.carousel-header .cb-button-prev.swiper-button-disabled,
.carousel-header .cb-button-next.swiper-button-disabled {
    opacity: 0.2;
    cursor: default;
    pointer-events: none;
}

.carousel-header .cb-button-prev:focus-visible,
.carousel-header .cb-button-next:focus-visible {
    outline: 2px solid var(--wp--preset--color--primary);
    outline-offset: 3px;
}

@media (max-width: 768px) {
    .carousel-header--ready {
        gap: 16px;
    }
}