/* newui 共用 css start */
.card{
    box-shadow: none;
}

.newui-gray-text{
	color: #707070;
}

.newui-black-text{
	color: #131415;
}

.newui-button-text{
    color: #00a3ef;
    cursor: pointer;
}

.newui-button-danger-text{
    color: #DC3545;
    cursor: pointer;
}

html.dark-theme .newui-black-text{
    color: white;
}

html.dark-theme .newui-gray-text{
    color: #bfbfbf;
}

.newui-button{
    background-color: #00a3ef;
    color: white;
    cursor: pointer;
    box-sizing: content-box;
    display: inline-block;
}

.newui-button:hover{
    color: white;
    background-color: #4bb3e4;
}

.newui-wbutton{
    background-color: white;
    color: #212121;
    border: 1px solid #bdbdbd;
}

.newui-wbutton:hover{
    background-color: #d3d3d3;
    color: #212121;
}

.newui-button-halfcircle{
	padding: 0 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 15px;
	text-align: center;
}

.newui-button-radius{
    border-radius: 8px;
    text-align: center;
}

.newui-btext{
	font-weight: 700;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.newui-ltext{
    font-weight: 300;
}

.gold-vip{
    background: linear-gradient(45deg, #ffdf98, #ffc262);
    color: #6a2000;
}

/* 表格右上角菜单 */
.table-select{
    display: flex;
    align-items: center;
}

.table-select>div{
    display: inline-block;
    padding: 3px 8px;
    box-sizing: border-box;
    color: #707070;
    border: 1px solid #707070;
    border-right: none;
}

.table-select>div:first-of-type{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.table-select>div:last-of-type{
    border-right: 1px solid #707070;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.table-select>div.selected{
    background-color: #00a3ef;
    color: white;
    border-color: #00a3ef;
}

/* dark mode */
html.dark-theme .table-select>div{
    color: #bfbfbf;
}

.card-head-withmenu{
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.card-head-withmenu .card-title{
    font-size: 24px;
}

.card-head{
    font-size: 20px;
    margin-bottom: 12px;
}

.newui-input-groups{
    display: flex;
    flex-wrap: wrap;
}

.newui-input-groups-around{
    justify-content: space-around;
}

.newui-input-groups-between{
    justify-content: space-between;
}

.tri-icon{
    width: 0;
    height: 0;
    border: 6px solid #555;
}

.tri-down{
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}

.tri-up{
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}

.tri-left{
    border-top-color: transparent;
    border-left-color: transparent;
    border-bottom-color: transparent;
}

.tri-right{
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
}

li {
    list-style: none !important;
    list-style-type: none !important;
}

.newui-modal-header{
    padding: 18px 18px 0 18px;
    display: flex;
    justify-content: space-between;
}

.newui-modal-header>span .lni-close{
    cursor: pointer;
}

.newui-input{
    border: 1px solid #dddddd;
    outline: none;
    border-radius: 8px;
    padding: 3px 10px;
    width: 220px;
}

.select-title .el-input--suffix .el-input__inner{
    border: none;
    padding: 0;
    padding-right: 0;
    font-weight: 300;
}

.select-title .el-input__suffix{
    width: 15px;
}

.select-title .el-input__suffix-inner{
    width: 15px;
}

/* 多页面共用 .header-operate */
.header-operate{
    display: flex;
    align-items: center;
    z-index: 3;
}

.header-operate>span{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 30px;
    line-height: 30px;
    position: relative;
    background-color: #f4f4f4;
    cursor: pointer;
    border-radius: 8px;
    z-index: 1;
    margin-left: 15px;
    color: #555;
}

.header-operate>span>.tri-down{
    border-width: 4px;
    margin-top: 2px;
    margin-left: 8px;
}

.header-operate>span>.tri-up{
    border-width: 4px;
    margin-bottom: 2px;
    margin-left: 8px;
}

.header-operate>span:hover{
    background-color: #d5d5d5;
}

.header-operate>span>ul{
    position: fixed;
    top: 100vh;
    right: 0;
    background-color: white;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
    display: none;
    list-style: none; 
    padding-left: 0;
    border-radius: 3px;
    padding: 3px;
    margin-top: 1px;
}

.header-operate>span>ul>li{
    padding: 2px 6px;
    line-height: 18px;
}

.header-operate>span>ul>li.active{
    background-color: #939393;
}

.header-operate>span>ul>li:hover{
    background-color: #bdbdbd;
}

.header-title{
    font-size: 18px;
}

/* 多页面共用 account-time-select */
.account-time-select{
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding: 4px 8px;
    width: 335px;
    margin: 12px 0;
}

.account-time-select input{
    text-align: center;
    border: none;
    outline: none;
    width: 136px;
    margin: 0 7px;
}

.account-time-select i{
    font-size: 14px;
    color: #a7abb3;
}

.noborder-input{
    border: none;
    box-shadow: none;
    outline: none;
}

.no-spinner {
    -moz-appearance: textfield; /* firefox */
}

.no-spinner::-webkit-outer-spin-button,
.no-spinner::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* newui 共用 css end */

/* 个人中心 start */
.userinfocard{
    display: flex;
    justify-content: space-between;
    padding: 50px 30px;
    box-sizing: border-box;
}

.userinfocard .user-header{
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0,0,0,.1);
    margin-right: 30px;
    overflow: hidden;
}

.userinfocard .user-header img{
    width: 100%;
    height: auto;
}

.userinfocard .user-money{
    width: 1000px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
}

.table-select>div{
    cursor: pointer;
}

.userinfocard .info-line{
    width: 1px;
    height: 80px;
    background-color: rgba(0,0,0,.1);
}

/* dark ui */
html.dark-theme .userinfocard .info-line{
    background-color: rgba(255,255,255,.4);
}

.userinfocard .user-basic-info{
    display: flex;
    align-items: center;
    width: 450px;
}

.userinfocard .info-edit span{
    margin-right: 20px;
    font-size: 12px;
    cursor: pointer;
}

.userinfocard .user-name{
    display: flex;
    align-items: center;
}

.userinfocard .user-name>span:first-of-type{
    font-size: 22px;
    margin-right: 8px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.userinfocard .gold-vip{
    height: 20px;
    font-size: 12px;
    padding: 0 6px;
    border-radius: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.userinfocard .gold-vip i{
    margin-right: 4px;
}

@media (max-width:1600px) {
    .userinfocard .gold-vip{
        justify-content: center;
        padding: 0;
        border-radius: 50%;
        width: 20px;
    }

    .userinfocard .gold-vip>span{
        display: none;        
    }

    .userinfocard .gold-vip i{
        margin-right: 0;
    }
}

.userinfocard .user-money-main{
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-size: 12px;
}

.userinfocard .user-money-main .user-balance{
    margin-right: 36px;
}

.userinfocard .user-money-main .user-balance>div:first-of-type{
    font-size: 26px;
}

.userinfocard .newui-button{
    margin-top: 12px;
}

.userinfocard .user-sp-balance{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.userinfocard .user-sp-balance>div:first-of-type{
    margin-top: 5px;
    margin-bottom: 8px;
}

.userinfocard .user-sp-balance>div>span:first-of-type{
    margin-right: 8px;
}

.userinfocard .user-money>div:nth-of-type(3)>div:first-of-type,
.userinfocard .user-money>div:nth-of-type(5)>div:first-of-type{
    font-size: 26px;
}

#order-distribution .apexcharts-toolbar{
    display: none;
}

@media (max-width:1200px) {
    #user_center_container>div:nth-of-type(2){
        flex-wrap: wrap !important;
    }

    #user_center_container>div:nth-of-type(2)>div{
        width: 100% !important;
        height: auto !important;
    }

    .userinfocard{
        flex-wrap: wrap;
    }

    .userinfocard .user-basic-info{
        width: 100%;
        margin-bottom: 28px;
        justify-content: center;
    }
}

@media (max-width:762px) {
    .user-header{
        width: 80px;
        height: 80px;
    }

    .userinfocard .user-money>div:nth-of-type(2),
    .userinfocard .user-money>div:nth-of-type(4){
        display: none;
    }
}
/* 个人中心 end */

/* 基本资料 start */
#user-info-detail .user-header,
#user-info-detail .user-header .pre-box{
    display: flex;
    align-items: center;
    padding: 0 10px;
}

#user-info-detail .user-header-img{
    width: 100px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 16px;
    background-color: rgba(0,0,0,.1);
}

#user-info-detail .user-header-img img{
    width: 100%;
    height: auto;
}

