/**
 * 全站统一滚动区：滚动条仅在内容区出现，预留 gutter 防止布局抖动
 */

.portal-main,
.layui-layout-admin .layui-body,
.layui-layout-admin .layui-side-scroll,
.login-page,
.ps-stage,
#userMain,
.ps-topbar-nav,
body.ps-gate-body {
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, 0.35) transparent;
}

.portal-main::-webkit-scrollbar,
.layui-layout-admin .layui-body::-webkit-scrollbar,
.layui-layout-admin .layui-side-scroll::-webkit-scrollbar,
.login-page::-webkit-scrollbar,
.ps-stage::-webkit-scrollbar,
#userMain::-webkit-scrollbar,
.ps-topbar-nav::-webkit-scrollbar,
body.ps-gate-body::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.portal-main::-webkit-scrollbar-track,
.layui-layout-admin .layui-body::-webkit-scrollbar-track,
.layui-layout-admin .layui-side-scroll::-webkit-scrollbar-track,
.login-page::-webkit-scrollbar-track,
.ps-stage::-webkit-scrollbar-track,
#userMain::-webkit-scrollbar-track,
.ps-topbar-nav::-webkit-scrollbar-track,
body.ps-gate-body::-webkit-scrollbar-track {
    background: transparent;
}

.portal-main::-webkit-scrollbar-thumb,
.layui-layout-admin .layui-body::-webkit-scrollbar-thumb,
.layui-layout-admin .layui-side-scroll::-webkit-scrollbar-thumb,
.login-page::-webkit-scrollbar-thumb,
.ps-stage::-webkit-scrollbar-thumb,
#userMain::-webkit-scrollbar-thumb,
.ps-topbar-nav::-webkit-scrollbar-thumb,
body.ps-gate-body::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.32);
    border-radius: 999px;
}

.portal-main::-webkit-scrollbar-thumb:hover,
.layui-layout-admin .layui-body::-webkit-scrollbar-thumb:hover,
.layui-layout-admin .layui-side-scroll::-webkit-scrollbar-thumb:hover,
.login-page::-webkit-scrollbar-thumb:hover,
.ps-stage::-webkit-scrollbar-thumb:hover,
#userMain::-webkit-scrollbar-thumb:hover,
.ps-topbar-nav::-webkit-scrollbar-thumb:hover,
body.ps-gate-body::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 116, 139, 0.48);
}

@media screen and (max-width: 1024px) {
    .portal-nav,
    .ps-topbar-nav {
        scrollbar-gutter: stable;
        scrollbar-width: thin;
        scrollbar-color: rgba(100, 116, 139, 0.35) transparent;
    }

    .portal-nav::-webkit-scrollbar,
    .ps-topbar-nav::-webkit-scrollbar {
        width: 6px;
    }

    .portal-nav::-webkit-scrollbar-track,
    .ps-topbar-nav::-webkit-scrollbar-track {
        background: transparent;
    }

    .portal-nav::-webkit-scrollbar-thumb,
    .ps-topbar-nav::-webkit-scrollbar-thumb {
        background: rgba(100, 116, 139, 0.32);
        border-radius: 999px;
    }
}

@supports not (scrollbar-gutter: stable) {
    .portal-main,
    .layui-layout-admin .layui-body,
    .layui-layout-admin .layui-side-scroll,
    .login-page,
    .ps-stage,
    #userMain,
    body.ps-gate-body {
        overflow-y: scroll;
    }
}

@media screen and (max-width: 1024px) {
    @supports not (scrollbar-gutter: stable) {
        .portal-nav,
        .ps-topbar-nav {
            overflow-y: scroll;
        }
    }
}