/* SWIPER BUTTON NAV */
.swiper-nav-btn.floating {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.swiper-nav-btn {
    position: relative;
    width: 3.75rem;
    height: 3.75rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    transition: background-color .2s;
    background-color: var(--gray-400);
}

/* SWIPER BUTTON NAV - UNLOCKED */
.swiper-nav-btn:not(.swiper-button-lock) {
    display: inline-flex;
}

/* SWIPER BUTTON NAV - DISABLED */
.swiper-nav-btn.swiper-button-disabled {
    cursor: not-allowed;
    opacity: .5;
}

/* SWIPER BUTTON NAV - ENABLED */
.swiper-nav-btn:not(.swiper-button-disabled):hover {
    background-color: var(--gray-700);
}

/* SWIPER BUTTON NAV - NEXT */
.swiper-nav-btn.swiper-nav-btn-next.floating {
    right: 0;
}

/* SWIPER BUTTON NAV - PREV */
.swiper-nav-btn.swiper-nav-btn-prev.floating {
    left: 0;
}

.swiper-nav-btn.swiper-nav-btn-white:not(.swiper-button-disabled) {
    background-color: var(--white);
}

.swiper-nav-btn.swiper-nav-btn-white:not(.swiper-button-disabled):hover {
    background-color: var(--gray-700);
}

/* SWIPER BUTTON NAV - ARROW */
.swiper-nav-btn svg {
    height: 1.75rem;
}

.swiper-nav-btn.swiper-nav-btn-next svg {
    transform: rotate(180deg);
}

.swiper-nav-btn:not(.swiper-button-disabled):hover svg path {
    stroke: var(--white);
}