#user-info-detail .newui-input-group{
    width: 30%; 
    margin-right: 1%;
    margin-bottom: 20px;
}  

#user-info-detail .newui-input-group>div:first-of-type,
#user-info-detail .com_address>div>div:first-of-type,
#user-info-detail .purchase-purpose>div:first-of-type{
    margin-bottom: 6px;
}

#user-info-detail .newui-input-group>div:last-of-type{
    width: 80%;
    min-width: 100px;
}

#user-info-detail .com_address{
    width: calc( 62% + 30% * 0.8 );
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

#user-info-detail .com_address>div{
    width: 49.5%;
}

#user-info-detail .address_select_group{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#user-info-detail .address_select_group>select{
    width: 32%;
    height: 40px;
    font-size: 14px;
    padding-left: 8px;
}

#user-info-detail .purchase-purpose{
    width: calc( 62% + 30% * 0.8 );
}

@media (max-width:1200px) {
    #user-info-detail .newui-input-group{
        width: 49%;
    } 
    
    #user-info-detail .newui-input-group>div:last-of-type{
        width: 90%;
        min-width: 100px;
    }

    #user-info-detail .com_address,
    #user-info-detail .purchase-purpose{
        width: calc( 50% + 49% * 0.9 );
    }
}

@media (max-width: 762px) {
    #user-info-detail .newui-input-group{
        width: 100%;
        margin-right: 0;
    }   

    #user-info-detail .newui-input-group>div:last-of-type{
        width: 100%;
        min-width: none;
    }

    #user-info-detail .com_address,
    #user-info-detail .purchase-purpose{
        width: 100%;
    }
}
/* 基本资料 end */

/* 收货地址 */
#receiving-address .address-boxs{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

#receiving-address .address-boxs .address-box{
    border: 1px solid #f0f0f0;
    border-radius: 12px;
    padding: 20px;
    box-sizing: border-box;
    position: relative;
    width: 49%;
    margin-top: 20px;
}

#receiving-address .address-boxs .address-box:hover{
    background-color: #e6f4fa;
}

#receiving-address .address-boxs .address-box:hover>div:first-of-type>div:last-of-type{
    display: inline-block !important;
}

#receiving-address .address-boxs .address-box>div:first-of-type>div:last-of-type{
    color: #555;
}

#receiving-address .address-box>div:first-of-type>div:last-of-type span{
    margin-right: 15px;
    cursor: pointer;
}

#receiving-address .address-box>div:first-of-type>div:last-of-type i{
    margin-right: 6px;
}

#receiving-address .address-box>div:last-of-type{
    color: #555;
}

#receiving-address .address-boxs .address-box .address-default{
    position: absolute;
    left: 20px;
    top: 0;
    background-color: #00a3ef;
    color: white;
    font-size: 10px;
    width: 30px;
    text-align: center;
}

#receiving-address .address-boxs .address-box .address-default::after{
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 3px solid #00a3ef;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom-color: 3px solid transparent;
    position: absolute;
    bottom: -3px;
    left: 0;
}

#receiving-address .address-boxs .address-box>div:first-of-type{
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#receiving-address .address-boxs .address-box>div:first-of-type>div:first-of-type{
    font-size: 18px;
}

#receiving-address .el-dialog{
    border-radius: 8px;
}

#receiving-address .dialog-header{
    font-size: 18px;
}

#receiving-address .address-ruleForm>div{
    display: flex;
    justify-content: space-between;
}

#receiving-address .input-title{
    margin-bottom: 6px;
}

#receiving-address .el-dialog__body{
    padding: 10px 20px;
}

#receiving-address .el-textarea__inner,
#receiving-address .el-input__inner{
    border-radius: 8px;
    padding: 10px 16px;
}

#receiving-address .address-select .el-form-item{
    width: 32%;
}

#receiving-address .address-select select{
    height: 40px;
    border-radius: 8px;
    width: 100%;
    font-size:12px;
}

#receiving-address select{
    outline: none !important;
    box-shadow: none !important;
}

@media (max-width: 762px) {
    #receiving-address .address-boxs .address-box{
        width: 100%;
    }
}
/* 收货地址 end */

/* 账号安全 start */
#safety-user .safety-user-main{
    padding: 20px; 
    display: flex; 
    justify-content: space-between;
}

#safety-user .safety-user-main>div{
    width: 50%;
    padding: 0 20px;
    box-sizing: border-box;
}

