@keyframes splide-loading{
    0%{
        transform:rotate(0)
    }
    to{
        transform:rotate(1turn)
    }
}
.splide__container{
    position:relative;
    box-sizing:border-box
}
.splide__list{
    margin:0!important;
    padding:0!important;
    width:-webkit-max-content;
    width:max-content;
    will-change:transform
}
.splide.is-active .splide__list{
    display:flex
}
.splide__pagination{
    display:inline-flex;
    align-items:center;
    width:95%;
    flex-wrap:wrap;
    justify-content:center;
    margin:0
}
.splide__pagination li{
    list-style-type:none;
    display:inline-block;
    line-height:1;
    margin:0
}
.splide{
    visibility:hidden
}
.splide,.splide__slide{
    position:relative;
    outline:none
}
.splide__slide{
    box-sizing:border-box;
    list-style-type:none!important;
    margin:0;
    flex-shrink:0
}
.splide__slide img{
    vertical-align:bottom
}
.splide__slider{
    position:relative
}
.splide__spinner{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
    display:inline-block;
    width:20px;
    height:20px;
    border-radius:50%;
    border:2px solid #999;
    animation:splide-loading 1s linear infinite
}
.splide__track{
    position:relative;
    z-index:0;
    overflow:hidden
}
.splide--draggable>.splide__track>.splide__list>.splide__slide{
    -webkit-user-select:none;
    user-select:none
}
.splide--fade>.splide__track>.splide__list{
    display:block
}
.splide--fade>.splide__track>.splide__list>.splide__slide{
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    opacity:0
}
.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{
    position:relative;
    z-index:1;
    opacity:1
}
.splide--rtl{
    direction:rtl
}
.splide--ttb>.splide__track>.splide__list{
    display:block
}
.splide--ttb>.splide__pagination{
    width:auto
}
/* Style for Splide arrows */
.splide__arrow {
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    background: white; /* White background */
    color: #000; /* Black arrow color */
    border-radius: 50%; /* Rounded shape */
    width: 45px; /* Adjust size */
    height: 45px; /* Adjust size */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
}

.splide__arrow:hover {
    background: #f0f0f0; /* Slightly darker on hover */
    color: #333; /* Darker arrow color on hover */
}

.splide__arrow--prev {
    left: 30px;
}

.splide__arrow--next {
    right: 30px;
}

.splide__arrow i {
    font-size: 16px; /* Adjust icon size */
}

/* Optional: Add focus styles for accessibility */
.splide__arrow:focus {
    outline: 2px solid #000; /* Focus outline */
}
.splide__arrow svg{
    width:1.1em;
    height:1.1em;
    @apply fill-primary;
    transition:fill .2s linear;
}
.splide__arrow:hover{
    cursor:pointer
}
.splide__arrow:hover svg{
    @apply fill-primary-700;
}
.splide__arrow:focus{
    outline:none
}
.splide__arrow--prev svg{
    transform:scaleX(-1)
}
.splide__slider>.splide__arrows .splide__arrow--prev{
    left:-2.5em
}
.splide__slider>.splide__arrows .splide__arrow--next{
    right:-2.5em
}
.splide__pagination{
    position:absolute;
    z-index:1;
    bottom:1em;
    left:50%;
    transform:translateX(-50%);
    padding:0
}
.splide__pagination__page{
    display:inline-block;
    width: 7px;
    height:7px;
    background:#fff;
    border-radius:2.5px;
    margin:3px;
    padding:0;
    transition:all .2s linear;
    border:none;
    box-shadow: -1px 0px 20px 0px rgba(0,0,0,0.57);
    -webkit-box-shadow: -1px 0px 20px 0px rgba(0,0,0,0.57);
    -moz-box-shadow: -1px 0px 20px 0px rgba(0,0,0,0.57);
}
.splide__pagination__page.is-active{
    @apply bg-primary;
}
.splide__pagination__page:hover{
    cursor:pointer;
    @apply bg-primary;
}
.splide__pagination__page:focus{
    outline:none
}
.splide__progress__bar{
    width:0;
    height:3px;
    background:#2b2b2b
}
.splide{
    padding:3em
}
.splide__slide{
    border-radius:4px
}
.splide__spinner{
    border:2px solid #2b2b2b;
    border-left-color:transparent
}
.splide--nav>.splide__track>.splide__list>.splide__slide{
    border:3px solid #fff;
    cursor:pointer;
    opacity:.7;
    border-radius:4px
}
.splide--nav>.splide__track>.splide__list>.splide__slide.is-active{
    border-color:#2b2b2b;
    opacity:1
}
.splide--nav>.splide__track>.splide__list>.splide__slide:focus{
    outline:none
}
.splide--rtl>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev{
    right:1em;
    left:auto
}
.splide--rtl>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev svg{
    transform:scaleX(1)
}
.splide--rtl>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next{
    left:1em;
    right:auto
}
.splide--rtl>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next svg{
    transform:scaleX(-1)
}
.splide--ttb>.splide__arrows .splide__arrow,.splide--ttb>.splide__track>.splide__arrows .splide__arrow{
    left:50%;
    transform:translate(-50%)
}
.splide--ttb>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev{
    top:1em
}
.splide--ttb>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev svg{
    transform:rotate(-90deg)
}
.splide--ttb>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next{
    top:auto;
    bottom:1em
}
.splide--ttb>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next svg{
    transform:rotate(90deg)
}
.splide--ttb>.splide__pagination{
    display:flex;
    flex-direction:column;
    bottom:50%;
    left:auto;
    right:1em;
    transform:translateY(50%)
}
.splide--ttb>.splide__pagination .splide__pagination__page{
    width:5px;
    height:20px
}