.hide_box{z-index:999;background:rgba(0,0,0,0.6);opacity:0.6;-moz-opacity:0.6;left:0;top:0;height:100%;width:100%;position:fixed;display:none;-webkit-backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);backdrop-filter:blur(5px);}

@supports not (backdrop-filter: blur(5px)) {
    .hide_box { background: rgba(0,0,0,0.85); }
}
.shang_box{width:580px;padding:20px;background-color:#fff;border-radius:16px;position:fixed;z-index:1000;left:50%;top:50%;margin-left:-290px;margin-top:-320px;border:1px solid #eee;box-shadow:0 20px 60px rgba(0,0,0,0.2);display:none;}
.shang_box img{border:none;border-width:0;max-width:100%;height:auto;}
.dashang{display:block;width:120px;margin:20px auto 10px;height:36px;line-height:36px;padding:0 20px;background:linear-gradient(135deg,#E74851,#ff6b6b);color:#fff;text-align:center;text-decoration:none;border-radius:20px;font-weight:bold;font-size:16px;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;box-shadow:0 4px 15px rgba(231,72,81,0.3);will-change:transform;}
.dashang:hover{opacity:0.9;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);transform:translateY(-2px);box-shadow:0 6px 20px rgba(231,72,81,0.4);}
.shang_tit{width:100%;height:60px;text-align:center;line-height:60px;color:#333;font-size:18px;font-weight:600;margin-bottom:10px;border-bottom:1px solid #eee;}
.shang_tit p{color:#666;text-align:center;font-size:14px;font-weight:normal;margin-top:-10px;}
.shang_warm{text-align:center;margin-bottom:15px;padding:12px 15px;background:#fff7ed;border:1px solid #ffedd5;border-radius:10px;}
.shang_warm p{color:#d97706;font-size:13px;margin:4px 0;line-height:1.6;}
.pay_methods{display:flex;justify-content:center;gap:20px;margin-bottom:15px;}
.pay_methods > * { margin-left: 20px; }
.pay_methods > *:first-child { margin-left: 0; }
.pay_option{display:flex;align-items:center;padding:10px 20px;border-radius:25px;background:#f5f5f5;color:#666;cursor:pointer;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;font-size:14px;}
.pay_option:hover{background:#eee;}
.pay_option.active{background:#E74851;color:#fff;}
.shang_payimg{display:none;width:300px;padding:15px;border:1px solid #f0f0f0;margin:0 auto;border-radius:12px;background:#fafafa;}
.shang_payimg img{display:block;margin:0 auto;width:280px;height:auto;max-height:360px;object-fit:contain;}
.pay_explain{text-align:center;margin:10px auto 20px;font-size:13px;color:#999;}
.shang_info{text-align:center;margin-bottom:20px;}
.shang_info p{color:#666;text-align:center;font-size:13px;line-height:1.6;}
.shang_info #shang_info_text{color:#E74851;font-weight:bold;}
.shang_close{float:right;color:#999;font-size:24px;text-decoration:none;margin-right:5px;line-height:24px;width:24px;height:24px;text-align:center;border-radius:50%;transition:all 0.3s;}
.shang_close:hover{color:#333;background:#f0f0f0;}
.qrcode_grid{display:flex;justify-content:center;gap:30px;padding:20px 0;border-top:1px solid #eee;margin-top:10px;}
.qrcode_grid > * { margin-left: 30px; }
.qrcode_grid > *:first-child { margin-left: 0; }
.qrcode_item{text-align:center;}
.qrcode_item img{width:160px;height:auto;max-height:200px;border-radius:8px;border:1px solid #eee;padding:8px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,0.05);object-fit:contain;}
.qrcode_item p{margin-top:10px;font-size:14px;color:#666;font-weight:500;}

@media (max-width: 768px) {
    .shang_box{
        width: 92%;
        max-width: 400px;
        margin-left: -46%;
        margin-top: -45%;
        padding: 15px;
    }
    .shang_payimg{
        width: 100%;
    }
    .shang_payimg img{
        width: 100%;
        max-width: 250px;
        height: auto;
        max-height: 300px;
    }
    .dashang{
        width: 100px;
        font-size: 14px;
        padding: 8px 16px;
    }
    .qrcode_grid{
        gap: 15px;
    }
    .qrcode_item img{
        width: 120px;
        height: auto;
        max-height: 150px;
    }
}

@media (max-width: 480px) {
    .qrcode_grid{
        gap: 10px;
        padding: 15px 0;
    }
    .qrcode_item img{
        width: 100px;
        height: auto;
        max-height: 130px;
    }
    .qrcode_item p{
        font-size: 12px;
    }
}