#safety-user .safety-user-main>div:first-of-type{
    border-right: 1px solid #e6e6e6;
    padding-left: 0;
}

#safety-user .safety-user-main>div:last-of-type{
    padding-left: 50px;
}

#safety-user .safety-user-main .card-title{
    font-size: 20px;
}

#safety-user .info-check{
    display: flex; 
    align-items: center; 
    margin-bottom: 40px; 
    width: 100%;
    justify-content: space-between;
    margin-left: 4px;
}

#safety-user .safety-icon{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #f0f0f0;
    position: relative;
    margin-right: 16px;
}

#safety-user .safety-icon .center-icon{
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 18px;
    font-weight: 900;
    transform: translate(-50%,-50%);
}

#safety-user .safety-icon .corner-icon{
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 18px;
}

#safety-user .safety-icon .success-icon{
    color: #00d000;
    background-color: white;
}

#safety-user .safety-icon .fail-icon{
    color: #ff001a;
    background-color: white;
}

#safety-user .safety-success-button,
#safety-user .safety-fail-button{
    display: inline-block;
    width: 120px;
    border-radius: 10px;
    font-size: 14px;
    padding: 6px 0;
    text-align: center;
    cursor: pointer;
}

#safety-user .safety-success-button{
    background-color: #00a3ef;
    color: white;
}

#safety-user .safety-fail-button{
    background-color: #ecfaff;
    color: #00a3ef;
}

/* 账号安全 end */

/* 子账户管理 start */
#sub-account-bind .account-bind-header .newui-button{
    display: inline-block;
    padding: 4px 16px;
    border-radius: 4px;
    margin-right: 10px;
}

#sub-account-bind .account-bind-header .newui-button:nth-of-type(2){
    background-color: #e1f8ff;
    color: #00a3ef;
}

#sub-account-bind .account-bind-header .newui-button:nth-of-type(2):hover{
    background-color: #b3edff;
}

/* 子账户管理 end */

/* 云盘文件 start */
#panfiles .panfiles-upload,
#panfiles .panfiles-openftp-upload{
    width: 130px;
    height: 40px;
    line-height: 40px;
    border-radius: 8px;
    margin-right: 12px;
    text-align: center;
}

#panfiles .panfiles-openftp-upload{
    background-color: #ff3d49;
}

#panfiles .panfiles-openftp-upload:hover{
    background-color: #ff636d;
}

/* 云盘文件 end */

/* ftp 上传 start */
.ftp-upload-window{
    padding: 30px;
    width: 60%;
    height: 70%;
    border-radius: 8px;
    background-color: white;
}

@media (max-width: 762px) {
    .ftp-upload-window{
        width: 90%;
    }
}

.ftp-upload{
    background-color: rgba(0,0,0,.8);
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 99;
}

.ftp-upload .newui-button{
    padding: 5px 18px;
    margin: 20px 0 10px 0;
    border-radius: 8px;
}

/* ftp 上传 end */

/* 我的结算单 start */
#settlement-statement .param-title .tri-icon{
    border-width: 4px;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%) translateY(2px);
    cursor: pointer;
}
/* 我的结算单 end */

/* api订单 start */
#api-order #erp_apiOrderList_filter,
#api-order #erp_apiOrderList_info,
#api-order #erp_apiOrderList_paginate{
    display: none !important;
}

/* api订单 end */

/* 极速订单 start */
#fast-orders .dt-buttons.btn-group,
#fast-orders #myFastorderList_filter,
#fast-orders #myFastorderList_info,
#fast-orders #myFastorderList_paginate{
    display: none !important;
}
/* 极速订单 end */

/* 商品询价 start */
#goods-consults .dt-buttons.btn-group,
#goods-consults #goodsconsults_filter,
#goods-consults #goodsconsults_info,
#goods-consults #goodsconsults_paginate{
    display: none !important;
}
/* 商品询价 end */

/* 报价记录 start */
#customer-quotation .dt-buttons.btn-group,
#customer-quotation #erp_customer_quotation_filter,
#customer-quotation #erp_customer_quotation_info,
#customer-quotation #erp_customer_quotation_paginate{
    display: none !important;
}

/* 报价记录 end */

/* 账户余额 start */
#personal-account #accountbalance_filter,
#personal-account .dt-buttons.btn-group,
#personal-account #accountbalance_info,
#personal-account #accountbalance_paginate{
    display: none !important;
}

#personal-account .personal-money{
    background-image: url("/img/personal-account-bg.png");
    background-size: 100% 140px;
    background-repeat: no-repeat;
    height: 140px;
    border-radius: 14px;
    overflow: hidden;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

#personal-account .personal-money div{
    text-align: center;
    color: white;
}

#personal-account .personal-money>div>div:first-of-type{
    font-size: 26px;
    margin-bottom: 6px;
}

#personal-account .personal-money>div>div:last-of-type{
    font-size: 14px;
}

#personal-account .table-responsive{
    overflow: hidden;
}

/* 账户余额 end */

/* 在线充值 start */
#account-recharge .recharge-card{
    border: 1px solid #dfdfdf;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 110px;
    border-radius: 8px;
    margin-right: 16px;
    margin-bottom: 20px;
    cursor: pointer;
}

#account-recharge .recharge-card>div:first-of-type{
    margin-bottom: 4px;
}

#account-recharge .recharge-card.selected,
#account-recharge .recharge-card:hover{
    border-color: #61b9e2;
    background-color: #f3fbff;
}

#account-recharge .recharge-card:hover>input,
#account-recharge .recharge-card.selected>input{
    background-color: #f3fbff;
}


#account-recharge .recharge-card.selected>div:first-of-type,
#account-recharge .recharge-card:hover>div:first-of-type{
    color: #00a3ef;
}

#account-recharge .recharge-button{
    padding: 8px 40px; 
    border-radius: 6px;
    margin-right: 30px;
}

#account-recharge .recharge-customize>input{
    width: 80%;
    font-size: 22px;
    text-align: center;
}

#account-recharge .bootstrap-select,
#account-recharge #rechargeList_info,
#account-recharge #rechargeList_filter,
#account-recharge #rechargeList_paginate{
    display: none !important;
}

/* 在线充值 end */

/* 领取优惠券 start */
#get-coupons .coupon-card{
    width: 30%;
    margin-right: 3%;
    border-radius: 8px;
    margin-bottom: 30px;
    position: relative;
    background: linear-gradient(90deg, #fdf5f6, #fff1f9);
    color: #666666;
}

