.nav-header-title{display: flex; justify-content: space-between; align-items: center;padding: 0 1.5rem; height: 4.8rem; border-bottom: .4rem solid #eee; background: #fff;}
.nav-header-title img {width: 1.0rem; height: 1.7rem;}
.nav-header-title .title { font-weight: 400; font-size: 1.8rem; color: #181818; line-height: 2.5rem; margin-right: 1rem}
.nav-header-title .button {font-weight: 400; font-size: 1.5rem; color: #F96624; line-height: 2.1rem;}
.nav-header-title .news-icon, .nav-header-title .meun-black-icon{width: 2.4rem; height: 2.4rem;}
/* 開通會員模塊 */
/* 修复 box-sizing 问题，与原项目保持一致（使用默认 content-box） */
.open-vip-model,
.open-vip-model *,
.top-up-page,
.top-up-page * {
    box-sizing: content-box;
}

.open-vip-model{
    width: 35.5rem;
    margin: 0 auto;
}
.open-vip-model > h1{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
    line-height: 2.1rem;
    margin:  1.6rem 0 0;
}
.open-vip-model .vip-type{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    overflow-x: auto;
    white-space: nowrap; /* 如果内容是横向列表，通常需要这个 */
    padding-top:2.5rem;
    padding-bottom:1rem;
    height: 16rem;
 
}
.open-vip-model .vip-item {
    width: 13.9rem;
    height: 15.6rem;
    flex-grow: 1;
    flex-shrink: 0;
    margin-right: 1rem;
    background: #F9EAD2;
    border-radius: .8rem;
    position: relative;
    z-index: 1000;
}

.open-vip-model .vip-item .offer-time{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99;
    transform: translateY(-50%);
}
.open-vip-model .vip-item .offer-time img{
    display:  block;
    height: 3.2rem;
}
.open-vip-model .vip-item .vip-info{
    height: 12.6rem;
    /*background: linear-gradient(221deg, #FFF3E2 0%, #E8BE89 100%);*/
    background: #FDF7F2;
    border-radius: .8rem;
    border: 1px solid #F0DEC8;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.open-vip-model.top-up .vip-item .vip-info{
    height: 15.5rem;
    justify-content: center;
}
.open-vip-model .vip-item .vip-info h3{
    font-weight: 400;
    font-size: 1.7rem;
    color: #191818;
    margin-top: 2.1rem;
}
.open-vip-model.top-up .vip-item .vip-info h3{
    margin-top: 0;
}
.open-vip-model .vip-item .vip-info span.discounts{
    font-family: Impact;
    font-weight: 400;
    font-size: 3.2rem;
    color: #191818;
    margin: .3rem 0;
    display: flex;
    align-items: end;
}
.open-vip-model .vip-item .vip-info span.discounts span{
    display: block;
    font-size: 1.9rem;
    color: #191818;
    margin-right: 0.3rem;
    margin-bottom: .4rem;
}
.open-vip-model .vip-item .vip-info span.original{
    font-family: PingFang SC;
    font-weight: 600;
    font-size: 1.5rem;
    color: #BDA499;
    text-decoration: line-through;
}
.open-vip-model .vip-item .offer{
    font-weight: 400;
    font-size: 1.4rem;
    color: #7F3E28;
    text-align: center;
    line-height:  3rem;
}
.open-vip-model .vip-item.on{
    background: #E65D50;
    
}
.open-vip-model .vip-item.on .vip-info{
    background: linear-gradient(221deg, #FFF3E2 0%, #E8BE89 100%);
    border: .1rem solid #EA5E64;
}
.open-vip-model .vip-item.on .vip-info span.discounts span{
    color: #5D210E;
}
.open-vip-model .vip-item.on .vip-info span.discounts{
    color: #5D210E;
}
.open-vip-model .vip-item.on .vip-info h3{
    color: #7F3E28;
}
.open-vip-model .vip-item.on .offer{
    background: #E65D50;
    color:#fff;
    border-radius:0 0 .8rem .8rem;
}

/*.open-vip-model .vip-item button{
    width: 9rem;
    height: 3.6rem;
    background: linear-gradient( 90deg, #AE784F 0%, #462505 100%);
    border-radius: .4rem;
    font-weight: 400;
    font-size: 1.5rem;
    color: #FFEAC9;
    line-height: 2.1rem;
    border: 1px solid #ffd58e;
}*/
.open-vip-model .pay-gold{display: flex; flex-wrap: wrap; justify-content: space-between}
.open-vip-model .pay-gold .pay-gold-item{
    width: calc(50% - .5rem);
    height: 7.8rem;
    margin-bottom: 1rem;
    border-radius: .4rem;
    border: .1rem solid #EBEBEB;
    position: relative;
}
.open-vip-model .pay-gold .pay-gold-item .tip{
    position: absolute;
    top: 0;
    right: 0;
    background: linear-gradient( 90deg, #E6100E 0%, #FF5E54 100%);
    border-radius: 0px .4rem 0px .4rem;
    padding: .1rem .6rem;
}
.open-vip-model .pay-gold .pay-gold-item .tip span{
    font-weight: 400;
    font-size: 1.2rem;
    color: #FFFFFF;
    line-height: 1.6rem;
}
.open-vip-model .pay-gold .pay-gold-item-on{
    background: linear-gradient( 132deg, #F3CC95 0%, #FFE7C4 100%);
    border: 1px solid #E6110F;
}
.open-vip-model .pay-gold .pay-gold-item .gold{
    margin-left: 1rem;
    display: flex;
    align-items: center;
    margin-top: 2rem;
}
.open-vip-model .pay-gold .pay-gold-item .gold img{
    width: 1.7rem; height: 1.7rem;
}
.open-vip-model .pay-gold .pay-gold-item .gold span{
    font-weight: 400;
    font-size: 1.6rem;
    color: #181818;
    line-height: 2.2rem;
    margin-left: .4rem;
}
.open-vip-model .pay-gold .pay-gold-item p.money{
    font-weight: 400;
    font-size: 1.6rem;
    color: #DC0200;
    line-height: 2.2rem;
    margin-left: 1rem;
}


.remaining-sum{flex-wrap: wrap}
.remaining-sum p{width: 100%; font-weight: 400; font-size: 1.4rem; color: #DC0200; margin-top: .6rem}
.remaining-sum .close-x{flex-grow: 1; justify-items: flex-end}
.remaining-sum .close-x img{width: 2.3rem; height: 2.3rem;}

/* TopUp 页面样式 */
.top-up-page .pay-title{
    display: flex; justify-content: space-between;
    margin: 3.8rem 0 1.2rem;
    align-items: center;
}
.top-up-page .pay-title h1{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.top-up-page .remaining-sum{
    display: flex;
    align-items: center;
}
.top-up-page .remaining-sum h1{
    font-weight: 400;
    font-size: 1.3rem;
    color: #929292;
}
.top-up-page .remaining-sum img{
    margin-left: .7rem;
    width: 1.6rem;
    height: 1.6rem;
    display: block;
}
.top-up-page .remaining-sum span{
    font-weight: 400;
    font-size: 1.4rem;
    color: #181818;
    line-height: 2.2rem;
    margin-left:  .4rem;
}
.custom-image .van-empty__image {
    width: 17rem;
    height: auto;
    object-fit: contain;
}

/* 立即开通按钮样式 */
.open-vip .do-open-vip-btn{
    margin-top: 1.1rem;
    width: 35.5rem;
    height: 4.8rem;
    background: linear-gradient(90deg, #EA6659 0%, #D94032 100%);
    border-radius: .6rem;
    font-weight: 400;
    font-size: 1.6rem;
    color: #FFFFFF;
    border: none;
    cursor: pointer;
}
.open-vip .do-open-vip-btn:disabled{
    opacity: 0.6;
    cursor: not-allowed;
}

/* 支付确认弹窗容器样式 */
.pay-confirm-wrapper {
    width: 35.5rem;
    margin: 0 auto;
}
.pay-confirm-container {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
/* 重置注入的 HTML 中的 body 样式，确保背景透明 */
.pay-confirm-container body {
    margin: 0;
    padding: 0;
    background: transparent !important;
}
.pay-confirm-container .vip-dialog {
    min-height: auto;
    padding: 0;
}
/* 移除注入 HTML 中的背景色 */
.pay-confirm-container .payment_v2_main_container {
    margin: 0 auto;
}