:root{
    --xz-blur: 25px;
    --xz-opacity: 0.52;
    --xz-saturate: 131%;
    --xz-radius: 16px;
}

/* ============ 液态玻璃 · 开启 ============ */
body.xz-glass-on .cc-main .cc-card{
    background: rgba(255,255,255,var(--xz-opacity)) !important;
    backdrop-filter: blur(var(--xz-blur)) saturate(var(--xz-saturate)) !important;
    -webkit-backdrop-filter: blur(var(--xz-blur)) saturate(var(--xz-saturate)) !important;
    border: 1px solid rgba(255,255,255,0.5) !important;
    border-radius: var(--xz-radius) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18),
                inset 0 1px 0 rgba(255,255,255,0.85),
                inset 0 0 0 1px rgba(255,255,255,0.35),
                inset 0 -1px 0 rgba(255,255,255,0.2) !important;
    position: relative !important;
    overflow: hidden !important;
}
/* 顶部光泽线（模拟玻璃上缘高光，参考 Apple Liquid Glass 边缘反射） */
body.xz-glass-on .cc-main .cc-card::before{
    content:'';position:absolute;top:0;left:6%;right:6%;height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,0.9),transparent);
    pointer-events:none;z-index:1;
}
/* 玻璃折射光斑（模拟液态玻璃对光的折射高光） */
body.xz-glass-on .cc-main .cc-card::after{
    content:'';position:absolute;top:-32%;left:-18%;width:64%;height:64%;
    background:radial-gradient(circle,rgba(255,255,255,0.38),transparent 70%);
    border-radius:50%;pointer-events:none;filter:blur(8px);z-index:1;
}
body.xz-glass-on .cc-main .cc-card .tab-slider-wrapper{
    background: rgba(248,249,250,0.75) !important;
    border: 1px solid rgba(230,232,235,0.6) !important;
}
body.xz-glass-on .cc-main .cc-card .input-group{
    border: 1px solid rgba(230,232,235,0.8) !important;
    background: rgba(255,255,255,0.6) !important;
}
body.xz-glass-on .cc-header h1,
body.xz-glass-on .cc-header p,
body.xz-glass-on .cc-header .cc-tip{
    text-shadow: 0 1px 4px rgba(0,0,0,0.45);
    color: #fff !important;
}
/* 兼容 Bootstrap/Argon 卡片（代理登录/注册等页面） */
body.xz-glass-on .main-content .card{
    background: rgba(255,255,255,var(--xz-opacity)) !important;
    backdrop-filter: blur(var(--xz-blur)) saturate(var(--xz-saturate)) !important;
    -webkit-backdrop-filter: blur(var(--xz-blur)) saturate(var(--xz-saturate)) !important;
    border: 1px solid rgba(255,255,255,0.45) !important;
    border-radius: var(--xz-radius) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18) !important;
}
body.xz-glass-on .header h1,
body.xz-glass-on .header .text-white{ text-shadow: 0 1px 4px rgba(0,0,0,0.45); }

/* ============ 液态玻璃 · 关闭 ============ */
body.xz-glass-off .cc-main .cc-card{
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid #e6e8eb !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
body.xz-glass-off .cc-main .cc-card .tab-slider-wrapper{ background: #f8f9fa !important; }
body.xz-glass-off .cc-main .cc-card .input-group{ background: #ffffff !important; }
body.xz-glass-off .cc-header h1,
body.xz-glass-off .cc-header p,
body.xz-glass-off .cc-header .cc-tip{ text-shadow: none !important; }

/* ============ 模板布局（5 种） ============ */
/* 模板 2：靠左 */
body.xz-tpl-2 .cc-main{ justify-content: flex-start !important; padding-left: 6% !important; }
/* 模板 3：靠右 */
body.xz-tpl-3 .cc-main{ justify-content: flex-end !important; padding-right: 6% !important; }
/* 模板 4：大圆角 + 更透明 */
body.xz-tpl-4 .cc-main .cc-card{
    border-radius: 26px !important;
    background: rgba(255,255,255,0.60) !important;
}
/* 模板 5：更宽卡片 */
body.xz-tpl-5 .cc-main .cc-card{ max-width: 520px !important; width: 100% !important; }