#get-coupons .coupon-card .coupon-main{
    margin: 0 20px;
    padding: 18px 0 10px;
    border-bottom: 1px solid #ffe1e6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#get-coupons .coupon-card .coupon-top{
    position: relative;
}

#get-coupons .coupon-card .coupon-top::before,
#get-coupons .coupon-card .coupon-top::after{
    position: absolute;
    content: "";
    bottom: 0;
    background-color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
}

html.dark-theme #get-coupons .coupon-card .coupon-top::before,
html.dark-theme #get-coupons .coupon-card .coupon-top::after{
    background-color: #343a40;
}

#get-coupons .coupon-card .coupon-top::before{
    left: 0;
    transform: translate(-50%,50%);
}

#get-coupons .coupon-card .coupon-top::after{
    right: 0;
    transform: translate(50%,50%);
}

#get-coupons .coupon-card .coupon-title{
    margin-bottom: 8px;
    font-size: 20px;
    color: #212121;
}

#get-coupons .coupon-bonus{
    color: #ff5353;
}

#get-coupons .coupon-bonus>span{
    font-size: 36px;
}

#get-coupons .coupon-bottom{
    position: relative;
    padding: 12px 10px;
}

#get-coupons .coupon-bottom .coupon-getbtn{
    position: absolute;
    right: 20px;
    top: 50%;
    background-color: #ff5353;
    color: white;
    border-radius: 6px;
    transform: translateY(-50%);
    padding: 2px 18px;
}

#get-coupons .coupon-bottom .coupon-getbtn:hover{
    background-color: #ff8585;
}

@media (max-width: 1200px) {
    #get-coupons .coupon-card{
        width: 45%;
    }
}

@media (max-width: 762px) {
    #get-coupons .coupon-card{
        width: 95%;
    }
}

/* 领取优惠券 end */

/* 意见反馈 start */
#user-feedback input{
    padding: 20px 15px;
    font-size: 14px;
}

#user-feedback textarea{
    padding: 8px 15px;
    font-size: 14px;
}

#user-feedback input::placeholder,
#user-feedback textarea::placeholder{
    color: #aaa;
    opacity: 1; /* 确保在Firefox中正常显示 */
}

/* 意见反馈 end */


/* 左侧菜单 start */
.sidebar-wrapper {
    width: 240px;
}

.sidebar-wrapper .metismenu a .parent-icon {
    font-size: 15px;
}

.sidebar-wrapper .metismenu a{
    border: none;
}

.metismenu .has-arrow:after{
    transform: rotate(45deg) translateY(-50%);
}

.sidebar-wrapper #menu ul{
    background-color: transparent !important;
}

.sidebar-wrapper .metismenu ul{
    border: none;
}

.sidebar-wrapper .metismenu>.mm-active>a,
.sidebar-wrapper .metismenu a:focus{
    background-color: transparent;
}

.sidebar-wrapper .metismenu>li>ul>.mm-active>a,
.sidebar-wrapper .metismenu a:hover,
.sidebar-wrapper .metismenu>li>ul>.mm-active>ul>li.mm-active>a{
    background: linear-gradient(90deg, #bfebff, white);
    color: #00a3ef;
    border-radius: 8px;
}

#menu>li>ul>li>a{
    padding-left: 30px;
}

#menu>li>ul>li>ul>li>a{
    padding-left: 45px;
}

.sidebar-wrapper{
    box-shadow: none;
}

.category-menu-detail{
    flex-direction: column;
    max-width: 600px;
    left: 240px;
}

/* 左侧菜单 end */

/* 上边栏 start */
.top-header .top-header-right{
    display: flex;
    align-items: center;
}

.top-header .user-header-area{
    width: 48px;
    height: 48px;
    position: relative;
}

.top-header .user-header-area .gold-vip{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 16px;
    height: 16px;
    font-size: 10px;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    border: 1px solid white;
}

.top-header .user-header{
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0,0,0,.1);
    position: relative;
    margin-right: 10px;
    overflow: hidden;
}

.top-header .user-header img{
    width: 100%;
    height: auto;
}

.top-header .dropdown-item{
    display: flex;
    align-items: center;
}

.top-header .dropdown-item>i{
    margin-right: 14px;
}

.top-header .top-header-right .newui-button{
    margin-right: 16px;
}

.top-header .top-header-right-menu{
    display: flex;
    width: 350px;
    justify-content: space-around;
    align-items: center;
    margin-right: 30px;
}

.top-header .top-header-right-menu span{
    width: 1px;
    height: 14px;
    background-color: #777777;
}

.top-header .top-header-right-menu div{
    color: #777777;
    font-size: 14px;
    cursor: pointer;
}

.top-header .top-header-right-menu div:hover{
    color: #b9b9b9;
}

@media (max-width:1200px) {
    .top-header .top-header-right-menu{
        display: none;
    }
}

.top-header .left-topbar{
    width: 220px;
}

@media screen and (max-width: 1280px) {
	.top-header .left-topbar{
		width: auto;
	}
}

.top-header .top-header-main-menu{
    height: 60px;
}

.top-header .top-header-main-menu>span{
    display: inline-block;
    padding: 0 22px;
    color: #777777;
    position: relative;
    cursor: pointer;
    height: 100%;
    line-height: 60px;
}

.top-header .top-header-main-menu>span.selected,
.top-header .top-header-main-menu>span:hover{
    color: #00a3ef;
}

/*.top-header .top-header-main-menu>span.selected::after,*/
/*.top-header .top-header-main-menu>span:hover::after{*/
/*    content: "";*/
/*    position: absolute;*/
/*    bottom: 0;*/
/*    left: 50%;*/
/*    width: 30px;*/
/*    height: 5px;*/
/*    border-top-left-radius: 8px;*/
/*    border-top-right-radius: 8px;*/
/*    transform: translate(-50%,-2px);*/
/*    background-color: #00a3ef;*/
/*}*/

@media (max-width:1000px) {
    .top-header .top-header-main-menu>span{
        padding: 0 8px;
    }
}

@media (max-width:762px) {
    .top-header .top-header-right .newui-button{
        display: none;
    }
}

@media (max-width:650px) {
    .top-header .top-header-main-menu>span:nth-of-type(3),
    .top-header .top-header-main-menu>span:nth-of-type(4),
    .top-header .top-header-main-menu>span:nth-of-type(5){
        display: none;
    }
}

