/* ============================================
   旧版步骤条样式（兼容性保留）
   ============================================ */
/* 旧版步骤条样式 - 保留用于兼容 */
.stepflex{float:right;border-top:5px solid #f1f1f1;text-align:center;margin:60px 100px 0px 50px;}
.stepflex dl{border-top:5px solid #f1f1f1;float:left;position:relative;top:-5px;width:160px;}
dl.doing{border-top-color:#04bd3d;}
.doing .s-num{background-position:-23px 0;}
.s-num,.s-num1{color:#fff;font-weight: 700;height:23px;line-height:23px;margin:-15px auto 0;position:relative;width:23px;border-radius:25px;}
.s-num{background:#04bd3d;}
.s-num1{background:#f1f1f1;}
.s-text1{line-height:30px;}
.s-text{line-height:30px;color:#04bd3d;}

/* ============================================
   新版入驻流程步骤条样式（shop_join_step.html）
   注意：新版样式会覆盖旧版flow-container样式
   ============================================ */
/* 步骤条容器 - 新版样式（优先级更高） */
.flow-container {
    width: 97%;
    margin: 20px 0 30px 0;
    padding: 30px 0;
    background: linear-gradient(to bottom, #fff 0%, #fafafa 100%);
    border: 1px solid #eeeeee;
    border-top: 3px solid #FC7A64;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
}

.flow-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #FC7A64 0%, #ff8c7a 50%, #FC7A64 100%);
    animation: shimmer 3s infinite;
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* 步骤条主体 */
.stepflex {
    display: flex;
    /*flex-direction: row;*/
    /*justify-content: center;*/
    /*align-items: center;*/
    padding: 20px 137px;
    /*flex-wrap: wrap;*/
    position: relative;
    z-index: 1;
}

/* 单个步骤项 */
.step-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
    flex: 1;
    min-width: 150px;
    max-width: 250px;
    justify-content: center;
    transition: all 0.3s ease;
}

.step-item:hover {
    transform: translateY(-2px);
}

.step-item:hover .step-wrapper {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

.step-item:hover .step-number {
    transform: scale(1.05);
}

.step-item:hover .step-title {
    color: #FC7A64;
}

.step-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    padding: 10px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.step-item.step-active .step-wrapper {
    background: rgba(252, 122, 100, 0.05);
    border: 1px solid rgba(252, 122, 100, 0.2);
}

.step-item.step-completed .step-wrapper {
    background: rgba(76, 175, 80, 0.05);
    border: 1px solid rgba(76, 175, 80, 0.2);
}

.step-item.step-current .step-wrapper {
    background: rgba(252, 122, 100, 0.1);
    border: 2px solid rgba(252, 122, 100, 0.4);
    box-shadow: 0 4px 12px rgba(252, 122, 100, 0.2);
    animation: pulse-border 2s infinite;
}

@keyframes pulse-border {
    0%, 100% {
        box-shadow: 0 4px 12px rgba(252, 122, 100, 0.2);
    }
    50% {
        box-shadow: 0 4px 20px rgba(252, 122, 100, 0.4);
    }
}

/* 步骤编号 */
.step-number {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    position: relative;
    z-index: 2;
    transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    border: 3px solid transparent;
}

.step-number-active {
    background: linear-gradient(135deg, #FC7A64 0%, #ff8c7a 100%);
    color: #fff;
    box-shadow: 0 4px 15px rgba(252, 122, 100, 0.4);
    transform: scale(1);
}

.step-number-inactive {
    background: linear-gradient(135deg, #f1f1f1 0%, #e0e0e0 100%);
    color: #999;
    border-color: #ddd;
}

.step-number-completed {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
    color: #fff;
    box-shadow: 0 4px 15px rgba(76, 175, 80, 0.4);
    border-color: #4CAF50;
}

.step-number-current {
    animation: number-pulse 2s infinite;
}

@keyframes number-pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 4px 15px rgba(252, 122, 100, 0.4);
    }
    50% {
        transform: scale(1.1);
        box-shadow: 0 6px 20px rgba(252, 122, 100, 0.6);
    }
}

.step-number-text {
    position: relative;
    z-index: 3;
}

.step-check-icon {
    font-size: 18px;
    position: relative;
    z-index: 3;
    animation: check-bounce 0.6s ease;
}

@keyframes check-bounce {
    0% {
        transform: scale(0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}

.step-pulse {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(252, 122, 100, 0.3);
    animation: ripple 2s infinite;
    z-index: 1;
}

@keyframes ripple {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.8);
        opacity: 0;
    }
}

/* 步骤内容 */
.step-content {
    margin-top: 12px;
    text-align: center;
    flex: 1;
    min-width: 120px;
}

.step-title {
    font-size: 15px;
    line-height: 1.6;
    transition: all 0.3s ease;
    margin-bottom: 6px;
    font-weight: 500;
}

.step-title-active {
    color: #FC7A64;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(252, 122, 100, 0.1);
}

.step-title-inactive {
    color: #999;
    font-weight: 400;
}

.step-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
    margin-top: 4px;
    transition: all 0.3s ease;
}

.step-badge-completed {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
    color: #fff;
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.3);
}

.step-badge-current {
    background: linear-gradient(135deg, #FC7A64 0%, #ff8c7a 100%);
    color: #fff;
    box-shadow: 0 2px 6px rgba(252, 122, 100, 0.3);
    animation: badge-pulse 2s infinite;
}

@keyframes badge-pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

.step-badge-pending {
    background: #f5f5f5;
    color: #999;
    border: 1px solid #e0e0e0;
}

/* 步骤项进入动画 */
.step-item {
    animation: fadeInUp 0.5s ease forwards;
    opacity: 0;
}

.step-item:nth-child(1) { animation-delay: 0.1s; }
.step-item:nth-child(2) { animation-delay: 0.2s; }
.step-item:nth-child(3) { animation-delay: 0.3s; }
.step-item:nth-child(4) { animation-delay: 0.4s; }
.step-item:nth-child(5) { animation-delay: 0.5s; }
.step-item:nth-child(6) { animation-delay: 0.6s; }

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 工具提示效果 */
.step-item {
    cursor: default;
}

.step-item.step-completed {
    cursor: pointer;
}

.step-item.step-completed:hover .step-badge-completed {
    transform: scale(1.05);
    box-shadow: 0 4px 10px rgba(76, 175, 80, 0.4);
}

/* 步骤连接线 */
.step-connector {
    margin: 0 20px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    position: relative;
    height: 3px;
    min-width: 60px;
}

.step-connector-line {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    transform: translateY(-50%);
    transition: all 0.5s ease;
    border-radius: 2px;
}

.step-connector-active .step-connector-line {
    background: linear-gradient(90deg, #4CAF50 0%, #66BB6A 50%, #4CAF50 100%);
    background-size: 200% 100%;
    box-shadow: 0 0 8px rgba(76, 175, 80, 0.4);
    animation: line-flow 2s infinite;
}

.step-connector-inactive .step-connector-line {
    background: #e0e0e0;
}

@keyframes line-flow {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.step-connector-dot {
    position: absolute;
    top: 50%;
    right: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease;
}

.step-connector-active .step-connector-dot {
    background: #4CAF50;
    box-shadow: 0 0 6px rgba(76, 175, 80, 0.6);
    animation: dot-pulse 2s infinite;
}

.step-connector-inactive .step-connector-dot {
    background: #e0e0e0;
}

@keyframes dot-pulse {
    0%, 100% {
        transform: translateY(-50%) scale(1);
        opacity: 1;
    }
    50% {
        transform: translateY(-50%) scale(1.3);
        opacity: 0.8;
    }
}

/* 响应式设计 */
@media (max-width: 1200px) {
    .step-item {
        min-width: 120px;
        max-width: 200px;
    }
    
    .step-title {
        font-size: 14px;
    }
    
    .step-number {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }
    
    .step-connector {
        min-width: 40px;
        margin: 0 15px;
    }
}

@media (max-width: 768px) {
    .flow-container {
        padding: 20px 0;
    }
    
    .stepflex {
        flex-direction: column;
        padding: 20px;
    }
    
    .step-item {
        width: 100%;
        max-width: 100%;
        margin-bottom: 20px;
        justify-content: flex-start;
        padding: 0 20px;
    }
    
    .step-wrapper {
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        padding: 15px;
        border-radius: 8px;
    }
    
    .step-number {
        width: 40px;
        height: 40px;
        font-size: 16px;
        flex-shrink: 0;
    }
    
    .step-content {
        margin-top: 0;
        margin-left: 15px;
        text-align: left;
        flex: 1;
    }
    
    .step-title {
        font-size: 15px;
        margin-bottom: 4px;
    }
    
    .step-connector {
        display: none;
    }
    
    .step-pulse {
        width: 40px;
        height: 40px;
    }
    
    .step-item.step-current .step-wrapper {
        border-width: 2px;
    }
}
select{height:29px;}
.webuploader-container{overflow:hidden;}
.apply-banner{width: 100%;height:320px;position: relative;z-index: 1;top:-8px;}
.apply-msg-box{filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#3F000000', endColorstr='#3F000000');background:rgba(0,0,0,0.25); width: 280px; height: 300px;  z-index: 9; margin-top:30px; border-radius: 5px;}
.apply-msg-box h3{color:#fff;font: 600 17px/24px; color: #FFF; padding: 12px 10px 4px 10px; margin: 0 10px 10px;box-shadow: 0 1px 0 rgba(0,0,0,0.1);}
.apply-msg-box .title{color: #FFF;margin-top:10px;line-height:30px;padding-left:15px;padding-right:15px;}
.apply-msg-box ul{color: #FFF;padding-left:15px;padding-right:15px;height:149px;}
.apply-msg-box ul li{margin-top:10px;line-height:23px;list-style-type: disc;margin-left:15px;}
.apply-msg-box .bottom{border-radius:0 0 5px 5px;margin-top:10px;padding-top:10px;padding-bottom:10px;padding-left:7px;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000', endColorstr='#7F000000'); background:rgba(0,0,0,0.5); text-align: center;}
/* 轮播图样式 */
.wst-slide{position: relative;height:350px;overflow:hidden;top:-320px;z-index:-1}
.wst-slide-items{min-width:1200px;position: relative;}
.wst-slide-items li{overflow:hidden;list-style:none;}
.wst-slide-numbox{position:absolute;bottom:10px;width:100%;text-align:center;z-index:10}
.wst-slide-controls{width:200px;text-align:center;margin:0 auto;z-index:10}
.wst-slide-controls span{width:13px;height:13px;text-align:center;display:inline-block;border-radius:12px;background-color:#f1f1f1;color:white;cursor:pointer;margin:0 5px;line-height:13px;font-size:10px;}
.wst-slide-controls span.curr{background-color:#eadfdf;border-radius:12px;color:white;cursor:pointer}

/* 提示信息样式 */
.apply-tips{color: #777;background-color: #EEE;width: 100%;height: 60px;line-height:60px;}
.apply-tips .title{width: 63px;height: 48px;display: inline-block;padding: 6px 12px 6px 24px;vertical-align:middle;}
.apply-tips .title h3{display:inline-block;margin:0;padding:0;font-size:14px;font-weight:600;line-height:48px;vertical-align:middle;}
.apply-tips .title i{background: url(../img/ic_volume_24x24.png) no-repeat 0px 0;display: block;width: 24px;height: 24px;float: left;margin: 0 18px;}
.apply-tips .content{vertical-align: top;display: inline-block;width: 970px;padding: 10px;line-height:40px;}
.apply-step{width: 840px;height: 110px;margin: 30px auto;overflow: hidden;}
.apply-step span { vertical-align: middle; letter-spacing: normal; word-spacing: normal; display: inline-block; *display: inline; *zoom: 1;}
.apply-step span.step { color:#777;line-height: 20px; text-align: center; width: 80px;}
.apply-step span.step i { background: url(../img/btn_80x80.png) no-repeat; display: block; width: 80px; height: 80px; margin-bottom: 10px;}
.apply-step span.step i.a { background-position: -12px 0px;}
.apply-step span.step i.b { background-position: -94px 0px;}
.apply-step span.step i.c { background-position: -176px 0px;}
.apply-step span.step i.d { background-position: -258px 0px;}
.apply-step span.step i.e { background-position: -340px 0px;}
.apply-step span.arrow { background: url(../img/btn_80x80.png) no-repeat -439px -30px; width: 60px; height: 22px; margin: 0 20px;margin-top:-25px;}
.apply-step-head{margin-top:20px;border-bottom:dotted 1px #f1f1f1;font-weight:600;font-size:16px;line-height:30px;padding-left:10px;}

.main-head{font-size:17px;font-weight:bold;height:35px;line-height:35px;text-align:left;}
.apply-box {border-top: 2px solid #FC7A64;border-left: 1px solid #eeeeee;border-right: 1px solid #eeeeee;border-bottom: 1px solid #eeeeee;padding: 5px 0px 0px 5px;}
.apply-box2 {border-top: 2px solid #FC7A64;}
.apply-agreement-box{height:350px;border:1px solid #eeeeee;padding:5px;overflow:auto;margin:0 auto;}
.apply-agreement-box .tip{color:gray}
.agreement-table{width:100%;margin-bottom:10px;}
.agreement-table th{text-align: right;width:250px;}
.agreement-table td{text-align: left;padding:8px 0px 8px 0px}
.agreement-table .head-ititle{background:url('../img/img_seller_ggjt.png') no-repeat 5px 4px;padding-left:28px;padding-bottom:5px;font-weight:bold;}
.agreement-table input[type=text]{margin:2px;width: 400px;}
.agreement-table textarea{margin:2px;}
.agreement_box{text-align:center;margin-top:5px;}
.agreement-bottom{padding:10px 5px;text-align: center}
.examine-tips{text-align: center;width:100%;padding-top:60px;padding-bottom:80px;font-weight: 600;font-size:16px;color:#999;}
.agreement-table .c-tip{padding-top:5px;}
label{margin-right:20px;}
.webuploader-pick{padding:3px 10px;}
.goodsCat{width:200px;margin-right:20px;float:left;}
.wst-tab-box {width: 100%;height: auto;margin: 0px auto;background: #ffffff;margin-top:10px;}
.wst-tab-nav {margin: 0;padding: 0;height: 35px;top: 0px;z-index: 30;background: #ffffff;width:100%;border-bottom: 1px solid #eeeeee;border-left: 1px solid #eeeeee}
.wst-tab-nav li {width:23.24%;cursor: pointer;float: left;margin: 0 0px;list-style: none;border: 1px solid #eee;border-bottom: none;border-left: none;line-height: 34px;text-align: center;color: #000000;padding-left: 10px;padding-right: 10px;}
.wst-tab-nav .on {border-top: 1px solid #ff2704;border-bottom: 1px solid #ffffff;color: #ff2704;font-weight:bold;}
.wst-tab-content {padding: 5px;width: 99%;height: auto;border: 1px solid #eee;border-top:none;background: #FFF;}
.wst-tab-item{display:none;padding:15px;}
.wst-tab-item:first-child{display:block;}
.upload-picker div:nth-child(2){top:0!important;left:0!important;width:200px!important;height:100%!important;}
#totalCatFee{color:red;}
/**支付方式**/
.pay-box{border-left:1px solid #eeeeee;border-right:1px solid #eeeeee;border-top:1px solid #eeeeee;padding:5px 0px 10px 10px;}
.pay-boxs{padding:0 20px;border-bottom: 1px solid #fff;}
.pay-box ul{padding-left:15px;}
.pay-box ul li{width:1185px;}
.pay-box .label{width:200px;float:left;height:30px;line-height:30px;}
.pay-box .txt{height:auto;line-height:30px;width:985px;float:left;color:#999999;}
.pay-sbox{border:1px solid #eeeeee;padding:5px 0px;}
.pay-sbox-head{border-bottom: 2px solid #ddd;line-height:35px;}
.pay-tip1{height:37px;width:760px;text-align: center;margin:10px auto;background: url(../img/pay_liucheng.png) no-repeat 0px -10px;background-size: cover; }
.pay-tip2{height:37px;width:760px;text-align: center;margin:10px auto;background: url(../img/pay_liucheng.png) no-repeat 0px -71px;background-size: cover; }
.pay-tip3{height:37px;width:760px;text-align: center;margin:10px auto;background: url(../img/pay_liucheng.png) no-repeat 0px -132px;background-size: cover; }
.pay-sbox .qrcode-box{min-height: 300px;height: auto;}
.pay-sbox .tips-box{line-height:35px;text-align: left;font-weight: bold;padding:5px 10px;}
.pay-sbox .qrcode-box .pbox{text-align: center;margin-top: 10px;font-weight: bold;}
.pay-sbox .wst-qrcode{width:260px;height:260px;text-align:center;margin:0 auto;}
.pay-sbox .wst-qrcode img{width:260px;height:260px;}
.pay-sbox .bnt-box{text-align:center;font-weight: bold;padding:5px 10px;line-height:50px;}
.pay-sbox .pay-type{line-height:35px;text-align: left;font-weight: bold;padding:5px 10px;}
.pay-sbox .pay-list{text-align: left;font-weight: bold;padding:5px 10px;}
.pay-sbox .succ-box{text-align: center;padding: 50px;}
.wst-payCode-weixinpays {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/weixinpays.png) no-repeat 0px 0px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.wst-payCode-weixinpays-curr {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/weixinpays.png) no-repeat 0px -75px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.wst-payCode-alipays {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/alipays.png) no-repeat 0px 0px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.wst-payCode-alipays-curr {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/alipays.png) no-repeat 0px -75px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.wst-payCode-wallets {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/wallets.png) no-repeat 0px 0px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.wst-payCode-wallets-curr {height:69px;width:167px;text-align: center;margin:10px auto;background: url(../img/wallets.png) no-repeat 0px -75px;background-size: cover;float: left;margin-right:10px;cursor:pointer;}
.pay-sbox{border:1px solid #eeeeee;padding:5px 0px;}
.pay-sbox .balance-box{min-height: 300px;height: auto;}
.pay-sbox .balance-box .pbox{text-align: center;padding-top: 40px;font-weight: bold;}
.pay-sbox .balance-box .pbox2{text-align: center;padding-top: 10px;font-weight: bold;}
.pbox-tip{color:#0ae;margin-left:10px;}
.pay-btn{background: #eb5f43 none repeat scroll 0 0;border: 1px solid #d33110;border-radius: 3px;color: #ffffff;cursor: pointer;outline: medium none;}
.pay-sbox .wst-pay-bnt {height:40px;width:132px;text-align: center;margin:10px auto;background: url(../img/btn_pay.png) no-repeat 0px 0px;cursor:pointer;}
.pay-sbox .wst-pay-bnt:hover {height:40px;width:132px;text-align: center;margin:10px auto;background: url(../img/btn_pay.png) no-repeat 0px -57px;cursor:pointer;}
.wst-wallet-box{border:1px solid #ddd;margin:10px;padding:5px;line-height: 35px;height:40px;}
.wst-wallet-box .wst-wallte-item{background:url("../img/icon_qianbaoyue.png") no-repeat;padding-left:30px;height:30px;margin-top:5px;float:left;}

/* ============================================
   新版入驻入口页（shop_join.html）- 仅影响 .sj-join-page
   ============================================ */
.sj-join-page{background:#f6f9ff;}
.sj-join-hero{position:relative;padding-bottom:26px;}
.sj-join-hero .wst-slide{position:relative;height:350px;overflow:hidden;top:0;z-index:0;border-bottom-left-radius:18px;border-bottom-right-radius:18px}
.sj-join-hero .wst-slide:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.12) 45%, rgba(0,0,0,.30) 100%);z-index:1;pointer-events:none}
.sj-join-hero .wst-slide-items li{position:relative}
.sj-join-hero .wst-slide-numbox{z-index:2}

.sj-join-card{position:relative;z-index:2;margin-top:-240px;background:rgba(255,255,255,.96);backdrop-filter: blur(8px);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.18);padding:26px 28px;overflow:hidden}
.sj-join-card:before{content:"";position:absolute;left:-120px;top:-120px;width:260px;height:260px;border-radius:50%;background:rgba(24,144,255,.10)}
.sj-join-card:after{content:"";position:absolute;right:-140px;bottom:-140px;width:320px;height:320px;border-radius:50%;background:rgba(24,144,255,.08)}

.sj-join-card-head{position:relative;z-index:1}
.sj-join-badge{display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;background:rgba(24,144,255,.10);color:#1890ff;font-weight:700;font-size:12px;letter-spacing:.4px}
.sj-join-title{margin:12px 0 6px 0;font-size:28px;line-height:1.2;font-weight:800;color:#111827}
.sj-join-subtitle{margin:0;color:#6b7280;font-size:13px}

.sj-join-actions{position:relative;z-index:1;margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}
.sj-btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;border-radius:12px;text-decoration:none;font-weight:700;font-size:14px;cursor:pointer;transition:all .2s ease}
.sj-btn-primary{background:#1890ff;color:#fff;box-shadow:0 12px 20px rgba(24,144,255,.25)}
.sj-btn-primary:hover{background:#40a9ff;transform:translateY(-1px)}
.sj-btn-ghost{background:#fff;color:#1890ff;border:1px solid rgba(24,144,255,.35)}
.sj-btn-ghost:hover{border-color:#1890ff;transform:translateY(-1px)}
.sj-btn-disabled{background:#eef2f7;color:#9ca3af;cursor:not-allowed}

.sj-join-hints{position:relative;z-index:1;margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sj-hint{border:1px solid #eef2f7;background:#fff;border-radius:14px;padding:14px 14px}
.sj-hint-title{font-weight:800;color:#111827;margin-bottom:6px}
.sj-hint-desc{color:#6b7280;font-size:13px;line-height:1.6}

.sj-join-tips{margin-top:18px}
.sj-tip-box{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #eef2f7;border-radius:16px;padding:16px 18px;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.sj-tip-icon{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#1890ff 0%,#40a9ff 100%);position:relative;flex:0 0 44px}
.sj-tip-icon:after{content:"";position:absolute;left:14px;top:12px;width:16px;height:20px;background:url(../img/ic_volume_24x24.png) no-repeat center/contain;filter:brightness(0) invert(1)}
.sj-tip-title{font-weight:800;color:#111827;margin-bottom:6px}
.sj-tip-text{color:#6b7280;font-size:13px;line-height:1.8}

.sj-join-section{margin-top:22px}
.sj-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:0 4px 10px 4px}
.sj-section-head h3{margin:0;font-size:18px;font-weight:900;color:#111827}
.sj-section-head p{margin:0;color:#6b7280;font-size:13px}

.sj-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sj-feature{background:#fff;border:1px solid #eef2f7;border-radius:16px;padding:18px 18px;box-shadow:0 12px 24px rgba(0,0,0,.06)}
.sj-feature-ico{width:44px;height:44px;border-radius:14px;margin-bottom:12px;position:relative;box-shadow:0 8px 18px rgba(59,191,205,.24)}
.sj-feature-ico:after{
  position:absolute;
  left:0;
  top:0;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
  font-weight:700;
  color:#fff;
}
.sj-i-1{background:linear-gradient(135deg,#3BBFCD 0%,#59ced9 100%)}
.sj-i-2{background:linear-gradient(135deg,#2f9ff4 0%,#67bef8 100%)}
.sj-i-3{background:linear-gradient(135deg,#30cfa7 0%,#67ddbf 100%)}
.sj-i-1:after{content:"≡"}
.sj-i-2:after{content:"⌕"}
.sj-i-3:after{content:"✓"}
.sj-feature-title{font-weight:900;color:#111827;margin-bottom:6px}
.sj-feature-desc{color:#6b7280;font-size:13px;line-height:1.7}

.sj-apply-tab{border-radius:16px;overflow:hidden;box-shadow:0 12px 24px rgba(0,0,0,.06);border:1px solid #eef2f7}
.sj-apply-tab .wst-tab-nav{border-left:none}
.sj-apply-tab .wst-tab-nav li{width:auto;min-width:120px;border-top:none;border-right:1px solid #eef2f7}
.sj-apply-tab .wst-tab-nav .on{border-top:none;color:#1890ff;border-bottom:2px solid #1890ff}
.sj-apply-tab .wst-tab-content{border:none;border-top:1px solid #eef2f7;background:#fff}

@media (max-width: 980px){
  .sj-join-card{margin-top:-200px}
  .sj-join-hints{grid-template-columns:1fr}
  .sj-feature-grid{grid-template-columns:1fr}
}

/* ============================================
   入驻流程页全新布局（仅作用于 join_step）
   ============================================ */
.join-step-modern{
  margin-top: 18px;
  margin-bottom: 26px;
  padding: 16px 18px 24px;
  border-radius: 18px;
  background:
    linear-gradient(130deg, rgba(59,191,205,.08) 0%, rgba(59,191,205,.02) 42%, transparent 42%),
    #f4f8fb;
  box-shadow: 0 16px 40px rgba(14,36,62,.08);
}
.join-step-modern .flow-container{
  border-radius: 16px;
  background: linear-gradient(100deg,#0e344f 0%, #0f3f58 45%, #1c7d87 100%);
  border: 0;
  padding: 18px 20px 14px;
  margin: 0 0 12px;
  box-shadow: 0 14px 36px rgba(8,36,56,.24);
}
.join-step-modern .flow-container::before{
  display: none !important;
}
.join-step-modern #stepflex{
  float: none !important;
  border-top: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  gap: 10px;
}
.join-step-modern #stepflex .step-item{
  position: relative;
  flex: 1 1 180px;
  min-width: 180px;
  max-width: none;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  padding: 10px 12px;
  min-height: 72px;
}
.join-step-modern #stepflex .step-wrapper{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-direction: row;
  justify-content: flex-start;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.join-step-modern #stepflex .step-number{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #5f7385;
  background: rgba(255,255,255,.84);
}
.join-step-modern #stepflex .step-item.step-current{
  border-color: rgba(59,191,205,.85);
  background: rgba(59,191,205,.22);
  box-shadow: 0 8px 18px rgba(59,191,205,.22);
}
.join-step-modern #stepflex .step-item.step-current .step-number{
  background: linear-gradient(135deg,#2eaebb,#3BBFCD);
  color: #fff;
}
.join-step-modern #stepflex .step-item.step-completed .step-number{
  background: linear-gradient(135deg,#32bf9c,#58d2b4);
  color: #fff;
}
.join-step-modern #stepflex .step-title{
  font-size: 14px;
  font-weight: 800;
  color: #f5fbff;
  margin: 0;
}
.join-step-modern #stepflex .step-badge{
  margin-top: 3px;
  display: inline-block;
  font-size: 11px;
  border-radius: 999px;
  padding: 1px 8px;
}
.join-step-modern #stepflex .step-badge-current{
  background: rgba(59,191,205,.28);
  color: #e7fdff;
}
.join-step-modern #stepflex .step-badge-completed{
  background: rgba(50,191,156,.26);
  color: #ebfff7;
}
.join-step-modern #stepflex .step-badge-pending{
  background: rgba(255,255,255,.16);
  color: rgba(245,251,255,.88);
}
.join-step-modern #stepflex .step-connector{
  display: none;
}
.join-step-modern .join-step-headline{
  margin: 14px 0 10px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(59,191,205,.14), rgba(59,191,205,.04));
  border: 1px solid rgba(59,191,205,.20);
}
.join-step-modern .main-head{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 24px;
  font-weight: 900;
  color: #17324d;
}
.join-step-modern .join-step-headline-sub{
  margin: 6px 0 0;
  color: #587089;
  font-size: 13px;
}
.join-step-modern .apply-box,
.join-step-modern .apply-box2{
  margin-top: 12px;
  background: #fff;
  border-radius: 16px;
  border: 1px solid #eaf1f6;
  box-shadow: 0 10px 28px rgba(15,35,61,.06);
  padding: 14px 16px;
}
.join-step-modern .agreement-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.join-step-modern .agreement-table tr{
  background: #f9fcff;
}
.join-step-modern .agreement-table th{
  width: 220px;
  color: #1f3f5c;
  font-weight: 700;
  background: #f2f8fc;
  border: 1px solid #e7f0f7;
  border-right: 0;
  border-radius: 10px 0 0 10px;
  padding: 14px 12px;
}
.join-step-modern .agreement-table td{
  border: 1px solid #e7f0f7;
  border-left: 0;
  border-radius: 0 10px 10px 0;
  padding: 12px 14px;
}
.join-step-modern .a-ipt{
  border: 1px solid #d7e5f0;
  border-radius: 10px;
  height: 38px;
  line-height: 38px;
  padding: 0 10px;
  transition: all .2s ease;
}
.join-step-modern textarea.a-ipt{
  height: auto;
  line-height: 1.7;
  padding: 10px;
}
.join-step-modern .a-ipt:focus{
  border-color: #3BBFCD;
  box-shadow: 0 0 0 3px rgba(59,191,205,.15);
}
.join-step-modern .upload-picker{
  border: 1px dashed #3BBFCD;
  color: #1f6072;
  border-radius: 10px;
  background: rgba(59,191,205,.08);
  padding: 8px 12px;
}
.join-step-modern .upload-picker:hover{
  background: rgba(59,191,205,.14);
}
.join-step-modern .agreement-bottom{
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #eaf1f6;
}
.join-step-modern .btn-submit{
  background: linear-gradient(90deg,#2eaebb,#3BBFCD);
  border-radius: 10px;
  border: 0;
}
.join-step-modern .btn-cancel{
  border-radius: 10px;
}
.join-step-modern .audit-rich-box{
  margin: 8px 0;
  padding: 18px;
  border-radius: 14px;
  background: linear-gradient(180deg,#f8fcff 0%,#f1f8fd 100%);
  border: 1px solid #e5f0f7;
}
.join-step-modern .audit-rich-head{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.join-step-modern .audit-state-icon{
  width: 64px;
  height: 64px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 10px;
}
.join-step-modern .audit-state-wait{background: linear-gradient(135deg,#2eaebb,#3BBFCD);}
.join-step-modern .audit-state-fail{background: linear-gradient(135deg,#f06a5f,#ff8a7c);}
.join-step-modern .audit-state-pass{background: linear-gradient(135deg,#2fbf9d,#57d3b7);}
.join-step-modern .audit-state-title{
  font-size: 24px;
  line-height: 1.25;
  font-weight: 900;
  color: #16344f;
}
.join-step-modern .audit-state-sub{
  margin-top: 8px;
  color: #5b748b;
  font-size: 14px;
}
.join-step-modern .audit-rich-grid{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
}
.join-step-modern .audit-rich-item{
  background: #fff;
  border: 1px solid #e5edf4;
  border-radius: 10px;
  padding: 10px 12px;
}
.join-step-modern .audit-rich-item-title{
  font-size: 12px;
  color: #72879a;
}
.join-step-modern .audit-rich-item-desc{
  margin-top: 5px;
  color: #213f5a;
  font-size: 13px;
  font-weight: 700;
}
.join-step-modern .audit-rich-fail .audit-state-title{color:#7b2c24;}
.join-step-modern .audit-rich-pass .audit-state-title{color:#1c5a4d;}

@media (max-width: 980px){
  .join-step-modern{padding: 10px}
  .join-step-modern .agreement-table th,
  .join-step-modern .agreement-table td{
    display: block;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e7f0f7;
  }
  .join-step-modern .agreement-table th{
    margin-bottom: 6px;
  }
  .join-step-modern .audit-rich-grid{
    grid-template-columns: 1fr;
  }
  .join-step-modern .audit-state-title{
    font-size: 19px;
  }
}