.warpper{
    .item{
        @apply inline-flex items-center justify-center cursor-pointer;
        background-color: var(--gray);
        margin: 0 0.4rem;
        width: 3.2rem;
        height: 3.2rem;
        &.active{
            @apply border border-solid;
            border-color: var(--text-active);
            background-color: var(--white);
        }
        &.disable{
            svg{
                path{
                    fill: var(--disabled)
                }
            }
            @apply text-disabled cursor-not-allowed;
        }
    }
}