.top-header{
    box-shadow: none;
}
/* 上边栏 end */

/* 浮动右侧边栏 start */
.float-menu{
    position: fixed;
    right: 0;
    top: 50%;
    /*transform: translateY(-55%) translateX(100%);*/
    transform: translateY(-55%);
    border: 1px solid #f5f5f5;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    z-index: 11;
    background-color: white;
    transition: .3s all ease-in-out;
    box-shadow: 0 0 2px rgba(0,0,0,.1);
}

.float-menu>.open-float-menu{
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-100%,-50%);
    background-color: #00a3ef;
    color: white;
    width: 14px;
    font-size: 12px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    transition: .3s all ease-in-out;
    cursor: pointer;
}

.float-menu>.open-float-menu>i{
    color: white;
}

.float-menu>div{
    padding: 15px;
}

.float-menu>div>div{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px;
    cursor: pointer;
}

.float-menu>div:hover{
    color: #00a3ef;
}

.float-menu>div>div>div:first-of-type{
    margin-bottom: 5px;
    position: relative;
}

.float-menu>div>div>div:first-of-type>span{
    position: absolute;
    right: 0;
    top: 0;
    transform: translate(50%,-50%);
    color: white;
    width: 18px;
    height: 18px;
    font-size: 12px;
    border-radius: 50%;
    background-color: #ff1f33;
    text-align: center;
    line-height: 18px;
}

.float-menu>div>div>div>i{
    font-size: 22px;
}

.float-menu .dropdown-menu{
    border-radius: 8px;
    overflow: hidden;
}

/* 浮动右侧边栏 end */

/* 登录/注册 start */
#newui-login-register{
    width: 90%;
    background: linear-gradient(#d0e5ff 0px,white 50px);
    border-radius: 12px;
    position: relative;
}

#newui-login-register .login-register-close{
    background-color: white;
    color: #777777;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 103%;
    top: -12px;
    border-radius: 50%;
    text-align: center;
    cursor: pointer;
}

#newui-login-register .login-register-header{
    display: flex;
    height: 50px;
    align-items: center;
    font-size: 16px;
    color: #666666;
}

#newui-login-register .login-register-header>span{
    width: 50%;
    height: 100%;
    line-height: 50px;
    text-align: center;
    position: relative;
}

#newui-login-register .login-register-header>.active>span{
    position: absolute;
    width: 100%;
    height: 50px;
    line-height: 50px;
    left: 0;
    top: 0;
    background-color: white;
    text-align: center;
    display: inline-block;
    font-size: 22px;
    color: black;
}

#newui-login-register .login-register-header>.active>span::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    height: 16px;
    width: 100%;
    transform: translateY(-100%);
    background-color: white;
    display: inline-block;
}

#newui-login-register .login-register-header>.active-login>span::after{
    content: "";
    position: absolute;
    width: 10px;
    height: calc( 100% + 16px );
    background-color: white;
    clip-path: polygon(0 8px, 0 100%, 100% 100%);
    right: 0;
    top: 0;
    transform: translate(100% , -16px);
}

#newui-login-register .login-register-header>.active-register>span::after{
    content: "";
    position: absolute;
    width: 10px;
    height: calc( 100% + 16px );
    background-color: white;
    clip-path: polygon(0 100%, 100% 100%, 100% 8px);
    left: 0;
    top: 0;
    transform: translate(-94% , -16px);
}

#newui-login-register .login-register-header>.active>span>span{
    position: relative;
}

#newui-login-register .login-register-header>.active>span>span::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 2px;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,#007eff 0%,white 90%);
}

#newui-login-register .login-register-header.reset-header,
#newui-login-register .login-register-header.reset-header>span{
    width: 100%;
    font-size: 20px;
}

#newui-login-register .login-register-header.reset-header>span{
    position: relative;
}

#newui-login-register .login-register-header.reset-header>span>span{
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    font-weight: 300;
}

#newui-login-register .login-register-body{
    padding: 30px;
}

#newui-login-register .login-register-body .login-input{
    position: relative;    
    margin-bottom: 20px;
}

#newui-login-register .login-body .login-input:nth-of-type(2){
    margin-bottom: 8px;
}

#newui-login-register .login-register-body .login-input i{
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #888;
}

#newui-login-register .login-register-body .login-input input{
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 10px 10px 10px 46px;
    width: 100%;
}

#newui-login-register .login-register-body .verifycode-input{
    display: flex;
    justify-content: space-between;
}

#newui-login-register .login-register-body .verifycode-input input{
    width: 60%;
}

#newui-login-register .login-register-body .verifycode-input #remaintimer{
    width: 38%;
    color: #00a3ef;
    background-color: #d6f5ff;
    text-align: center;
    padding: 8px 0;
    border-radius: 8px;
    box-sizing: border-box;
    cursor: pointer;
}

#newui-login-register .login-register-body .login-forget{
    color: #777;
    cursor: pointer;
    margin-bottom: 20px;
    display: inline-block;
}

#newui-login-register .login-register-body .login-forget:hover{
    color: #00a3ef;
}

#newui-login-register .login-register-body .login-button{
    border-radius: 8px;
    width: 100%;
    display: inline-block;
    text-align: center;
    padding: 8px 0;
    margin-bottom: 10px;
}

#newui-login-register .login-register-body .login-other-title{
    margin: 16px auto 16px;
    text-align: center;
    color: #777;
}

#newui-login-register .login-register-body .login-other{
    margin: 0 auto 10px;
    width: 60%;
    display: flex;
    justify-content: space-around;
}
/* 登录/注册 end */

/* 报价页面 start */
.goods-info{
    display: flex; 
    justify-content: space-between; 
    align-items: center;
    height: 100px;
    padding-bottom: 10px;
}

@media screen and (max-width: 762px) {
    .goods-info{
        flex-wrap: wrap;
    }
    
    .goods-info>div{
        width: 100%;
    }
}

.goods-info .goods-info-main{
    display: flex;
    align-items: center;
}

.goods-info .goods-info-main .goods-info-img{
    width: 60px;
    height: 60px;
    border-radius: 12px;
    overflow: hidden;
    margin-right: 12px;
}

.goods-info .goods-info-main .goods-info-img>img{
    width: 100%;
    height: auto;
}

.nav-tabs .nav-link {
    border: none;
    background-color: transparent;
    color: #777777;
    position: relative;
    cursor: pointer;
    height: 40px;
}

.nav-tabs .nav-link.active{
    position: relative;
    background: none;
    font-weight: 900;
}

