.previous-slide-control,
.next-slide-control {
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

    .previous-slide-control::after,
    .next-slide-control::after {
        --shadow-width: 2rem;
        --shadow-spread: 2rem;
        --shadow-color: rgba(255, 255, 255, 0);
        content: '';
        position: absolute;
        height: 100%;
        width: var(--shadow-width);
        box-shadow: var(--shadow-width) 0 var(--shadow-spread) var(--shadow-spread) var(--shadow-color);
        transition: opacity 150ms ease-in-out;
    }

    .next-slide-control::after {
        box-shadow: calc(var(--shadow-width) * -1) 0 var(--shadow-spread) var(--shadow-spread) var(--shadow-color);
    }

    .previous-slide-control::after {
        left: calc(var(--shadow-width) * -1);
    }

    .previous-slide-control:has(.swiper-button-disabled)::after,
    .next-slide-control:has(.swiper-button-disabled)::after {
        opacity: 0;
    }

    .next-slide-control::after {
        right: calc(var(--shadow-width) * -1);
    }

.previous-slide-control {
    left: 5px;
}

.next-slide-control {
    right: 5px;
}

.button-previous-slide,
.button-next-slide {
    position: relative;
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    background-color: hsl(199 88.7% 48.4%);
    color: rgb(255, 255, 255);
    z-index: 10;
    box-shadow: rgba(3, 34, 48, 0.15) 0px 4px 12px;
    transition: all 150ms ease-in-out;
}

    .button-previous-slide:hover,
    .button-next-slide:hover {
        background-color: hsl(199 88.7% 55.4%);
    }

    .button-previous-slide:active,
    .button-next-slide:active {
        background-color: hsl(199 88.7% 40.4%);
        transform: translateY(4px);
        box-shadow: rgba(0, 0, 0, 0) 0px 4px 12px;
    }



    .button-previous-slide.swiper-button-disabled,
    .button-next-slide.swiper-button-disabled {
        opacity: 0;
    }

.swiper-pagination .swiper-pagination-bullet{
    transition: all 150ms ease-in-out;
}

.swiper-pagination .swiper-pagination-bullet-active {
    transform: scale(1.5);
    box-shadow: rgba(0, 0, 0, 0.15) 0px 4px 12px;
}

.swiper-slide{
    height: auto;
}

    .swiper-slide .see-all-slide {
        position: relative;
        display: flex;
        width: 100%;
        height: 100%;
        background-color: hsl(240 100% 96.9%);
        border: 1px solid hsl(240 100% 93.9%);
        border-radius: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        z-index: 10;
    }
        .swiper-slide .see-all-slide::after {
            content: '';
            position: absolute;
            width: 95%;
            height: 95%;
            left: 2.5%;
            top: 2.5%;
            background-color: rgb(254, 254, 255, 0.25);
            border-top-left-radius: 1rem;
            border-top-right-radius: 100%;
            border-bottom-left-radius: 1rem;
            border-bottom-right-radius: 1rem;
        }

        .swiper-slide .see-all-slide a {
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 1rem 2rem;
            background-color: hsl(199 88.7% 48.4%);
            color: rgb(255, 255, 255);
            border-radius: 9999px;
            text-decoration: none;
            box-shadow: rgba(3, 34, 48, 0.15) 0px 4px 12px;
            z-index: 1;
            transition: all 150ms ease-in-out;
        }

        .swiper-slide .see-all-slide:hover a {
            background-color: hsl(199 88.7% 55.4%);
        }

            .swiper-slide .see-all-slide a:active {
                background-color: #397eff;
                transform: translateY(4px);
                box-shadow: rgba(0, 0, 20, 0) 0px 4px 12px;
            }

        .swiper-slide .see-all-slide .circle {
            position: absolute;
            border-radius: 9999px;
            border: 2px solid #e0e0ff;
        }