::-webkit-scrollbar-thumb {
    background: rgba(199, 199, 199, 0.8);
}

.layui-bg-blue {
    background-color: #58b7ff !important;
}

.layui-btn {
    background-color: #409eff;
}

.layui-layer-btn .layui-layer-btn0 {
    background-color: #409eff;
}

.layui-btn-primary {
    background-color: transparent;
}

.layui-btn-primary:hover {
    border-color: #79bbff;
}

.layui-input:focus,
.layui-textarea:focus {
    border-color: #79bbff !important;
    box-shadow: none;
}

.layui-form-danger + .layui-form-select .layui-input,
.layui-form-danger:focus {
    border-color: #ff5722 !important;
}

.layui-laypage a:hover {
    color: #409eff;
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: #409eff;
}

.layui-laypage input:focus, .layui-laypage select:focus {
    border-color: #79bbff !important;
    box-shadow: none;
}

.layui-table-view .layui-table td[data-edit]:hover:after {
    border-color: #79bbff;
}

.layui-form-checkbox[lay-skin=primary]:hover > i {
    border-color: #79bbff;
}

.layui-form-checkbox[lay-skin=primary] > .layui-icon-indeterminate:before {
    background-color: #79bbff;
}

.layui-form-checkbox[lay-skin=primary] > .layui-icon-indeterminate {
    border-color: #79bbff;
}

.layui-form-checked[lay-skin=primary] > i {
    background-color: #409eff;
    border-color: #409eff !important;
}

.layui-table-checked {
    background-color: #ecf5ff;
}

.layui-table-checked:hover {
    background-color: #d9ecff;
}

.layui-table-cell-c:hover {
    border-color: #79bbff;
}

.layui-table-checked.layui-table-click,
.layui-table-checked.layui-table-hover {
    background-color: #d9ecff;
}

.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a,
.layui-nav-tree .layui-this,
.layui-nav-tree .layui-this > a,
.layui-nav-tree .layui-this > a:hover {
    background-color: #409eff;
}

.layui-nav-tree .layui-nav-bar {
    background-color: #409eff;
}