.nav-tabs .nav-link.active::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 30px;
    height: 5px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    transform: translateX(-50%);
    background-color: black;
}

#myTab{
    border-bottom: none;
    position: relative;
}

#myTab::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,1px);
    width: calc( 100% + 2.5rem);
    height: 1px;
    background-color: #f5f5f5;
}

.tab-goods>.row>.form-body>.form-group>.col-form-label,
.tab-goods>.row>.form-body>div>.form-group>.col-form-label,
.tab-goods>.row>.form-body>div>div>.form-group>.col-form-label{
    text-align: center;
    background-color: #f1f1f1;
    color: #555;
    border-radius: 6px;
    max-height: 35px;
}

.placeorders_goods2 .tabs-main .tab-goods .form-body .form-group{
    margin-bottom: 0px;
}

.placeorders_goods2 .tabs-main .tab-goods .form-body .form-group>label{
    margin-right: 10px;
}

.placeorders_goods2 .mySelect{
    height: 33px;
    line-height: 33px;
    border: 1px solid #cccccc85;
    border-radius: 6px;
    padding: 0 4px;
}

.RadioStyle label{
    padding: 5px 16px !important;
    margin-right: 12px;
    border-radius: 6px;
    margin-bottom: 8px;
    border-color: #cccccc85;
}

#productQTYMain0Price+label{
    padding: 5px 16px !important;
    margin-right: 12px;
    border-radius: 6px;
    margin-bottom: 8px;
    border-color: #cccccc85;
}

.goods_number input + label,
#productQTYMain0Price+label,
#productQTYMainDiffPrice+label{
    min-width: 160px;
    font-size: 16px;
}

.RadioStyle input:checked + label,
.placeorders_goods2 .mySelect.select-selected,
.RadioStyle input:checked + label>span{
    background: none;
    background-color: #00a3ef0a;
    border-color: #00a3ef72 !important;
}

.RadioStyle label>span{
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 2px;
}

.RadioStyle label>span>img{
    width: 100%;
    height: 100%;
}

.RadioStyle label>span>i{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    display: none;
    cursor: pointer;
    color: #212121;
}

.RadioStyle label>span:hover>i{
    display: inline-block;
}

.dropdown.bootstrap-select.mts{
    position: relative;
}

.dropdown.bootstrap-select.mts>span,
.more_choose>span{
    position: absolute;
    left: 8px;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
}

.dropdown.bootstrap-select.mts>span>img,
.more_choose>span>img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.dropdown.bootstrap-select.mts>span>i,
.more_choose>span>i{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    display: none;
    cursor: pointer;
    font-size: 14px;
}

.dropdown.bootstrap-select.mts>span:hover>i,
.more_choose>span:hover>i{
    display: inline-block;
}

.dropdown.bootstrap-select.mts{
    height: 33px !important;
    /* border: 1px solid #cccccc85 !important; */
    border-radius: 6px !important;
}

.dropdown.bootstrap-select.mts button{
    height: 31px;
    background-color: transparent;
    border-radius: 6px;
}

.more_choose{
    display: inline-block;
    position: relative;
}

.RadioStyle input[type='checkbox']:checked + label{
    background: none;
    background-color: #00fff70a;
    border-color: #00d7ef72;
    color: #00d7ef;
}

.btn-group.btn-group-toggle{
    margin-right: 16px;
}

.btn-group.btn-group-toggle>button,
.btn-group.btn-group-toggle>input,
.btn-group.btn-group-toggle>span>input{
    height: 33px !important;
}

.btn-group.btn-group-toggle>button{
    padding: 0 !important;
    line-height: 33px !important;
    text-align: center !important;
    font-size: 20px !important;
    background: none;
    width: 28px;
    color: #212121;
    border: 1px solid #ced4da;
}

.btn-group.btn-group-toggle>button[value='+']{
    border-radius: 0 6px 6px 0 !important;
}

.btn-group.btn-group-toggle>button[value='-']{
    border-radius: 6px 0 0 6px !important;
}

.user_select_option_div{
    margin-bottom: 0 !important;
}

.user_select_option_div>label{
    background-color: transparent !important;
}

#goods_params_btn_dynamic{
    margin-top: 12px;
}

.goods-info-box{
    background-color: #fff6ef !important;
}

.goods_number input[name='productQTYMain']+label{
    position: relative;
    margin-top: 0;
    margin-bottom: 70px !important;
    box-sizing: border-box;
}

.goods_number input[name='productQTYMain']+label>span{
    display: none;
    position: absolute;
    min-width: calc(100% + 2px);
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border: 1px solid #cccccc85;
    height: auto;
    padding: 8px 12px !important;
    font-size: 12px;
    margin: 0;
    box-sizing: border-box;
}

.productQTYMainDropdonw{
    height: 33px;
}

.price_compare>div:nth-of-type(2){
    color: #a7abb3 !important;
}

#preparelistTable thead>tr>th{
    background-color: #f6f6f6;
    border: none;
}

#preparelistTable tbody>tr>td{
    border: none;
    border-bottom: 1px solid #e3e3e3;
    height: 80px;
}

#preparelistTable thead>tr>th:nth-of-type(3),
#preparelistTable thead>tr>th:nth-of-type(4),
#preparelistTable thead>tr>th:nth-of-type(5),
#preparelistTable thead>tr>th:nth-of-type(6),
#preparelistTable thead>tr>th:nth-of-type(7),
#preparelistTable thead>tr>th:nth-of-type(8),
#preparelistTable tbody>tr>td:nth-of-type(3),
#preparelistTable tbody>tr>td:nth-of-type(4),
#preparelistTable tbody>tr>td:nth-of-type(5),
#preparelistTable tbody>tr>td:nth-of-type(6),
#preparelistTable tbody>tr>td:nth-of-type(7),
#preparelistTable tbody>tr>td:nth-of-type(8)
{
    width: 150px;
}

@media screen and (max-width:1800px) {
    #preparelistTable thead>tr>th:nth-of-type(3),
    #preparelistTable thead>tr>th:nth-of-type(4),
    #preparelistTable thead>tr>th:nth-of-type(5),
    #preparelistTable thead>tr>th:nth-of-type(6),
    #preparelistTable thead>tr>th:nth-of-type(7),
    #preparelistTable thead>tr>th:nth-of-type(8),
    #preparelistTable tbody>tr>td:nth-of-type(3),
    #preparelistTable tbody>tr>td:nth-of-type(4),
    #preparelistTable tbody>tr>td:nth-of-type(5),
    #preparelistTable tbody>tr>td:nth-of-type(6),
    #preparelistTable tbody>tr>td:nth-of-type(7),
    #preparelistTable tbody>tr>td:nth-of-type(8)
    {
        width: 120px;
    }
}

