:root{
    --zib-bp-surface:var(--main-bg-color, #fff);
    --zib-bp-surface-alt:var(--muted-bg-color, #f7f7fb);
    --zib-bp-border:var(--muted-border-color, rgba(0,0,0,.08));
    --zib-bp-text:var(--main-color, #4b4f58);
    --zib-bp-text-muted:var(--muted-color, #7f8793);
    --zib-bp-text-subtle:var(--muted-2-color, #9aa3af);
    --zib-bp-accent:var(--focus-color, #ff5f94);
    --zib-bp-accent-soft:color-mix(in srgb,var(--focus-color, #ff5f94) 12%, transparent);
    --zib-bp-shadow:0 10px 30px rgba(0,0,0,.06);
}
.dark-theme,
.theme-dark,
body.dark-theme,
body.theme-dark{
    --zib-bp-shadow:0 12px 34px rgba(0,0,0,.22);
}
#zib-mention-list{
    background:var(--zib-bp-surface, var(--main-bg-color, #fff)) !important;
    border-color:var(--zib-bp-border, var(--muted-border-color, rgba(0,0,0,.08))) !important;
    box-shadow:var(--zib-bp-shadow, 0 10px 30px rgba(0,0,0,.06)) !important;
    color:var(--zib-bp-text, var(--main-color, #4b4f58)) !important;
}
#zib-mention-list::-webkit-scrollbar-thumb{background:var(--zib-bp-border, var(--muted-border-color, rgba(0,0,0,.08)))}
.zib-mention-item{
    background:var(--zib-bp-surface-alt, var(--muted-bg-color, #f7f7fb)) !important;
    color:var(--zib-bp-text, var(--main-color, #4b4f58)) !important;
}
.zib-mention-item:hover,
.zib-mention-item.active{
    background:var(--zib-bp-accent-soft, color-mix(in srgb,var(--focus-color, #ff5f94) 12%, transparent)) !important;
    border-color:color-mix(in srgb,var(--zib-bp-accent, var(--focus-color, #ff5f94)) 26%, var(--zib-bp-border, var(--muted-border-color, rgba(0,0,0,.08)))) !important;
    color:var(--zib-bp-accent, var(--focus-color, #ff5f94)) !important;
}
a.zib-mention-link{
    color:var(--zib-bp-accent, var(--focus-color, #ff5f94));
    background:var(--zib-bp-accent-soft, color-mix(in srgb,var(--focus-color, #ff5f94) 12%, transparent));
}
a.zib-mention-link:hover{
    background:var(--zib-bp-accent, var(--focus-color, #ff5f94));
    color:#fff;
}
#user-tab-bundle .bundle-preview-box{
    background:var(--zib-bp-surface-alt);
    border-color:var(--zib-bp-border);
}
#user-tab-bundle .medal-card{
    background:var(--zib-bp-surface);
    border-color:transparent;
    box-shadow:0 10px 24px rgba(0,0,0,.04);
}
#user-tab-bundle .medal-card.is-active{
    background:var(--zib-bp-surface) !important;
    border-color:var(--zib-bp-accent) !important;
    box-shadow:0 10px 24px color-mix(in srgb,var(--zib-bp-accent) 16%, transparent);
}
#user-tab-bundle .bundle-cat-desc,
#user-tab-bundle .bundle-rule{color:var(--zib-bp-text-subtle)}
.zib-bundle-smilie-tab{background:var(--zib-bp-surface-alt)}
.zib-bundle-smilie-grid .smilie-icon{background:color-mix(in srgb,var(--zib-bp-text) 4%, transparent)}
.zib-bundle-smilie-grid .smilie-icon:hover{background:color-mix(in srgb,var(--zib-bp-text) 8%, transparent)}
#con-cd p.muted-color{color:var(--zib-bp-text)}
#people-cd{color:var(--zib-bp-text-subtle)}
.content-ds-users img{border-color:var(--zib-bp-surface)}
.cd-amount-item,
.zib-widget.vip-product.relative.product-box.custom-trigger-cd{
    border-color:var(--zib-bp-border);
    background:var(--zib-bp-surface-alt);
    color:var(--zib-bp-text);
}
.modal-mini .modal-body.post-cd-pay-panel,
.post-cd-pay-panel{
    background:var(--zib-bp-surface);
    color:var(--zib-bp-text);
}
.post-cd-pay-panel .cd-modal-head{
    background:
        linear-gradient(135deg,
            color-mix(in srgb,var(--zib-bp-accent) 14%, var(--zib-bp-surface)) 0%,
            color-mix(in srgb,#43c7d9 12%, var(--zib-bp-surface)) 100%);
}
.post-cd-pay-panel .cd-modal-close{
    background:var(--zib-bp-surface);
    color:var(--zib-bp-text-subtle);
    box-shadow:var(--zib-bp-shadow);
}
.post-cd-pay-panel .cd-modal-close:hover{color:var(--zib-bp-text)}
.post-cd-pay-panel .cd-head-title,
.post-cd-pay-panel .cd-amount-grid .cd-amount-item .em14,
.post-cd-pay-panel .cd-amount-grid .custom-trigger-cd .em12,
.post-cd-pay-panel .custom-trigger-cd .cd-custom-input-inline{
    color:var(--zib-bp-text);
}
.post-cd-pay-panel .cd-head-sub,
.post-cd-pay-panel .cd-note-line,
.post-cd-pay-panel .cd-foot-note{
    color:var(--zib-bp-text-subtle);
}
.post-cd-pay-panel .cd-balance-box{
    background:linear-gradient(180deg,var(--zib-bp-surface) 0%, color-mix(in srgb,var(--zib-bp-accent) 5%, var(--zib-bp-surface)) 100%);
    box-shadow:0 8px 20px rgba(0,0,0,.06);
}
.post-cd-pay-panel .cd-amount-grid .cd-amount-item,
.post-cd-pay-panel .cd-amount-grid .custom-trigger-cd,
.post-cd-pay-panel .payment-method-radio{
    background:var(--zib-bp-surface);
    border:1px solid var(--zib-bp-border);
    box-shadow:none;
}
.post-cd-pay-panel .payment-method-radio{
    border-radius:8px;
}
.post-cd-pay-panel .payment-method-radio > *{
    margin:0;
}
.post-cd-pay-panel .payment-methods-box,
.post-cd-pay-panel .cd-foot-note{
    border-top-color:var(--zib-bp-border);
}
.post-cd-pay-panel .payment-method-radio.active{
    border-color:color-mix(in srgb,var(--zib-bp-accent) 30%, var(--zib-bp-border));
    background:var(--zib-bp-accent-soft);
    box-shadow:none;
}

/*
 * 修复某些主题通过 style 属性直接写 border-color
 * 导致插件样式被行内样式覆盖的问题
 */
html [style*="border-color"] {
    border-style: none !important;
}

/*
 * 去除浏览器滚动条（需在后台"主题兼容增强"中开启）
 * Chrome/Safari/Edge（WebKit）：隐藏滚动条但保留滚动功能
 * Firefox：scrollbar-width: none
 * IE/旧 Edge：-ms-overflow-style: none
 */
html.zib-bp-hide-scrollbar,
body.zib-bp-hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

html.zib-bp-hide-scrollbar::-webkit-scrollbar,
body.zib-bp-hide-scrollbar::-webkit-scrollbar {
    width: 0px;
    height: 0px;
}

/*
 * Logo 扫光效果（需在后台"主题兼容增强"中开启）
 */
body.zib-bp-logo-light .navbar-brand {
    position: relative;
    overflow: hidden;
}

body.zib-bp-logo-light .navbar-brand:before {
    content: "";
    position: absolute;
    left: -665px;
    top: -460px;
    width: 200px;
    height: 15px;
    background-color: rgba(255, 255, 255, .5);
    transform: rotate(-45deg);
    animation: zib-bp-logo-light 6s ease-in 0s infinite;
}

@keyframes zib-bp-logo-light {
    40% { left: -100px; top: 0; }
    60% { left: 120px; top: 100px; }
    80% { left: -100px; top: 0px; }
}
