.svvv table{width: 100%;}
.svvv table img{width: 100%; border-radius: 0.18rem;}

/* 电脑端页面居中样式 */
html {
    background-color: #f5f5f5;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 0;
    margin: 0;
}
body {
    background: #fff;
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
    min-height: calc(100vh - 20px);
    box-sizing: border-box;
    
}
@media screen and (min-width: 768px) {
    body {
        max-width: 50%;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
        border-radius: 12px;
    }
}
/* 深色模式适配 */
@media (prefers-color-scheme: dark) {
    html {
        background-color: #1a1a1a;
    }
    body {
        background-color: #191919;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    }
    .idjshow {
        background: #2c2c2c;
    }
    .mask-box-sm {
        background: #2c2c2c;
    }
    .pay-type-title, .pay-way-item span {
        color: #fff;
    }
    .pay-way-list {
        background: #2c2c2c;
    }
    /* 深色模式下支付容器适配 */
    .pay-way-container {
        background: linear-gradient(180deg, #2c2c2c 0%, #242424 100%);
    }
    .pay-way-item:hover:not(:disabled) {
        background-color: #333;
    }
    .pay-way-item:disabled {
        background-color: #2a2a2a;
    }
}

/* -------------- 优化核心：支付方式容器（贴近官方弹窗质感） -------------- */
.pay-way-container {
    position: fixed;
    width: 90%;
    max-width: 400px; /* 限制最大宽度，避免PC端过宽 */
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 80px;
    z-index: 999;
    display: none;
    padding: 12px;
    box-sizing: border-box;
    /* 官方风格渐变背景+圆角 */
    background: linear-gradient(180deg, #fafafa 0%, #f5f5f5 100%);
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); /* 柔和阴影，不刺眼 */
}
.pay-type-title {
    text-align: center;
    font-size: 15px;
    color: #333; /* 标题深灰，更醒目 */
    margin-bottom: 12px;
    font-weight: 500;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; /* 系统字体，自然适配 */
}
.pay-way-list {
    display: flex;
    flex-direction: column;
    gap: 8px; /* 官方支付选项间距，更紧凑 */
    background: #fff;
    border-radius: 12px; /* 列表内圆角，与容器区分 */
    padding: 10px 0;
    box-shadow: none; /* 取消多层阴影杂乱感 */
}

/* -------------- 优化核心：支付按钮（1:1还原官方视觉） -------------- */
.pay-way-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px; /* 图标与文字间距，符合官方比例 */
    cursor: pointer;
    width: 100%;
    padding: 12px 20px; /* 增大点击区域，更舒适 */
    box-sizing: border-box;
    transition: all 0.2s ease; /* 流畅过渡效果 */
    position: relative; /* 用于放置选中勾选图标 */
}
/* 微信支付官方配色 */
#wxpayItem {
    --wx-color: #07C160; /* 微信支付主色 */
}
#wxpayItem span:first-of-type {
    color: var(--wx-color);
    font-weight: 500; /* 微信文字略粗，匹配官方 */
}
/* 支付宝支付官方配色 */
#alipayItem {
    --alipay-color: #1677FF; /* 支付宝主色 */
}
#alipayItem span:first-of-type {
    color: var(--alipay-color);
    font-weight: 400; /* 支付宝文字常规粗细 */
}
/* 支付图标优化（无拉伸，官方比例） */
.pay-way-item img {
    width: 42px;
    height: 42px;
    object-fit: contain;
    margin-bottom: 0; /* 取消底部间距，对齐更精准 */
}
/* 支付文字优化（官方字体+大小） */
.pay-way-item span {
    font-size: 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
/* 官方支付小字（提升信任度） */
.pay-way-item span:last-of-type {
    font-size: 12px;
    color: #999;
    margin-left: auto; /* 右对齐，更美观 */
}

/* -------------- 优化核心：交互反馈（模拟真实支付场景） -------------- */
/* hover效果：轻微放大+淡色背景，模拟按压感 */
.pay-way-item:hover:not(:disabled) {
    background-color: #fafafa;
    transform: scale(1.01); /* 轻微放大，立体感更强 */
}
/* 选中状态：官方风格勾选图标 */
.pay-way-item.selected::after {
    content: "";
    position: absolute;
    right: 20px;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}
#wxpayItem.selected::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2307C160'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
}
#alipayItem.selected::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231677FF'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
}
/* 禁用状态：图标变灰+文字浅灰，更真实 */
.pay-way-item:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: #f9f9f9;
}
.pay-way-item:disabled img {
    filter: grayscale(100%); /* 禁用时图标变灰 */
}
.pay-way-item:disabled span:first-of-type {
    color: #999; /* 禁用时文字浅灰 */
}

/* 支付按钮样式（保留原功能，仅优化兼容性） */
.qunbtn {
position: fixed; /* 关键：保持悬浮，滚动时不消失 */
/* 核心适配：宽度继承body的宽度（电脑端50%，移动端100%） */
width: inherit; 
max-width: inherit; /* 同步继承最大宽度，避免溢出 */
/* 水平居中：配合body的margin:0 auto，让按钮跟随页面居中 */
left: auto; 
right: auto;
margin: 0 auto; /* 关键：实现按钮在视口中水平居中 */
/* 保留原有样式，调整边距避免贴边 */
font-size: 1.2rem;
color: #fff;
text-align: center;
padding: 1rem 0;
border-radius: 0.8rem;
background-color: #1aad19;
bottom: 10px; /* 距离视口底部10px，悬浮位置不变 */
border: none;
cursor: pointer;
z-index: 998; /* 确保在其他内容上方 */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
/* 防止移动端宽度溢出（可选） */
box-sizing: border-box;
}




/* 3. 移动端补充：确保按钮占满屏幕宽度（无空隙） */
@media screen and (max-width: 767px) {
.qunbtn {
width: 90%; /* 和之前一致，移动端占90%宽度 */
margin: 0 5%; /* 左右各5%空隙，避免贴边 */
}
}












            .qunbtn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}