// .customArrow{
//     width: 64px;
//     height:  64px;
//     &:focus{
//         outline: none;
//     }
//     @apply absolute top-1/2 bg-background-arrow transform -translate-y-1/2 flex justify-center items-center transition duration-100;
//     &.leftArrow{
//         @apply left-0;
//     }
//     &.rightArrow{
//         @apply right-0;
//     }
//     &.isDisabled{
//         @apply hidden ;
//     }
// }
.navigationWrapper{
    :global(.customArrow) {
        width: 64px;
        height:  64px;
        &:focus{
            outline: none;
        }
        @apply absolute top-1/2 bg-background-arrow transform -translate-y-1/2 flex justify-center items-center transition duration-100;
        &.leftArrow{
            @apply left-0;
        }
        &.rightArrow{
            @apply right-0;
        }
        &.isDisabled{
            @apply hidden ;
        }
    }
}