/* Shared navigation buttons for site sliders. */
.slider-nav-buttons > .slider-nav-arrow {
    position: absolute;
    top: 50%;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    transform: translateY(-50%);
    border: 1px solid var(--primary-border, #a823c0);
    border-radius: 50%;
    background: var(--primary-border, #a823c0);
    color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
    appearance: none;
    cursor: pointer;
    touch-action: manipulation;
}

.slider-nav-buttons > .swiper-button-prev {
    left: 6px;
    right: auto;
}

.slider-nav-buttons > .swiper-button-next {
    right: 6px;
    left: auto;
}

/* Draw chevrons without the swiper-icons font. */
.slider-nav-buttons > .slider-nav-arrow::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    font-family: inherit;
    font-size: 0;
    line-height: 1;
}

.slider-nav-buttons > .swiper-button-prev::after {
    transform: translateX(2px) rotate(135deg);
}

.slider-nav-buttons > .swiper-button-next::after {
    transform: translateX(-2px) rotate(-45deg);
}

.slider-nav-buttons > .slider-nav-arrow:focus-visible {
    outline: 3px solid #9c27b0;
    outline-offset: 2px;
}

@media (hover: hover) {
    .slider-nav-buttons > .slider-nav-arrow:hover {
        background: var(--purple-600, #852196);
        border-color: var(--purple-600, #852196);
    }
}

.slider-nav-buttons > .slider-nav-arrow:disabled,
.slider-nav-buttons > .slider-nav-arrow.swiper-button-disabled {
    opacity: .35;
    cursor: default;
    pointer-events: none;
}

.slider-nav-buttons:not(.swiper-initialized) > .slider-nav-arrow,
.slider-nav-buttons > .slider-nav-arrow.swiper-button-lock {
    display: none;
}