@media screen and (max-width:1600px) {
    #preparelistTable thead>tr>th:nth-of-type(3),
    #preparelistTable thead>tr>th:nth-of-type(4),
    #preparelistTable thead>tr>th:nth-of-type(5),
    #preparelistTable thead>tr>th:nth-of-type(6),
    #preparelistTable thead>tr>th:nth-of-type(7),
    #preparelistTable thead>tr>th:nth-of-type(8),
    #preparelistTable tbody>tr>td:nth-of-type(3),
    #preparelistTable tbody>tr>td:nth-of-type(4),
    #preparelistTable tbody>tr>td:nth-of-type(5),
    #preparelistTable tbody>tr>td:nth-of-type(6),
    #preparelistTable tbody>tr>td:nth-of-type(7),
    #preparelistTable tbody>tr>td:nth-of-type(8)
    {
        width: 100px;
    }
}

@media screen and (max-width:1400px) {
    #preparelistTable thead>tr>th:nth-of-type(3),
    #preparelistTable thead>tr>th:nth-of-type(4),
    #preparelistTable thead>tr>th:nth-of-type(5),
    #preparelistTable thead>tr>th:nth-of-type(6),
    #preparelistTable thead>tr>th:nth-of-type(7),
    #preparelistTable thead>tr>th:nth-of-type(8),
    #preparelistTable tbody>tr>td:nth-of-type(3),
    #preparelistTable tbody>tr>td:nth-of-type(4),
    #preparelistTable tbody>tr>td:nth-of-type(5),
    #preparelistTable tbody>tr>td:nth-of-type(6),
    #preparelistTable tbody>tr>td:nth-of-type(7),
    #preparelistTable tbody>tr>td:nth-of-type(8)
    {
        width: 80px;
    }
}

@media screen and (max-width:1200px) {
    #preparelistTable thead>tr>th:nth-of-type(3),
    #preparelistTable thead>tr>th:nth-of-type(4),
    #preparelistTable thead>tr>th:nth-of-type(5),
    #preparelistTable thead>tr>th:nth-of-type(6),
    #preparelistTable thead>tr>th:nth-of-type(7),
    #preparelistTable thead>tr>th:nth-of-type(8),
    #preparelistTable tbody>tr>td:nth-of-type(3),
    #preparelistTable tbody>tr>td:nth-of-type(4),
    #preparelistTable tbody>tr>td:nth-of-type(5),
    #preparelistTable tbody>tr>td:nth-of-type(6),
    #preparelistTable tbody>tr>td:nth-of-type(7),
    #preparelistTable tbody>tr>td:nth-of-type(8)
    {
        width: 60px;
    }
}

@media screen and (max-width:762px) {
    #preparelistTable thead>tr>th:nth-of-type(3),
    #preparelistTable thead>tr>th:nth-of-type(4),
    #preparelistTable thead>tr>th:nth-of-type(5),
    #preparelistTable thead>tr>th:nth-of-type(6),
    #preparelistTable thead>tr>th:nth-of-type(7),
    #preparelistTable thead>tr>th:nth-of-type(8),
    #preparelistTable tbody>tr>td:nth-of-type(3),
    #preparelistTable tbody>tr>td:nth-of-type(4),
    #preparelistTable tbody>tr>td:nth-of-type(5),
    #preparelistTable tbody>tr>td:nth-of-type(6),
    #preparelistTable tbody>tr>td:nth-of-type(7),
    #preparelistTable tbody>tr>td:nth-of-type(8)
    {
        width: 40px;
    }

    .progress-wrapper{
        flex-direction: column;
    }
}

.file-deleteall{
    padding: 5px 20px;
    border-radius: 6px;
    background-color: #f6f6f6;
    cursor: pointer;
    color: #343a40;
}

.file-deleteall:hover{
    background-color: #e3e3e3;
}

.footer_main{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
}

#goods_params_btn_static{
    margin-right: 16px;
    color: #00a3ef;
}

#goods_price_btn_begin,
#img_flying,
#btn_buynow{
    border-radius: 6px;
    font-size: 1rem;
    padding: 6px 26px;
    font-weight: 900;
}

#img_flying:disabled,
#btn_buynow:disabled{

}

#goods_price_btn_begin{
    margin-right: 16px;
    color: #00a3ef;
    border-color: #00a3ef;
}

#goods_price_btn_begin:hover{
    color: white;
    background-color: #00a3ef;
}

#img_flying{
    background-color: #00a3ef;
    color: white;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#img_flying:hover{
    background-color: #00a3efb7;
}

#img_flying:disabled:hover{
    background-color: #00a3ef;
}

#btn_buynow{
    background-color: #ffad00;
    color: white;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#btn_buynow:hover{
    background-color: #ffae00b7;
}

#btn_buynow:disabled:hover{
    background-color: #ffae00;
}

@media screen and (max-width: 520px) {
    #btn_buynow{
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }
}

.service_call_us{
    /*height: 300px;*/
    height: 180px;
    width: 100%;
    background-color: white;
    position: sticky;
    left: 0;
    bottom: 0;
    padding: 1.25rem 1.5rem;
    color: #555;
}

.wrapper.toggled .service_call_us{
    display: none;
}

.service_call_us_title{
    font-size: 22px;
    margin-bottom: 8px;
    margin-top: 8px;
}

.service_call_us_phone{
    font-size: 20px;
    margin-bottom: 10px;
}

.service_call_us_phone:nth-of-type(3){
    margin-bottom: 16px;
}

.service_call_us_phone>i{
    margin-right: 12px;
}

.service_call_us>span>a{
    color: #999 !important;
}

/* 隐藏 SimpleBar 的滚动条轨道和滑块 */
.simplebar-scrollbar {
    display: none !important;
}

/* 如果还想隐藏轨道（可选） */
.simplebar-track {
    display: none !important;
}

.simplebar-content-wrapper{
    overflow: -moz-scrollbars-none; /* Firefox 旧版，但请注意，这个属性可能已经不被最新版本支持 */
    scrollbar-width: none; /* Firefox 64+ */
}

.simplebar-content-wrapper::-webkit-scrollbar{
    display: none;
    width: 0;
    height: 0;
    background: transparent;
}

