/* 滚动条美化 */
.scrollbar-overlay {
    overflow-y: auto;
    overflow-y: overlay;
    -webkit-overflow-scrolling: touch;

    /* 滚动条尺寸 */
    &::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    /*滚动条滑块隐藏*/
    &::-webkit-scrollbar-thumb {
        border: 3px solid transparent;
        background-color: rgba(0, 0, 0, .2);
        background-clip: content-box;
        border-radius: 12px;
        /*让该容器的滚动条滑块显示*/
        &:hover {
            border: 2px solid transparent;
            background-color: rgba(0, 0, 0, .2);
        }

        /*按下滚动条，颜色加深*/
        &:active {
            border: 2px solid transparent;
            background-color: rgba(0, 0, 0, .4);
        }
    }

    /*滚动条轨道*/
    &::-webkit-scrollbar-track {
        border-radius: 12px;
        background: rgba(0, 0, 0, 0);
    }

    /*鼠标浮到容器上*/
    &:hover {
        &::-webkit-scrollbar {
            width: 12px;
            height: 12px;
        }
    }
}

/* 滚动条隐藏 */
.scrollbar-hidden {
    &::-webkit-scrollbar {
        display: none;
    }
}