.mobile-card,
.mobile-empty {
    background-color: #fff;
    border: 1px solid #ebeef5;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.mobile-controls-stack #searchForm,
.mobile-controls-stack #userMobileToolbar {
    background-color: #fff;
    border: 1px solid #ebeef5;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.mobile-card-label,
.mobile-card-subtitle {
    color: #99a9bf;
}

.mobile-bottom-sheet {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #ebeef5;
    box-shadow: 0 10px 32px rgba(15, 23, 42, 0.16);
}

.mobile-bottom-count {
    color: #409eff;
}

.mobile-bottom-text {
    color: #606266;
}

.user-stats-summary-card {
    background: #fff;
    border: 1px solid #ebeef5;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.summary-label,
.detail-label {
    color: #99a9bf;
}

.summary-value {
    color: #303133;
}

    .mobile-quick-nav {
        background: rgba(255, 255, 255, 0.94);
        border-bottom: 1px solid #ebeef5;
}

.mobile-quick-item {
    color: #606266;
    background: #f5f7fa;
}

    .mobile-quick-item.is-active {
        color: #fff;
        background: #409eff;
    }

    #searchForm .layui-btn-container .layui-btn,
    #userStatsSearchForm .layui-btn-container .layui-btn,
    .mobile-user-toolbar .layui-btn-container .layui-btn {
        background-color: #409eff;
        border-color: #409eff;
        color: #fff;
    }

    #searchForm .layui-btn-container .layui-btn:hover,
    #userStatsSearchForm .layui-btn-container .layui-btn:hover,
    .mobile-user-toolbar .layui-btn-container .layui-btn:hover {
        background-color: #66b1ff;
        border-color: #66b1ff;
    }

.mobile-proxy-details {
    border-top: 1px solid #ebeef5;
}

.mobile-status-badge.is-enable,
.mobile-status-badge.online {
    color: #67c23a;
    background-color: #f0f9eb;
    border: 1px solid #e1f3d8;
}

.mobile-status-badge.is-disable,
.mobile-status-badge.offline {
    color: #f56c6c;
    background-color: #fef0f0;
    border: 1px solid #fde2e2;
}

.proxy-expand .layui-row .layui-row > div:first-child {
    color: #99a9bf;
}

section.server-info .text-row .text-col:first-child {
    color: #99a9bf;
}

section.proxy-list .proxy-info .layui-row .layui-row > div:first-child {
    color: #99a9bf;
}

.online,
.offline {
    border-radius: 4px;
    padding: 2px 10px;
    font-size: 12px;
    border-width: 1px;
    border-style: solid;
}

.online {
    color: #67c23a;
    background-color: #f0f9eb;
    border-color: #e1f3d8;
}

.offline {
    color: #f56c6c;
    background-color: #fef0f0;
    border-color: #fde2e2;
}

.version a,
.version span {
    color: #99a9bf;
}

.login-title,
.login-title a {
    color: #333 !important;
}

@media (prefers-color-scheme: dark) {
    ::-webkit-scrollbar-thumb {
        background: rgba(107, 107, 107, 0.8);
    }

    .login-title,
    .login-title a {
        color: #99a9bf !important;
    }

    .layui-bg-blue {
        background-color: #395c74 !important;
    }

    .layui-btn {
        background-color: #4f80a1;
    }

    .layui-layer-btn .layui-layer-btn0 {
        background-color: #4f80a1;
    }

    .layui-btn-primary {
        background-color: transparent;
        border-color: #484849;
    }

    .layui-btn-primary:hover {
        border-color: #5f5f60;
    }

    .layui-input:focus,
    .layui-textarea:focus {
        border-color: #5f5f60 !important;
        box-shadow: none;
    }

    .layui-laypage a:hover {
        color: #4f80a1;
    }

    .layui-laypage .layui-laypage-curr .layui-laypage-em {
        background-color: #4f80a1;
    }

    .layui-laypage input:focus, .layui-laypage select:focus {
        border-color: #5f5f60 !important;
        box-shadow: none;
    }

    .layui-table-view .layui-table td[data-edit]:hover:after {
        border-color: #5f5f60;
    }

    .layui-form-danger + .layui-form-select .layui-input,
    .layui-form-danger:focus {
        border-color: #ff5722 !important;
    }

    .layui-form-checkbox[lay-skin=primary]:hover > i {
        border-color: #5f5f60;
    }

    .layui-form-checkbox[lay-skin=primary] > .layui-icon-indeterminate:before {
        background-color: #5f5f60;
    }

    .layui-form-checkbox[lay-skin=primary] > .layui-icon-indeterminate {
        border-color: #5f5f60;
    }

    .layui-form-checked[lay-skin=primary] > i {
        background-color: #484849;
        border-color: #484849 !important;
    }

    .layui-table-checked {
        background-color: rgba(255, 255, 255, .04);
    }

    .layui-table-checked:hover {
        background-color: rgba(255, 255, 255, .08);
    }

    .layui-table-cell-c:hover {
        border-color: #5f5f60;
    }

    .layui-table-checked.layui-table-click,
    .layui-table-checked.layui-table-hover {
        background-color: #5f5f60;
    }

    .layui-nav-tree .layui-nav-child dd.layui-this,
    .layui-nav-tree .layui-nav-child dd.layui-this a,
    .layui-nav-tree .layui-this,
    .layui-nav-tree .layui-this > a,
    .layui-nav-tree .layui-this > a:hover {
        background-color: #4f80a1;
    }

    .layui-nav-tree .layui-nav-bar {
        background-color: #4f80a1;
    }

    .mobile-card,
    .mobile-empty {
        background-color: #1f1f20;
        border-color: #323233;
        box-shadow: none;
    }

    .mobile-controls-stack #searchForm,
    .mobile-controls-stack #userMobileToolbar {
        background-color: #1f1f20;
        border-color: #323233;
        box-shadow: none;
    }

    .mobile-card-label,
    .mobile-card-subtitle {
        color: #7e8796;
    }

    .mobile-bottom-sheet {
        background: rgba(28, 28, 30, 0.96);
        border-color: #323233;
        box-shadow: none;
    }

    .mobile-bottom-count {
        color: #7fb0d6;
    }

    .mobile-bottom-text {
        color: #c9d1d9;
    }

    .user-stats-summary-card {
        background-color: #1f1f20;
        border-color: #323233;
        box-shadow: none;
    }

    .summary-label,
    .detail-label {
        color: #7e8796;
    }

    .summary-value {
        color: #f5f7fa;
    }

    .mobile-quick-nav {
        background: rgba(28, 28, 30, 0.94);
        border-bottom-color: #323233;
    }

    .mobile-quick-item {
        color: #c9d1d9;
        background: #2b2b2d;
    }

    .mobile-quick-item.is-active {
        color: #fff;
        background: #4f80a1;
    }

    #searchForm .layui-btn-container .layui-btn,
    #userStatsSearchForm .layui-btn-container .layui-btn,
    .mobile-user-toolbar .layui-btn-container .layui-btn {
        background-color: #4f80a1;
        border-color: #4f80a1;
        color: #fff;
    }

    #searchForm .layui-btn-container .layui-btn:hover,
    #userStatsSearchForm .layui-btn-container .layui-btn:hover,
    .mobile-user-toolbar .layui-btn-container .layui-btn:hover {
        background-color: #5b90b4;
        border-color: #5b90b4;
    }

    .mobile-proxy-details {
        border-top-color: #323233;
    }

    .mobile-status-badge.is-enable,
    .mobile-status-badge.online {
        color: #67c23a;
        background-color: #1c2518;
        border-color: #25371c;
    }

    .mobile-status-badge.is-disable,
    .mobile-status-badge.offline {
        color: #f56c6c;
        background-color: #2b1d1d;
        border-color: #412626;
    }

    .online {
        color: #67c23a;
        background-color: #1c2518;
        border-color: #25371c;
    }

    .offline {
        color: #f56c6c;
        background-color: #2b1d1d;
        border-color: #412626;
    }
}