.category-menu{
    padding: 12px 1.5rem;
    position: relative;
}

.category-menu::before,
.category-menu::after{
    content: "";
    position: absolute;
    left: 0;
    background: #fff;
    display: inline-block;
    width: 100%;
    height: 6px;
}

.category-menu::before{
    top: 0;
    border-bottom-right-radius: 6px;
}

.category-menu::after{
    bottom: 0;
    border-top-right-radius: 6px;
}

.category-menu:hover{
    background: #DAF0FB;
}

.category-menu:hover>a>div{
    color: #00a4ff;
}

.category-menu>a{
    display: flex;
    align-items: center;
    color: #212121;
}

.category-menu>a>div{
    margin-right: 16px;
}

.category-menu .menu-title{
    font-size: 16px;
}

.wrapper.toggled .category-menu .menu-title{
    display: none;
}

.wrapper.toggled.sidebar-hovered .category-menu .menu-title{
    display: inline-block;
}

.category-menu>.category-menu-detail{
    display: none;
    position: fixed;
    /*width: calc( 100vw - 240px - 300px );*/
    width: calc( 100vw - 240px - 180px );
    left: calc( 240px );
    top: 60px;
    height: calc( 100vh - 60px );
    overflow-y: auto;
    background-color: white;
    z-index: 9;
    box-shadow: 10px 0 10px rgba(0,0,0,.1);
    border-left: 1px solid #DAF0FB;
}

.category-menu>.category-menu-detail>div:first-of-type{
    margin: 30px 20px 20px;
    padding-bottom: 12px;
    color: #212121;
    border-bottom: 1px dashed rgba(0,0,0,.2);
}

.category-menu>.category-menu-detail>div:last-of-type{
    margin: 0 20px;
    display: flex;
    flex-wrap: wrap;
}

.category-menu>.category-menu-detail>div:last-of-type>span{
    margin: 3px 4px 12px;
    width: 130px;
    display: inline-block;
}

.category-menu>.category-menu-detail>div:last-of-type>span>a{
    color: #212121;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.category-menu>.category-menu-detail>div:last-of-type>span>a:hover{
    color: #333b42;
}

.category-menu>.category-menu-detail>div:last-of-type>span>a>img{
    border-radius: 5px;
}

@media screen and (max-width: 1200px) {
    .category-menu>.category-menu-detail {
        max-height: 50vh;
        padding: 20px;
        border-radius: 12px;
        box-shadow: none;
    }

    .category-menu>.category-menu-detail>div:first-of-type{
        margin: 3px 15px 8px;
    }

    .category-menu>.category-menu-detail>div:last-of-type{
        margin: 0 15px;
    }

    .category-menu>.category-menu-detail>div:last-of-type>span>a>img{
        display: none;
    }
}

.order-requirement{
    position: relative;
    margin: 0 1.5rem;
}

.new-ui-note{
    width: calc( 240px - 3rem );
    border: 1px solid #efefef;
    border-radius: 12px;
    padding: 46px 1.25rem 1.25rem;
}

.order-requirement>span{
    font-size: 18px;
    position: absolute;
    left: 1.25rem;
    top: 10px;
    color: #212121;
}

.wrapper.toggled .order-requirement{
    display: none;
}

.wrapper.toggled.sidebar-hovered .order-requirement,
.wrapper.toggled.sidebar-hovered .service_call_us{
    display: inline-block;
}

@media screen and (max-width: 1024px){  
    .category-menu>.category-menu-detail{
        width: calc( 100vw - 190px );
        left: 180px;
    }

    .category-menu>.category-menu-detail>div:first-of-type{
        width: 80px;
    }

    .wrapper.toggled .category-menu .menu-title{
        display: inline-block;
    }

    .wrapper.toggled .order-requirement{
        display: block;
    }

    .wrapper.toggled .service_call_us{
        display: inline-block;
    }
}

#dropzone_place_orders{
    display: inline-block;
    width: calc(100% - 140px);
    height: 40px;
    margin-left: 20px;
    padding: 0;
    min-height: unset;
}


.dropzone .dz-message {
    margin: 0 !important;
    display: flex !important;
    height: 100%;
    justify-content: center;
    align-items: center;
    font-size: 16px !important;
}

.dropzone .dz-message .fas{
    font-size: 14px !important;
    margin-right: 10px !important;
}

.dropzone .dz-message i,
.dropzone .dz-message p{
    margin: 0 !important;
}

    /* 报价页面 end */

/* 报价页面 dark mode start */
html.dark-theme .tab-goods>.row>.form-body>.form-group>.col-form-label,
html.dark-theme .tab-goods>.row>.form-body>div>.form-group>.col-form-label,
html.dark-theme .tab-goods>.row>.form-body>div>div>.form-group>.col-form-label,
html.dark-theme .form-group.row>div>.RadioStyle>.inside_title{
    background-color: #21272c !important;
    color: #ccced1 !important;
}

html.dark-theme .nav-tabs .nav-link.active{
    background: none !important;
}

html.dark-theme #myTab::after{
    background-color: #21272c;
}

html.dark-theme #preparelistTable thead>tr>th{
    background-color: #21272c;
}

html.dark-theme #preparelistTable tbody>tr>td{
    border-bottom: 1px solid #21272c;
}

html.dark-theme #preparelistTable tbody>tr>td input{
    background-color: #343a40;
}

html.dark-theme .file-deleteall{
    background-color: #21272c;
    color: #eee;
}

html.dark-theme .file-deleteall:hover{
    background-color: #333b42;
}

html.dark-theme .service_call_us{
    background-color: #343a40;
    color: #ccced1 !important;
}

html.dark-theme .service_call_us>span{
    color: #ccced1 !important;
}

html.dark-theme .category-menu>.category-menu-detail{
    background-color: #21272c;
}

html.dark-theme .goods-info-box{
    background-color: #21272c !important;
}

html.dark-theme #timespend,
html.dark-theme #goods_weight{
    color: #999 !important;
}

html.dark-theme .category-menu .menu-title,
html.dark-theme .category-menu .category-menu-detail a,
html.dark-theme .category-menu>.category-menu-detail>div:first-of-type{
    color: #ccced1 !important;
}

html.dark-theme .order-requirement span{
    color: #dddfe2;
}

html.dark-theme .new-ui-note{
    background-color: #21272c;
    color: #ccced1;
}
/* 报价页面 dark mode end */