﻿/*common*/
input,select,textarea:focus{ outline:none;}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
input[type="number"]{appearance: none;-moz-appearance:textfield;}
::-ms-clear, ::-ms-reveal {display: none;}
.bgwhite {background: #fff;}
.bggrey {background: #f4f8f4;}

/*layui*/
.layui-layer{font-family: Arial,'Microsoft YaHei',sans-serif;}
.layui-layer-hui{ border-radius: 200px !important;}

.findpsdbox {
    max-width: 630px;
    margin: 0 auto;
    padding: 20px;
    text-align: center;
    border-radius: 5px;
   
}

/*Index*/
body{background: #e8f2e8 url(../Images/bg_cn.png) no-repeat center top; background-size: cover;font-size: 14px;}
.home{ width:1280px;margin:auto;font-family: Arial,'Microsoft YaHei',sans-serif;}
.info{ color:#3E3A39; text-align: center; margin:35px 0 35px; cursor: default;}
.language img {
    height: 66px;
    vertical-align: middle;
    margin-top: -3px;
}
.round{ display: inline-block; width:14px;height: 14px; border-radius: 7px; background: #E60012;vertical-align: middle; margin: -2px 12px 0 5px;}
.yellow{ background: #FFCA01;}
.logobox{ position: relative; color: #297208; text-align: center;margin-top: 20px;}
.logobox > img{ height:56px;}
.language{ position: absolute; top:0px; right: 20px; cursor: default;}
.language select,.choiceyear{ min-width:70px;height:26px;border-radius: 13px; border: 0; color: #297208; padding-left: 10px;}
.language a{ cursor: pointer;}
.menu{ height:78px; margin-top: 28px; text-align: center; background: url(../Images/menubg_cn.png) no-repeat;}
.menu > span{ position: relative; margin: 0 13px;}
.menu a{ color: #fff; text-decoration: none;}
.menu > span > a{ display: inline-block; font-size: 16px; line-height: 78px;}
.menu > span > a:hover,.menu > span.on > a,.menu > span.hover > a{ color:#019843;}
.childmenu{ position: absolute; left:0; top:45px; z-index: 999; width:240px; line-height: 16px; background: #019843;padding: 6px;}
.childmenu > a{ display: block; text-align: left; border-bottom: 1px solid #f08840;padding: 6px 12px; font-size: 14px !important;transition: all .2s ease-in-out;}
.childmenu > a:last-child{ border-bottom: 0;}
.childmenu > a:hover{ padding-left: 17px;}
.content{border:1px solid #f0e7f5;padding: 20px;background: #f4f8f4;margin-bottom: 40px;}
.layui-carousel img{ max-width: 1238px;}
.simpleinfo{ height: 30px; line-height: 30px; background: #fff; margin:6px 0; padding: 29px 0; text-align: center; cursor: default;}
.simpleinfo span{ display: inline-block; padding: 0 50px; border-right: 2px solid #297208; color: #297208;}
.simpleinfo span:last-child{ border-right: 0;}
.adbox{ overflow: hidden;  height: 243px;}
.ad{ float: left; width: 880px; height: 100%; margin-right: 6px; background: #fff; position: relative;}
.productbox a img{ display: block; max-width: 880px; max-height: 100%;}
.product{ position: absolute; left:45px; top:32px; color:#297208; cursor: default;}
.pages{ display: inline-block; vertical-align: middle; margin-left: 22px;}
.pages > img{ height:19px; float: left; margin: 2px 4px 0; padding: 0 4px; cursor: pointer;}
.pages > span{ float: left; display: block; width: 23px; height:23px; line-height: 23px; text-align: center; font-size: 14px; color: #fff; border-radius: 12px; background: #e8f2e8; cursor: default; margin: 0 5px;}
.pages > span.on{ background: #019843;}
.status{ float: left; width:302px; padding: 25px; height: 193px; color: #297208; background: #fff;}
.statustitle{ margin-top: 8px; font-weight: bold; cursor: default;}
.statustitle a{ float: right; font-size: 12px; color: #297208; font-weight: normal; text-decoration: none;}
.notice{ margin-top: 12px;font-weight: bold;}
.notice a{ display: block; color: #297208; padding-top: 2px; text-decoration: none; border-bottom: 1px dotted #c8e6c9;}
.notice a span{ display: inline-block; width:174px; line-height: 32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;transition: all .2s ease-in-out;}
.notice a i{ float: right; font-style: normal; line-height: 32px;}
.notice a:hover span{ margin-left: 5px;}

/*Upgrade*/
.submenu{ margin: 3px 0 23px 8px;}
.submenu > img{ height:21px; vertical-align: middle; margin: -4px 5px 0 0;}
    .submenu > a {
        color: #e60012;
        text-decoration: none;
    }
.submenu > a:nth-child(2){ color:#297208;}
.submenu > span{ margin: 0 8px; cursor: default;}
.updateinfo{ background: #fff; padding: 30px 40px; color:#297208; cursor: default;}
.h5updateinfo{ background: #fff; padding: 30px 40px; color:#297208; cursor: default;}
.red-color{ color:#C30D23;}
.updateinfo input[type="text"]{ width:170px; height:28px; line-height: 28px; margin: 0 18px 0 10px; padding: 0 15px; border-radius: 14px; border: 1px solid #297208;background: #f8faf9;color:#297208;}
.h5updateinfo input[type="text"]{ width:170px; height:28px; line-height: 28px; margin: 0 18px 0 10px; padding: 0 15px; border-radius: 14px; border: 0;background: #f8faf9;color:#297208;}
.switch{ display: table; margin: auto; line-height: 54px; text-align: center;color:#297208; cursor: pointer;}
.switch img{ height:11px; margin-left: 10px;}
.receiveinfo{ margin: 20px 30px;color:#297208;}
.delivery{ padding-bottom: 39px; border-bottom: 1px dotted #297208;padding-left: 10px; cursor: default;}
.radiobox{ display: inline-block; position: relative; margin: 0 64px 0 20px;}
.radiobox i{ display: inline-block; width: 22px; height: 22px; border: 1px solid #297208; border-radius: 22px; background: #fff; vertical-align: middle; margin:-2px 10px 0 0;}
.radiobox i.on{ background: #019843; border-color: #019843;}
.radiobox input[type="radio"]{position: absolute;left: 1px ;top: -2px;width: 24px;height: 24px;opacity: 0;}
.address{ border-bottom: 1px dotted #297208;}
.address .radiobox{ display: block;margin: 15px 10px;}
.editaddr{ width:100%; margin: 20px 0;}
.editaddr tr td{ height: 28px; cursor: default;}
.editaddr tr td:nth-child(3n+1) { text-align: right;}
.editaddr tr td input[type="text"],.editaddr tr td select{ width:138px; height:22px; line-height: 22px; padding: 0 10px; background: #fff; border:1px solid #297208;border-radius: 10px;color: #297208;}
.editaddr tr td select.select{ width:inherit;padding: 0 0 0 5px;}
.editaddr tr td input[type="checkbox"]{ vertical-align:middle; margin-top:-2px;}
.editaddr tr td a{ cursor:pointer;}
.editaddr tr td a:hover{ color:#C30D23;}
.grey-color{ color:#9FA0A0;}
.align-left{ text-align: left !important;}
.confirm{ 
    display: block; 
    min-width: 175px; 
    height: 34px; 
    line-height: 34px; 
    padding: 0 15px; 
    border: 0;  
    border-radius: 17px; 
    margin: 0 auto !important; 
    background: #297208;
    color: #fff; 
    cursor: pointer;
    transition: all .2s ease-in-out;
    text-align: center;
}
/* æŒ‰é'®æ·å¼æ"¹è¿› */
.confirmline {
    height: 36px !important;
    min-width: 80px !important;
    border-radius: 18px !important;
    background-color: #297208 !important;
    color: white !important;
    border: none !important;
    margin-left: 10px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    padding: 0 20px !important;
    box-shadow: 0 2px 5px rgba(127, 176, 105, 0.2) !important;
    letter-spacing: 1px !important;
    outline: none !important;
}

.confirmline:hover {
    background-color: #6e9b5f !important;
    box-shadow: 0 4px 8px rgba(127, 176, 105, 0.3) !important;
    transform: translateY(-1px) !important;
}

.confirmline:active {
    background-color: #4a7c59 !important;
    box-shadow: 0 1px 3px rgba(127, 176, 105, 0.2) !important;
    transform: translateY(1px) !important;
}
.confirm:hover{ opacity: .9;}

.producthead{ height: 50px; line-height: 50px; background: url(../Images/menubg_cn.png) no-repeat; background-size: 100% 50px; color: #fff; text-align: center; cursor: default;}
.box{ background: #fff;color: #297208;margin-bottom: 6px; overflow: hidden;}
.productleft{ width:810px; float: left; margin: 10px 10px 25px 25px;}
.lefttop{ margin: 20px 0 20px 8px; cursor: default;}
.keyword{ width:125px; height:24px; line-height: 24px; padding: 0 10px; border: 0; border-radius: 12px; color: #297208; background: #f4f8f4; margin: 0 18px 0 12px;}
.price{ width:38px; margin: 0 8px;}
.search{ width:90px; margin: 0; background:#f4f8f4 url(../Images/search_CN.png) no-repeat;background-position: 14px center;text-indent: 18px; cursor: pointer;}
.showall{ width:90px; margin: 0 8px; cursor: pointer;}
.lefttop b{ font-family: simsun;}
.producttable{ width:100%; border-top: 1px solid #d5e8d5; border-collapse: collapse; cursor: default;}
.producttable tr td{ height: 22px; border-bottom:1px solid #d5e8d5; text-align: center; padding:10px;}
/*.producttable tr td{ height: 34px; white-space: nowrap;}*/
.producttable tr td {height: 34px;border-right: 1px solid #d5e8d5;white-space: nowrap;}
.producttable tr td:nth-child(-n+2){ text-align: center;}
.producttable tr td:last-child{ border-right: 0;white-space: nowrap;}
.producttable tr:first-child td:first-child img{ vertical-align: middle; margin-left: 10px;}
.minus,.add{ width:20px; height:20px;line-height: 20px;  border: 0; border-radius: 10px; background: #fff url(../Images/minus_cn.png) no-repeat; background-size: 20px 20px; vertical-align: middle;cursor: pointer;}
.add{background: #fff url(../Images/add_cn.png) no-repeat;background-size: 20px 20px;}
.textbox{ width:50px; height: 20px; padding: 0 5px; text-align: center; color: #297208; border: 0; background: #f4f8f4;vertical-align: middle;}
.productright{ float: left; width:327px; line-height: 22px; margin: 6px; border: 1px solid #d5e8d5; padding: 22px 22px 22px 30px; cursor: default;}
.s-box{ margin:0 0 8px -8px; padding-bottom: 8px; border-bottom: 1px dotted #d5e8d5;}
.s-box img{ width:50px; height: 50px;vertical-align: middle; border: 1px solid #e8e8e8; margin-right: 10px;}
.s-box span{ display: inline-block;width: 220px;line-height: 16px;vertical-align: middle; max-height: 32px;overflow: hidden;}
.s-box label{ margin-left: 15px;}
/*.total{ width:145px; height:34px; line-height: 37px; padding: 0 15px; border: 1px solid #297208; border-radius: 17px; margin: 15px 0 8px -8px;	color: #297208;}*/
.total {width: 145px;height: 34px;line-height: 34px;color: #297208;padding: 0 15px;border: 1px solid #297208;border-radius: 17px;margin: 15px 0 8px -8px;background: #fff;cursor: pointer;}
.password{border: 0;}
.proceed {width: 177px;height: 36px;border: 0;border-radius: 18px;font-size: 16px;color: #fff;background: #019843;margin: 16px 0 16px -8px;transition: all .2s ease-in-out;cursor: pointer;}
.proceed[disabled] {background: #f4f8f4;color: #9FA0A0;cursor: default;}
.proceed:hover {opacity: .9;}
.phonetips {width: 118px;display: inline-block;font-size: 12px;line-height: 14px;vertical-align: middle;}
.width200 {width: 200px;}
.floatR {float: right;}
.MRTop5 {margin-top: 5px;}
#express .select {width: inherit;}

/*OrderEnquiry*/
.ordersearch{ text-align: center;}
.ordersearch input[type="text"]{ margin:0 15px;}
.ordersearch span{ position: relative;}
.ordersearch span img{ position: absolute; right:28px; top:5px;}
.searchbtn{ width:100px; height:28px; border:1px solid #297208; color: #297208; background: #fff; border-radius: 14px; cursor: pointer;}
.ordertable{ margin: 0 25px; width:calc(100% - 50px);}
.ordertable tr td{ height:28px;}
.pagination{ text-align: center; margin:40px 0;}
.pagination a{ padding: 0 4px; margin:0 4px; cursor: pointer;}
.pagination a:first-child,.pagination a:last-child{ display: inline-block; width:21px; height:11px; background: url(../Images/down_cn.png) no-repeat; background-size: 18px auto; transform:rotate(90deg); vertical-align: middle; padding: 0;}
.pagination a:last-child{transform:rotate(-90deg);margin-top: -4px;}
.pagination a.on{color: #019843;}   

/*MyAccount*/
.accountbg{ height:56px;background: linear-gradient(#90c695, #297208);}
.accounttable{margin: -56px 25px 25px; width:calc(100% - 50px); border-top-color: #90c695;}
.accounttable tr:first-child td{ color: #fff; border-right-color: #a8d5ba; border-bottom-color: #90c695;}
.accounttable tr td:nth-child(-n+2){ text-align: center;}
.accounttable tr td .search{ width:80px; height: 26px; background: #fff; text-indent: 0; border:1px solid #297208;vertical-align: middle;}
.choiceyear{background: #f4f8f4;}
.searchresult{ margin-bottom: 25px;}
.searchresult tr td:nth-child(-n+2){ text-align: center;}

/*Bonus*/
.bonus{margin:20px 25px; width:calc(100% - 50px); border-collapse: collapse; table-layout: fixed; cursor: default;}
.bonus tr td{ height:40px; line-height: 40px; border-bottom: 1px solid #d5e8d5; padding-left: 20px;}
.bonus tr:last-child td{ border-bottom: 0;}

/*WalletTransfer*/
.transfertitle{ height:60px; line-height: 60px; font-size: 14px; text-align: center; color: #fff;background: linear-gradient(#019843, #347728); cursor: default;}
.transfer {width: 96%;margin: 30px auto 25px;cursor: default;}
.transfer tr td{ height: 48px;}
.transfer tr td input[type="text"], .transfer tr td input[type="password"], .transfer tr td select {width: 170px;height: 28px;line-height: 28px;margin-left: 10px;padding: 0 15px;border-radius: 14px;border: 1px solid #297208;background: #f8faf9;color: #297208; }
    .transfer tr td select,.editaddr tr td select {
        width: 200px;
        padding: 0 0 0 11px;
        margin-right: -5px;
        margin-top: 10px;
    }
.xz {
    color: #fff;
   
    margin-left: -40px;
}
#txtBranch {
    width: 150px;
}
@media screen and (max-width:480px) {
    .transfertitle {
       white-space:nowrap;
       overflow:auto;
    }
    .transfertitle a{
        display:inline-block;
    }
    .width20 {
        text-align: left;
        width: 170%;
    }
    
}   
    .transfer tr td select.select {
        width: inherit;
    }

    .transfer tr td:nth-child(odd) {
        text-align: right;
    }

    .transfer tr td input[type="checkbox"] {
        vertical-align: middle;
        margin-top: -2px;
    }

    .history {
        margin: 10px 25px 0;
        width: calc(100% - 50px);
        border-top: 0;
    }

        .history tr td:nth-child(-n+2) {
            text-align: center;
        }

    .auto {
        width: auto;
    }

    .check {
        width: 200px;
        margin-left: 10px;
        border-spacing: 0;
        border-radius: 14px;
        background: #f8faf9;
        table-layout: fixed;
    }

        .check tr td {
            height: 26px;
        }

            .check tr td:first-child {
                border-radius: 14px 0 0 14px;
                border-right: 1px solid #fff;
            }

            .check tr td:last-child {
                border-radius: 0 14px 14px 0;
                border-left: 1px solid #fff;
            }
    /*MsgBox*/
    .MsgBox {
        display: none;
        background: rgba(0,0,0,.3);
        z-index: 999;
    }

        .MsgBox {
            width: 800px;
            height: 600px;
            left: 50%;
            top: 50%;
            margin: -300px 0 0 -400px;
            overflow: hidden;
        }

        .MsgBox  {
            height: 557px;
            overflow-y: auto;
        }

            .MsgBox  img {
                display: block;
                max-width: 780px;
                margin: auto;
            }

        .MsgBox em {
            font-style: normal;
        }
    /*FindPassword*/
    .findlogo {
        display: block;
        width: 260px;
        margin: 50px auto;
    }

  

    .align-center {
        text-align: center !important;
    }
    /*äº§å"ä¸­å¿ƒ*/
    .prs_content {
        width: 980px;
        overflow: hidden;
        margin-bottom: 12px;
        padding-top: 10px;
    }

    .prs_content_left {
        width: 247px;
        float: left;
        display:none;
    }

    .prs_content_right {
        width: 960px;
       margin:0 auto;
    }

    .prs_fl {
        width: 221px;
        margin-bottom: 10px;
    }

    .prs_content_left div h1 {
        height: 50px;
        line-height: 50px;
        font-size: 18px;
        text-align: center;
        color: #fff;
        background: linear-gradient(#019843, #e67e22);
        cursor: default;
    }

    .newPriceLinks {
        clear: both;
    }

        .newPriceLinks ul {
            clear: both;
        }

            .newPriceLinks ul li {
                clear: both;
                line-height: 36px;
                letter-spacing: 0;
                border-bottom: 1px dotted #eee;
            }

                .newPriceLinks ul li:last-child {
                    border: 0;
                }

        .newPriceLinks .tit a {
            color: #333;
            padding-left: 10px;
            display: block;
            transition: all .2s ease-in-out;
        }

        .newPriceLinks .tit:hover a {
            color: #019843;
            font-weight: bold;
            text-decoration: none;
            padding-left: 16px;
        }

    .image-item {
        width: 300px;
        float: left;
        padding: 10px;
    }

    .h20 {
        height: 20px;
        clear: both;
        font-size: 0;
        line-height: 0;
    }

    ul#thumblist li {
        display: block;
        float: left;
        margin-right: 5px;
        list-style: none;
    }

        ul#thumblist li img {
            width: 50px;
            height: 50px;
        }

        ul#thumblist li a {
            display: block;
            border: 1px solid #CCC;
        }

            ul#thumblist li a.zoomThumbActive {
                border: 1px solid red;
            }

    #product-name {
        font-family: arial;
        line-height: 65px;
        margin: 0;
        overflow: hidden;
        padding: 0 0 12px 30px;
    }

    .inf-inner {
        width: 310px;
        float: right;
        padding: 10px;
        border-bottom: 1px #FCFADA dotted;
    }

        .inf-inner dt {
            color: #333;
            float: left;
            font-size: 14px;
            padding: 4px 0 0;
            text-align: right;
            width: 85px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .inf-inner dd {
            line-height: 165%;
            margin-left: 113px;
            color: #BD1A1D;
            font-family: verdana;
            font-size: 1.35em;
            letter-spacing: -0.05em;
            font-weight: 700;
        }

    .inner, .content, .cols, .block, .clearfix {
        display: block;
        min-height: 1%;
    }

    .h10 {
        height: 10px;
        clear: both;
        font-size: 0;
        line-height: 0;
    }

    #tabs li.current {
        background-position: 0 -35px;
        height: 29px;
        margin-bottom: -1px;
        position: relative;
        z-index: 100;
    }

        #tabs li.current a {
            background-position: 100% 0;
            color: #019843 !important;
            text-decoration: none;
        }

    #tabs ul {
        height: 28px;
        list-style-image: none;
        list-style-position: outside;
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    .tabs-2-panel {
        background-repeat: no-repeat;
        padding: 30px 100px 30px 30px;
        min-height: 300px;
        margin-bottom: 20px;
    }

    .tabs-3-panel {
        background-repeat: no-repeat;
        padding: 30px 40px 30px 30px;
        margin-bottom: 20px;
    }

    #cart_table {
        padding: 0px;
        margin: 0px;
        background: rgb(255, 255, 255);
    }

        #cart_table td {
            padding: 4px 4px 4px 12px;
            vertical-align: middle;
        }

        #cart_table th {
            color: rgb(125, 68, 0);
            border: 1px solid rgb(202, 188, 131);
            letter-spacing: 2px;
            text-align: left;
            padding: 6px 6px 6px 12px;
            background-color: rgb(245, 235, 206);
            background-image: url(../images/down-h3.png);
            background-repeat: repeat-x;
            background-position: -1px center;
        }


    /* æ"¾å¤§é•œ */
    .preview {
        width: 400px;
        overflow: hidden;
        float: left;
    }

    .bigImg {
        position: relative;
        width: 400px;
        height: 400px;
        overflow: hidden;
    }

        .bigImg #midimg {
            width: 398px;
            height: 398px;
            border: 1px solid #e3e3e3;
        }

    .smallImg ul li {
        float: left;
    }

        .smallImg ul li img {
            display: block;
            width: 48px;
            height: 48px;
            border: 1px solid #fff;
            opacity: 0.8;
            transition: all .2s ease-in-out;
        }

    #winSelector {
        display: none;
        position: absolute;
        width: 160px;
        height: 160px;
        cursor: crosshair;
        filter: alpha(opacity=15);
        -moz-opacity: 0.15;
        opacity: 0.15;
        background-color: #000;
        border: 1px solid #fff;
    }

    #bigView {
        position: absolute;
        top: -1px;
        display: none;
        width: 321.608px !important;
        height: 321.608px !important;
        border: 1px solid #E3E3E3;
        overflow: hidden;
        z-index: 999;
    }

        #bigView img {
            position: absolute;
            width: 800px;
            height: 800px;
        }
    /* åª'ä½"æŸ¥è¯¢ */
    @media screen and (max-width:480px) {
        body, html {
            height: 100%;
            margin: 0;
            padding: 0;
        }
        body {
            display: flex;
            flex-direction: column;
            min-height: 100vh;
            background: #e8f2e8 url(../Images/bg_cn.png) no-repeat center top;
            background-size: cover;
            font-size: 12px;
        }
        .content {
            border:0px solid #f0e7f5;
            background: none;
            padding: 0;
        }

        .findpsdbox {
            width:100%;
            padding-top: 10%;
            padding-bottom: 0;
        }

        .language select, .choiceyear {
            min-width: 60px;
        }

        .home {
            padding-top: 0;
            margin-top: 0;
            max-width: 480px;
            width: 100%;
        }

        

        .simpleinfo {
            max-width: 480px;
            width: 100%;
        }

            .simpleinfo span {
                display: unset;
                padding: 0 10px;
            }

        .ad {
            height: auto;
            max-width: 480px;
            width: 100%;
        }

        .adbox {
            overflow: inherit;
        }

        .productbox a img {
            width: 100%;
        }

        .status {
            padding: 5%;
            width: 90%;
        }

        .bonus tr td {
            line-height: 30px;
        }
        /*myaccount*/
        .accounttable {
            margin: -52px 0 5px;
        }

        .producttable tr td {
            padding: 8px;
        }

        .accounttable tr td .search {
            width: 70px;
        }

        .submenu {
            margin-top: 15px;
        }



        .ordersearch input[type="text"] {
            margin: 15px;
        }

        .accounttable {
            width: 100%;
        }

    
        .searchbtn {
           width:80px;
        }
        .h5updateinfo input[type="text"] {
            width: 130px;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .h5updateinfo {
            padding: 30px 20px;
        }

            .h5updateinfo b {
                width: 55px;
                display: inline-block;
            }

        .radiobox {
            margin-top: 15px;
            display: block;
        }
        .address .radiobox {
            margin: 15px 25px;
        }
        .productbox a img {
            display: none;
        }
    }

    @media screen and (min-width:481px) {
        .h5updateinfo {
            display: none;
        }

        .h5table {
            display: none;
        }
    }

    /*å¯†ç å¼ºåº¦*/
    .transfer tr td.pw-strength {
        clear: both;
        position: relative;
        top: 0px;
        width: 180px;
        padding-top: 10px;
    }

    .pw-bar {
        background: url(../images/password/pwd-1.png) no-repeat;
        height: 14px;
        overflow: hidden;
        width: 247px;
    }

    .pw-bar-on {
        background: url(../images/password/pwd-2.png) no-repeat;
        width: 0px;
        margin-top: 10px;
        height: 14px;
        position: absolute;
        top: 0px;
        left: 2px;
        transition: width .5s ease-in;
        -moz-transition: width .5s ease-in;
        -webkit-transition: width .5s ease-in;
        -o-transition: width .5s ease-in;
    }

    .pw-weak .pw-defule {
        width: 0px;
    }

    .pw-weak .pw-bar-on {
        width: 80px;
    }

    .pw-medium .pw-bar-on {
        width: 162px;
    }

    .pw-strong .pw-bar-on {
        width: 247px;
    }

    .pw-txt {
        padding-top: 2px;
        width: 247px;
        overflow: hidden;
    }

        .pw-txt span {
            color: #707070;
            float: left;
            font-size: 12px;
            text-align: center;
            line-height: 18px;
            width: 82px;
        }

    * {
        margin: 0;
        padding: 0;
    }

    ul li {
        list-style: none;
    }

    a {
        text-decoration: none;
    }

        a:hover {
            text-decoration: none;
        }

    .z-flex {
        display: flex;
    }

    .t-nav {
        width: 1280px;
        height: 78px;
        margin: 0 auto;
    }

    .m-nav {
        width: 1280px;
        height: 78px;
        background: url('../img/menubg_cn.png') no-repeat;
        justify-content: center;
    }

    .ui-item {
        width: 99px;
        height: 78px;
        line-height: 78px;
        text-align: center;
    }

    .ui-menu {
        width: 140px;
        height: 78px;
        line-height: 78px;
        text-align: center;
        background: no-repeat 101px 23px;
        position: relative;
        z-index: 9999999;
    }

    .ui-menu-cont {
        width: 150px;
        position: absolute;
        top: 78px;
        left: 0px;
        display: none;
    }

        .ui-menu-cont li {
            width: 150px;
            height: 40px;
            line-height: 40px;
            background: #019843;
        }

    .t-nav a {
        color: #fff;
        font-size: 14px;
    }

        .t-nav a:hover {
            color: #019843;
        }

    .ui-menu-cont li a:hover {
        color: #fff;
        margin-left: 10px;
    }
.confirm {
    margin-left: 400px;
}

/* z-scroll 样式 - 全局生效 */
.z-scroll {
    overflow: scroll;
    padding-bottom: 40px;
}
.confirm1 {
    display: block;
    min-width: 175px;
    height: 34px;
    line-height: 34px;
    padding: 0 15px;
    border: 0;
    border-radius: 17px;
    margin: auto;
    background: #297208;
    color: #fff;
    cursor: pointer;
    transition: all .2s ease-in-out;
    margin-left: 660px;
    margin-top: -34px;
}
.z-h5{
    display:none;
}
.z-pc{
    display:block;
}
#cart_table {
    border: 1px solid #e1d0ea;
}
.z-accountbg {
    width: 100%;
}
    .z-adress{
    margin-left: 260px;
}
.z-carttable {
    width: 512.2px;
}
.z-confirm{
    width:80px;
    text-align:center;
}
@media screen and (max-width:480px) {
    .t-nav {
            display: none;
        }
        .ordertable{
            width:100%
        }
        .MsgBox  {
            width: 100%;
            margin: 0;
            left: 0;
            top: 100px;
        }
        .validate-info {
            display: block;
        }
        .bonusSearch{
            display:none;
        }
        .confirm, .confirm1 {
            margin-left: 30px;
            min-width: 150px;
        }
        .confirm1{
            margin-left:220px;
        }
        .z-tabScroll {
            width:auto;
        }
        .keyword{
            width:50px;
            margin:0px 10px 0 6px;
        }
        .price{
            margin:0 8px;
        }
        .lefttop{
            margin:20px 0;
        }
        .search{
            width:90px;
        }
        .z-h5{
            display:block;
        }
        .z-pc{
            display:none;
        }
        .editaddr.z-h5 tr{
            margin-top:10px;
            display:block;
        }
        .editaddr.z-h5 td {
            min-width: 80px;
        }
        .inf-inner{
            float:none;
        }
        #cart_table {
            border: 1px solid #e1d0ea;
            width:260.6px;
        }
        .tabs-2-panel{
            width:300px;
        }
        #tabbed-pane{
            padding-left:20px;
        }
        
        .NetInfo{
            left:180px;
        }
        .z-pos{
            margin-left:30px;
        }
        .left80{
            margin-left:80px;
            margin:0 auto;
        }
        .productleft {
            width: 100%;
        }
        .productleft{
            margin:10px;
        }
        .z-search{
            margin-top:10px;
        }
        .z-confirm{
            width:80px;
            text-align:center;
        }
        .z-accountbg{
            width:230%;
        }
    .z-adress{
        margin-left:0px;
    }
    .layui-carousel img{
        width:100%;
    }
    .tabs-2-panel img{
        width:100%;
    }
    .z-fill{
        width:120%;
    }
    .z-accountbg1{
        width:120%;
    }
    .z-transfer {
        display: flex;
        justify-content: center;
    }
    }

    @media screen and (max-width:480px) {
        /* é¡¶éƒ¨ç©ºé—´ä¼˜åŒ– */
        .home {
            padding-top: 0;
            margin-top: 0;
            max-width: 480px;
            width: 100%;
        }
        .content {
            margin-top: 0;
            padding-top: 0;
        }
        /* èœå•æŒ‰é'®ä¼˜åŒ– */
        .menu {
            height: 48px;
            margin-top: 0;
            background-size: 100% 48px;
            display: flex;
            align-items: center;
            padding: 0 10px;
        }
        .menu > span {
            margin: 0 8px;
        }
        .menu a, .menu > span > a {
            font-size: 16px;
            line-height: 48px;
            padding: 0 6px;
        }
        /* æ±‰å ¡èœå•æŒ‰é'®æ ·å¼ä¼˜åŒ– */
        .menu-btn, .hamburger {
            width: 36px;
            height: 36px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.08);
            margin-right: 10px;
            border: none;
            font-size: 24px;
            color: #297208;
        }
        .menu-btn:active, .hamburger:active {
            background: #f3f3f3;
        }
        .productbox a img {
            display: none !important;
        }
    }

/* æ–°çš„æ•°æ®è¡¨æ ¼æ ·å¼ç±» - æ›¿ä»£producttable ordertable searchresult */
.data-table { 
    width:100%; 
    border-top: 1px solid #d5e8d5; 
    border-collapse: collapse; 
    cursor: default;
    margin: 0 25px; 
    width:calc(100% - 50px);
    margin-bottom: 25px;
}

.data-table tr td { 
    height: 34px;
    border-bottom:1px solid #d5e8d5; 
    border-right: 1px solid #d5e8d5;
    text-align: center; 
    padding:10px;
    white-space: nowrap;
}

.data-table tr td:nth-child(-n+2) { 
    text-align: center;
}

.data-table tr td:last-child { 
    border-right: 0;
    white-space: nowrap;
}

.data-table tr:first-child td:first-child img { 
    vertical-align: middle; 
    margin-left: 10px;
}

@media screen and (max-width:480px) {
    .data-table {
        width: 100%;
        margin: 0 0 25px 0;
    }
    
    .data-table tr td {
        padding: 8px;
    }
}

/* layerå¼¹çª—æ ·å¼é‡å†™ - ä¼˜åŒ–ç‰ˆ */
.layui-layer {
    border-radius: 16px !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 20px 5px rgba(255, 255, 255, 0.3), 0 5px 25px rgba(0, 0, 0, 0.3) !important;
    overflow: hidden !important;
    font-family: Arial,'Microsoft YaHei',sans-serif !important;
    border: none !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}



.layui-layer-title {
    background: linear-gradient(135deg, #297208, #90c695) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    height: 50px !important;
    line-height: 50px !important;
    border: none !important;
    padding: 0 20px !important;
    border-radius: 16px 16px 0 0 !important;
    text-align: center !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px !important;
}

.layui-layer-content {
    padding: 20px !important;
    color: #333333 !important;
    background: #fff !important;
    overflow: auto !important;
    flex: 1 !important;
    max-height: calc(90vh - 120px) !important;
}

/* 图片弹窗自适应高度 */
.layui-layer-content img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
}

/* 包含图片的弹窗自适应高度 */
.layui-layer:has(.layui-layer-content img) {
    height: auto !important;
    max-height: 90vh !important;
}

.layui-layer:has(.layui-layer-content img) .layui-layer-content {
    height: auto !important;
    max-height: calc(90vh - 120px) !important;
    overflow: visible !important;
    padding: 0 !important;
}

/* 图片弹窗内容居中 */
.layui-layer-content:has(img) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px !important;
}

/* 图片弹窗专用样式 */
.image-popup {
    height: auto !important;
}

.image-popup .layui-layer-content {
    padding: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.image-popup .layui-layer-content img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
}

/* 移动端图片弹窗优化 */
@media screen and (max-width: 768px) {
    .image-popup .layui-layer-content {
        padding: 0 !important;
        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .image-popup .layui-layer-content img {
        max-width: 100% !important;
        max-height: 100% !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
        display: block !important;
    }
}

/* è¡¨æ ¼æ ·å¼ä¼˜åŒ– */
.layui-layer-content table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 10px 0 !important;
    border: 1px solid #d5e8d5 !important;
}

.layui-layer-content table th,
.layui-layer-content table td {
    padding: 12px 15px !important;
    text-align: center !important;
    border: 1px solid #d5e8d5 !important;
}

.layui-layer-content table th {
    background-color: #f0e7f5 !important;
    color: #297208 !important;
    font-weight: normal !important;
}

.layui-layer-content table tr:nth-child(even) {
    background-color: #f8faf9 !important;
}

.layui-layer-content table tr:hover {
    background-color: #f0e7f5 !important;
    transition: all 0.3s ease !important;
}

/* æŒ‰é'®åŒºåŸŸæ ·å¼ */
.layui-layer-btn {
    text-align: center !important;
    padding: 10px !important;
    background: #fff !important;
    position: relative !important;
    border-top: 1px solid #f0f0f0 !important;
}

.layui-layer-btn a {
    display: inline-block !important;
    min-width: 120px !important;
    height: 40px !important;
    line-height: 40px !important;
    padding: 0 20px !important;
    border-radius: 20px !important;
    font-size: 15px !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    margin: 0 10px !important;
    letter-spacing: 1px !important;
}

.layui-layer-btn .layui-layer-btn0 {
    background: #b8df25 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 10px rgba(239, 131, 48, 0.2) !important;
}

.layui-layer-btn .layui-layer-btn0:hover {
    background: #4a7c59 !important;
    box-shadow: 0 6px 12px rgba(74, 124, 89, 0.3) !important;
    transform: translateY(-2px) !important;
}

.layui-layer-btn .layui-layer-btn1 {
    background: #ffffff !important;
    color: #297208 !important;
    border: 1px solid #297208 !important;
}

.layui-layer-btn .layui-layer-btn1:hover {
    color: #90c695 !important;
    border-color: #90c695 !important;
    background-color: #f0e7f5 !important;
}

/* å…³é—­æŒ‰é'®ä¼˜åŒ– */
.layui-layer-setwin {
    top: 10px !important;
    right: 10px !important;
    position: absolute !important;
}

.layui-layer-setwin .layui-layer-close2 {
    position: relative !important;
    top: 0 !important;
    right: 0 !important;
    width: 30px !important;
    height: 30px !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ä¿®æ"¹æœ€å°åŒ–æŒ‰é'®æ ·å¼ - ä½¿ç"¨çŸ­æ¨ªçº¿ */
.layui-layer-setwin .layui-layer-min,
.layui-layer-setwin .layui-layer-max,
.layui-layer-setwin .layui-layer-close1 {
    background: none !important;
    background-color: rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
    width: 24px !important;
    height: 24px !important;
    position: relative !important;
    margin: 0 5px !important;
    color: #297208 !important;
}

/* æ¸…é™¤åŽŸæœ‰æŒ‰é'®èƒŒæ™¯å›¾ */
.layui-layer-setwin a {
    background-image: none !important;
}

/* ä¿®æ"¹æœ€å°åŒ–æŒ‰é'®æ ·å¼ - ä½¿ç"¨çŸ­æ¨ªçº¿ */
.layui-layer-setwin .layui-layer-min:before {
    content: '' !important;
    position: absolute !important;
    width: 12px !important;
    height: 3px !important;
    background-color: #297208 !important;
    border-radius: 1px !important;
    top: 11px !important;
    left: 6px !important;
    transform: none !important;
    margin:0 !important;
}

.layui-layer-setwin .layui-layer-min:after {
    display: none !important;
}

/* ä¿®æ"¹æœ€å¤§åŒ–æŒ‰é'®æ ·å¼ - ä½¿ç"¨æ–¹æ¡† */
.layui-layer-setwin .layui-layer-max:before {
    content: '' !important;
    position: absolute !important;
    width: 12px !important;
    height: 12px !important;
    border: 2px solid #297208 !important;
    background-color: transparent !important;
    top: 5px !important;
    left: 5px !important;
    transform: none !important;
    box-sizing: border-box !important;
    margin:0 !important;
}

.layui-layer-setwin .layui-layer-max:after {
    display: none !important;
}

/* ä¿®æ"¹å…³é—­æŒ‰é'®æ ·å¼ - ä½¿ç"¨Xå½¢çŠ¶ */
.layui-layer-setwin .layui-layer-close1:before,
.layui-layer-setwin .layui-layer-close1:after {
    content: '' !important;
    position: absolute !important;
    width: 3px !important;
    height: 14px !important;
    background-color: #297208 !important;
    border-radius: 1px !important;
    top: 5px !important;
    left: 10.5px !important;
}

.layui-layer-setwin .layui-layer-close1:before {
    transform: rotate(45deg) !important;
}

.layui-layer-setwin .layui-layer-close1:after {
    transform: rotate(-45deg) !important;
}

/* 叉叉样式 - 绿色系 */
.layui-layer-setwin .layui-layer-close2:before,
.layui-layer-setwin .layui-layer-close2:after {
    content: '' !important;
    position: absolute !important;
    width: 2px !important;
    height: 14px !important;
    background-color: #297208 !important;
    border-radius: 1px !important;
    top: 50% !important;
    left: 50% !important;
    transform-origin: center !important;
}

.layui-layer-setwin .layui-layer-close2:before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.layui-layer-setwin .layui-layer-close2:after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

/* ä¿®å¤iframeå®¹å™¨æ ·å¼ */
.layui-layer-iframe .layui-layer-content {
    overflow: hidden !important;
}

.layui-layer-iframe iframe {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: none !important;
    overflow: auto !important;
}

/* éšè—iframeæ»šåŠ¨æ¡ */
.layui-layer-iframe iframe {
    scrollbar-width: thin !important; /* Firefox */
    -ms-overflow-style: -ms-autohiding-scrollbar !important; /* IE and Edge */
}

.layui-layer-iframe iframe::-webkit-scrollbar {
    width: 6px !important;
}

.layui-layer-iframe iframe::-webkit-scrollbar-thumb {
    background-color: rgba(127, 176, 105, 0.3) !important;
    border-radius: 3px !important;
}

/* æç¤ºç±»å¼¹çª— */
.layui-layer-dialog {
    border-radius: 16px !important;
}

.layui-layer-dialog .layui-layer-title {
    background: #297208 !important;
    text-align: left !important;
}

.layui-layer-dialog .layui-layer-content {
    padding: 25px 20px !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

.layui-layer-dialog .layui-layer-content .layui-layer-ico {
    width: 30px !important;
    height: 30px !important;
    background-size: 360px 120px !important;
    margin-right: 15px !important;
}

/* é¡µé¢å±‚ */
.layui-layer-page .layui-layer-content {
    overflow: auto !important;
    padding: 20px !important;
}
.layui-layer-setwin .layui-layer-min cite
{
    display: none !important;
}

/* ç…§ç‰‡æŸ¥çœ‹å™¨ */
.layui-layer-imgbar {
    background-color: rgba(127, 176, 105, 0.7) !important;
}

.layui-layer-photos .layui-layer-phimg img {
    max-width: 100% !important;
    max-height: 100% !important;
}

.layui-layer-imguide {
    background-color: rgba(127, 176, 105, 0.7) !important;
    color: #fff !important;
}

/* loadingå±‚ */
.layui-layer-loading {
    background-color: rgba(127, 176, 105, 0.05) !important;
    box-shadow: 0 0 15px rgba(127, 176, 105, 0.2) !important;
}

.layui-layer-loading .layui-layer-content {
    width: 60px !important;
    height: 60px !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    border-radius: 10px !important;
}

/* é‡'é¢æ ·å¼ */
.layui-layer-content .price,
.layui-layer-content [class*="price"],
.layui-layer-content .money,
.layui-layer-content [class*="money"],
.layui-layer-content [class*="Â¥"] {
    color: #b8df25 !important;
    font-weight: 500 !important;
}

/* ç§»åŠ¨ç«¯é€‚é… */
@media screen and (max-width: 768px) {
    .layui-layer {
        width: 92% !important;
        left: 4% !important;
        right: 4% !important;
        margin-left: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        max-height: 80vh !important;
    }
    .layui-layer-setwin .layui-layer-min,
    .layui-layer-setwin .layui-layer-max
    {
        display: none !important;
    }
    
    .layui-layer-title {
        font-size: 15px !important;
        height: 45px !important;
        line-height: 45px !important;
        padding: 0 15px !important;
    }
    
    .layui-layer-content {
        padding: 15px !important;
        max-height: calc(80vh - 110px) !important;
        overflow-y: auto !important;
    }
    
    .layui-layer-btn {
        padding: 10px 15px 20px !important;
    }
    
    .layui-layer-btn a {
        min-width: 100px !important;
        height: 36px !important;
        line-height: 36px !important;
        font-size: 14px !important;
        margin: 5px !important;
    }
    
    .layui-layer-setwin {
        top: 12px !important;
        right: 12px !important;
    }
    
    /* ç§»åŠ¨ç«¯è¡¨æ ¼ä¼˜åŒ– */
    .layui-layer-content table th,
    .layui-layer-content table td {
        padding: 10px 8px !important;
    }
    
    /* ç§»åŠ¨ç«¯å¼¹çª—å…¨å±æ ·å¼ */
    .layui-layer-full-mobile {
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        border-radius: 0 !important;
        transform: none !important;
        max-height: 100vh !important;
    }
    
    .layui-layer-full-mobile .layui-layer-title {
        border-radius: 0 !important;
    }
    
    .layui-layer-full-mobile .layui-layer-content {
        max-height: calc(100vh - 45px - 65px) !important;
    }

    /* éšè—å…³é—­æŒ‰é'® */
    .layui-layer-close1,
    .layui-layer-setwin .layui-layer-close1 {
        display: inline-block !important; /* ç¡®ä¿æ˜¾ç¤ºå…³é—­æŒ‰é'® */
    }
     /* åˆ†é¡µæ ·å¼ä¼˜åŒ– */
     /* 移动端分页样式优化 */
     .z-pageBox {
        padding: 10px !important;
        display: flex !important;
        justify-content: center !important;
    }
    
    .z-page {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
    }
    
    .z-page ul {
        display: flex !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 5px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .z-page ul li {
        list-style: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .z-page ul li a {
        min-width: 30px !important;
        height: 30px !important;
        line-height: 30px !important;
        text-align: center !important;
        border-radius: 4px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background-color: #f0f8f0 !important;
        color: #297208 !important;
        text-decoration: none !important;
        padding: 0 8px !important;
    }
    
    .z-page ul li.z-select {
       
        font-weight: bold !important;
       
    }
    
    .z-page ul li.prev a, .z-page ul li.next a {
        color: #297208 !important;
        font-weight: bold !important;
    }
    
    .location {
        margin-top: 10px !important;
        width: 100% !important;
        max-width: none !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
    
    .tolink {
        width: 60px !important;
        height: 30px !important;
        border: 1px solid #d5e8d5 !important;
        border-radius: 4px !important;
        margin-right: 5px !important;
        text-align: center !important;
        padding: 0 5px !important;
    }
    
    .z-btn {
        min-width: 50px !important;
        height: 30px !important;
        background-color: #297208 !important;
        color: white !important;
        border: none !important;
        border-radius: 4px !important;
        cursor: pointer !important;
        font-size: 14px !important;
    }
    
    /* åˆ†é¡µç®­å¤´ç‰¹å®šæ ·å¼ */
    .z-page .prev, .z-page .next {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .z-page .prev a, .z-page .next a {
        background-color: #f0f8f0 !important;
        color: #297208 !important;
        border: 1px solid #d5e8d5 !important;
        width: 30px !important;
        height: 30px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-weight: bold !important;
        border-radius: 4px !important;
        text-decoration: none !important;
    }
    
    /* åˆ†é¡µå·¦å³ç‚¹å‡»åŒºåŸŸæ‰©å¤§ */
    .prev, .next {
        min-width: 30px !important;
        min-height: 30px !important;
        cursor: pointer !important;
    }
    
    /* è¾"å…¥æ¡†å'ŒæŒ‰é'®å®¹å™¨ - 已在上方定义 */
    
    /* GOæŒ‰é'®ç´«è‰²æ ·å¼ */
    .z-btn {
        background-color: #297208 !important;
        color: white !important;
        border: none !important;
        border-radius: 4px !important;
        min-width: 40px !important;
        height: 30px !important;
        cursor: pointer !important;
        font-size: 14px !important;
    }
    
}

@media screen and (max-width: 480px) {
    .layui-layer-title {
        font-size: 14px !important;
    }
    
    .layui-layer-btn a {
        min-width: 90px !important;
        margin: 5px !important;
        padding: 0 15px !important;
    }
    
    .layui-layer-dialog .layui-layer-content {
        padding: 20px 15px !important;
        font-size: 14px !important;
    }
    
    /* æé«˜å°å±å¹•å¯è¯»æ€§ */
    .layui-layer-content {
        font-size: 14px !important;
    }
    
    /* å°å±å¹•è¡¨æ ¼å¤„ç† */
    .layui-layer-content table {
        font-size: 13px !important;
    }
    
    .layui-layer-content table th,
    .layui-layer-content table td {
        padding: 8px 5px !important;
    }
}

/* ç¡®ä¿åœ¨å¼¹çª—ä¸­çš„ç¡®è®¤æŒ‰é'®å±…ä¸­ */
.layui-layer-content .confirm {
    margin: 20px auto !important;
}

@media screen and (max-width: 768px) {
    .layui-layer-content .confirm {
        margin: 15px auto !important;
        width: 80% !important;
        max-width: 200px !important;
    }
}

/* æ—¥æœŸé€‰æ‹©å™¨ç§»åŠ¨ç«¯æ ·å¼ */
@media screen and (max-width: 768px) {
    .layui-laydate {
        left: 50% !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
        position: fixed !important;
        top: 50% !important;
        margin-top: -150px !important;
        z-index: 999999 !important;
    }

    .layui-laydate-header {
        background-color: #297208 !important;
        color: #fff !important;
        padding: 10px !important;
    }

    .layui-laydate-content {
        padding: 10px !important;
    }

    .layui-laydate-content table {
        width: 100% !important;
    }

    .layui-laydate-content td {
        height: 40px !important;
        line-height: 40px !important;
        font-size: 14px !important;
    }

    .layui-laydate-footer {
        padding: 10px !important;
        text-align: center !important;
    }

    .layui-laydate-footer span {
        display: inline-block !important;
        margin: 0 5px !important;
        padding: 5px 15px !important;
        border-radius: 15px !important;
        background: #297208 !important;
        color: #fff !important;
    }
    /* ç§»åŠ¨ç«¯æœç´¢æŒ‰é'®æ ·å¼ä¼˜åŒ– */
   
    .confirmline {
        height: 40px !important;
        min-width: 100px !important;
        width: 100% !important;
        max-width: 200px !important;
        margin: 10px 0 !important;
        font-size: 15px !important;
    }
    /* æçŽ°é¡µé¢æ ‡ç­¾å¯¼èˆªæ ·å¼ - æ˜¾ç¤ºå¹¶ç¾ŽåŒ– */
    body[class*="withdraw"] .transfertitle,
    .withdraw-page .transfertitle {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 95% !important;
        max-width: 400px !important;
        margin: 15px auto !important;
        padding: 0 !important;
        background: #f8f5fa !important;
        border-radius: 25px !important;
        /* è½»æ‹Ÿç‰©é˜´å½±æ•ˆæžœ */
        box-shadow: 
            4px 4px 10px rgba(127, 176, 105, 0.12),
            -4px -4px 10px rgba(255, 255, 255, 0.9),
            inset 1px 1px 2px rgba(255, 255, 255, 0.6) !important;
        overflow: hidden !important;
        position: relative !important;
        height: 50px !important;
    }
    
    .withdraw-page .transfertitle a,
    body[class*="withdraw"] .transfertitle a {
        flex: 1 !important;
        height: 42px !important;
        line-height: 42px !important;
        text-align: center !important;
        text-decoration: none !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #666 !important;
        position: relative !important;
        margin: 4px !important;
        border-radius: 21px !important;
        transition: all 0.3s ease !important;
        background: transparent !important;
        z-index: 2 !important;
    }
    
    /* æ¿€æ´»çŠ¶æ€æ ·å¼ */
    .withdraw-page .transfertitle a.xz,
    body[class*="withdraw"] .transfertitle a.xz {
        background: linear-gradient(135deg, #297208, #90c695) !important;
        color: #fff !important;
        font-weight: 600 !important;
        /* å†…å‡¹é˜´å½±æ•ˆæžœ */
        box-shadow: 
            inset 2px 2px 4px rgba(127, 176, 105, 0.3),
            inset -2px -2px 4px rgba(138, 54, 185, 0.1),
            0 2px 6px rgba(127, 176, 105, 0.2) !important;
    }
    
    /* éžæ¿€æ´»çŠ¶æ€æ‚¬åœæ•ˆæžœ */
    .withdraw-page .transfertitle a.xz2:hover,
    .withdraw-page .transfertitle a.xz2:active,
    body[class*="withdraw"] .transfertitle a.xz2:hover,
    body[class*="withdraw"] .transfertitle a.xz2:active {
        background: rgba(127, 176, 105, 0.1) !important;
        color: #297208 !important;
        /* è½»å¾®å†…å‡¹æ•ˆæžœ */
        box-shadow: 
            inset 1px 1px 2px rgba(127, 176, 105, 0.1),
            inset -1px -1px 2px rgba(255, 255, 255, 0.8) !important;
    }
    
    /* ä¸ºåŒ…å«æçŽ°ç›¸å…³é¡µé¢çš„å®¹å™¨æ·»åŠ  ç±»åæ ‡è¯† */
    .content:has(.transfertitle) {
        /* è¿™é‡Œå¯ä»¥æ·»åŠ  é¢å¤–çš„å®¹å™¨æ ·å¼ */
    }
}

/* é¦–é¡µå›¾æ ‡æ ·å¼ */
.home-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('../images/home_CN.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    margin: -4px 8px 0 0;
    filter: drop-shadow(1px 1px 2px rgba(127, 176, 105, 0.3));
}

/* laydate图标样式 */
.laydate-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-image: url('../images/dateicon_cn.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    opacity: 1;
    transition: opacity 0.2s ease;
    z-index: 100;
    pointer-events: auto;
    display: block;
}

.laydate-icon:hover {
    opacity: 1;
    filter: drop-shadow(1px 1px 3px rgba(41, 114, 8, 0.3));
}

/* 为包含日历图标的span容器设置相对定位 */
span:has(.laydate-icon) {
    position: relative;
    display: inline-block;
    width: 100%;
}

/* 更通用的容器样式 */
.ordersearch span {
    position: relative;
    display: inline-block;
}

/* 为日期输入框留出右侧空间给图标 */
input[lay-laydate-id] {
    padding-right: 35px !important;
}

/* 用户状态面板样式 - 绿色系 */
.user-status-panel {
    background: #ffffff;
    border: 2px solid #90c695;
    border-radius: 20px;
    padding: 25px;
    margin: 10px 0;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 
        4px 4px 15px rgba(127, 176, 105, 0.15),
        -4px -4px 15px rgba(255, 255, 255, 0.9),
        inset 1px 1px 2px rgba(255, 255, 255, 0.6);
    position: relative;
    overflow: hidden;
}

.user-status-panel:hover {
    box-shadow: 
        6px 6px 20px rgba(127, 176, 105, 0.2),
        -6px -6px 20px rgba(255, 255, 255, 0.9),
        inset 1px 1px 3px rgba(255, 255, 255, 0.7);
    transform: translateY(-2px);
}

.user-status-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #297208, #90c695, #b8df25);
    border-radius: 20px 20px 0 0;
}

/* 面板头部 */
.status-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e8f5e8;
}

.panel-title {
    margin: 0;
    color: #297208;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.query-btn {
    background: linear-gradient(135deg, #b8df25, #90c695);
    color: #297208;
    border: none;
    border-radius: 25px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 2px 8px rgba(184, 223, 37, 0.3);
}

.query-btn:hover {
    background: linear-gradient(135deg, #a6c922, #7fb069);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(184, 223, 37, 0.4);
}

.query-btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(184, 223, 37, 0.3);
}

.query-icon {
    width: 16px;
    height: 16px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23297208" viewBox="0 0 24 24"><path d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
}

.loading-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #f0f8f0;
    border-top: 2px solid #297208;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 内容网格 */
.status-content-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}

/* 桌面端强制2行3列布局 */
@media screen and (min-width: 768px) {
    .status-content-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto auto;
    }
    
    /* 第一行：级别升级、重消提醒，第三列留空 */
    .status-item:nth-child(1) { grid-column: 1; grid-row: 1; }
    .status-item:nth-child(2) { grid-column: 2; grid-row: 1; }
    
    /* 第二行：实时小区、领导级别升级、段考核 */
    .status-item:nth-child(3) { grid-column: 1; grid-row: 2; }
    .status-item:nth-child(4) { grid-column: 2; grid-row: 2; }
    .status-item:nth-child(5) { grid-column: 3; grid-row: 2; }
}

/* 状态项 */
.status-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 20px;
    background: #f8faf9;
    border-radius: 15px;
    border: 1px solid #e8f5e8;
    transition: all 0.3s ease;
    position: relative;
}

.status-item:hover {
    background: #f0f8f0;
    border-color: #c8e6c9;
    transform: translateY(-1px);
}

/* 可点击项样式 */
.status-item.clickable-item {
    cursor: pointer;
}

.status-item.clickable-item:hover {
    background: #e8f5e8;
    border-color: #90c695;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(127, 176, 105, 0.2);
}

.status-item.clickable-item::before {
    content: '点击查看';
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: #297208;
    color: white;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
    font-weight: 500;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.status-item.clickable-item:hover::before {
    opacity: 1;
}

.status-item.instant-data::after {
    content: '实时';
    position: absolute;
    top: 8px;
    right: 8px;
    background: #4CAF50;
    color: white;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
    font-weight: 500;
}



/* 状态图标 */
.status-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(135deg, #297208, #4a7c59);
    position: relative;
    box-shadow: 0 2px 8px rgba(41, 114, 8, 0.3);
}

.status-icon::before {
    content: '';
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* 重消提醒图标 - 购物车 */
.repeat-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M17,18C15.89,18 15,18.89 15,20A2,2 0 0,0 17,22A2,2 0 0,0 19,20C19,18.89 18.1,18 17,18M1,2V4H3L6.6,11.59L5.24,14.04C5.09,14.32 5,14.65 5,15A2,2 0 0,0 7,17H19V15H7.42A0.25,0.25 0 0,1 7.17,14.75C7.17,14.7 7.18,14.66 7.2,14.63L8.1,13H15.55C16.3,13 16.96,12.58 17.3,11.97L20.88,5H5.21L4.27,2H1M7,18C5.89,18 5,18.89 5,20A2,2 0 0,0 7,22A2,2 0 0,0 9,20C9,18.89 8.1,18 7,18Z"/></svg>');
}

/* 补重消图标 - 加号圆圈 */
.repair-repeat-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M17,13H13V17H11V13H7V11H11V7H13V11H17V13Z"/></svg>');
}

/* 级别升级图标 - 上升箭头 */
.level-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M13,20H11V8L5.5,13.5L4.08,12.08L12,4.16L19.92,12.08L18.5,13.5L13,8V20Z"/></svg>');
}

/* 实时小区图标 - 雷达/监控 */
.district-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4M12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6M12,8A4,4 0 0,0 8,12A4,4 0 0,0 12,16A4,4 0 0,0 16,12A4,4 0 0,0 12,8M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,11A1,1 0 0,0 11,12A1,1 0 0,0 12,13A1,1 0 0,0 13,12A1,1 0 0,0 12,11Z"/></svg>');
}

/* 领导级别升级图标 - 皇冠 */
.leader-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M5,16L3,5L7,7L12,2L17,7L21,5L19,16H5M19,19A1,1 0 0,1 18,20H6A1,1 0 0,1 5,19V18H19V19Z"/></svg>');
}

/* 段考核图标 - 目标/靶心 */
.assessment-icon::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24"><path d="M6,2L18,2L22,8L12,22L2,8L6,2M6.5,3L17.5,3L20.5,8L12,19L3.5,8L6.5,3M11,4L13,4L13.74,6L10.26,6L11,4M7.5,7L9.5,7L8.5,11L7.5,7M10.5,7L13.5,7L12,15L10.5,7M14.5,7L16.5,7L15.5,11L14.5,7Z"/></svg>');
}

/* 状态信息 */
.status-info {
    flex: 1;
    min-width: 0;
}

.status-label {
    font-size: 14px;
    color: #297208;
    font-weight: 600;
    margin-bottom: 8px;
    letter-spacing: 0.3px;
}

.status-value {
    line-height: 1.5;
}

.status-value .amount {
    color: #297208;
    font-weight: 700;
    font-size: 18px;
    text-shadow: 1px 1px 2px rgba(41, 114, 8, 0.3);
}

.status-value .days,
.status-value .pv {
    display: inline-block;
    color: #297208;
    font-weight: 400;
    font-size: 14px;
    text-shadow: none;
}

/* 数字突出显示 */
.status-value .number {
    font-size: 18px;
    font-weight: 700;
    color: #297208;
    text-shadow: 1px 1px 2px rgba(41, 114, 8, 0.3);
}

.status-value .district-status {
    color: #4CAF50;
    font-weight: 600;
    margin-right: 8px;
}

.status-value .district-side {
    background: linear-gradient(135deg, #90c695, #b8df25);
    color: #297208;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.loading-placeholder {
    color: #90c695;
    font-style: italic;
    font-size: 13px;
}

/* 状态值行布局 */
.status-value-row {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    gap: 10px;
}

.status-info-text {
    flex: 1;
    text-align: left;
}

/* 领导级别升级结果区域优化 */
.leader-result {
    line-height: 1.5;
}

.leader-result .pv {
    margin: 0 12px 4px 0;
    padding: 1px 0;
    white-space: nowrap;
}

/* 移动端强制第二个元素换行 */
.leader-result .pv:nth-child(1)::after {
    content: "";
    
    width: 100%;
    height: 2px;
}


.leader-result .pv:last-child {
    margin-right: 0;
}

.leader-result .pv:only-child {
    margin: 0;
}

.leader-result .number {
    margin: 0 3px;
}

/* 统一操作按钮 - 绿色系 */
.action-btn {
    background: linear-gradient(135deg, #297208, #019843);
    color: white;
    border: none;
    border-radius: 15px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 6px rgba(41, 114, 8, 0.3);
    flex-shrink: 0;
    margin-left: auto;
}

.action-btn:hover {
    background: linear-gradient(135deg, #019843, #4a7c59);
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(41, 114, 8, 0.4);
}

/* 查询后可点击的卡片样式 */
.status-item.clickable-after-query {
    cursor: pointer;
}

.status-item.clickable-after-query:hover {
    background: linear-gradient(135deg, #f8fff8, #f0f9f0);
    transform: translateY(-2px);
    box-shadow: 
        6px 6px 20px rgba(127, 176, 105, 0.2),
        -6px -6px 20px rgba(255, 255, 255, 0.9),
        inset 1px 1px 2px rgba(255, 255, 255, 0.6);
}

/* 面板底部 */
.panel-footer {
    text-align: center;
    padding-top: 15px;
    border-top: 1px solid #e8f5e8;
}

.detail-hint {
    color: #90c695;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.3px;
}

/* 移动端适配 */
@media screen and (max-width: 768px) {
    .user-status-panel {
        padding: 20px 15px;
        margin: 10px 0;
        position: relative;
    }
    
    .status-panel-header {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .panel-title {
        text-align: center;
        font-size: 16px;
    }
    
    .query-btn {
        position: absolute;
        top: 15px;
        right: 15px;
        min-width: 100px;
        font-size: 12px;
        padding: 6px 12px;
        z-index: 10;
    }
    
    .status-content-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .status-item {
        padding: 15px;
        gap: 12px;
    }
    
    .status-icon {
        width: 36px;
        height: 36px;
        background: linear-gradient(135deg, #297208, #4a7c59);
        box-shadow: 0 2px 6px rgba(41, 114, 8, 0.4);
    }
    
    .status-icon::before {
        width: 20px;
        height: 20px;
    }
    
    .status-label {
        font-size: 13px;
    }
    
    .status-value .amount {
        font-size: 16px;
    }
    
    .status-value .days,
    .status-value .pv {
        font-size: 13px;
    }
    
    .status-value .number {
        font-size: 16px;
    }
    
    .action-btn {
        margin: 8px 0 0 0;
        padding: 6px 12px;
        font-size: 12px;
        width: auto;
        min-width: 80px;
    }
    
    .status-value-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .status-info-text {
        width: 100%;
        margin-bottom: 4px;
    }
}

@media screen and (max-width: 480px) {
    .user-status-panel {
        border-radius: 15px;
        padding: 15px 12px;
    }
    
    .status-item {
        padding: 12px;
        border-radius: 12px;
    }
    
    .status-icon {
        width: 32px;
        height: 32px;
        background: linear-gradient(135deg, #297208, #4a7c59);
        box-shadow: 0 2px 6px rgba(41, 114, 8, 0.4);
    }
    
    .status-icon::before {
        width: 18px;
        height: 18px;
    }
    
    .action-btn {
        display: block;
        margin: 8px 0 0 0;
        width: 100%;
    }
    
    /* 移动端领导级别升级结果优化 */
    .leader-result .pv {
        margin: 0 8px 3px 0;
        font-size: 13px;
    }
    
    
    
    .leader-result .number {
        margin: 0 2px;
    }
}

/* 分页样式 - 绿色系 */
.z-page {
    width: auto;
    margin: 0 auto;
    justify-content: center;
    margin-top: 25px;
    display: flex;
    align-items: center;
    gap: 15px;
}

/* PC端分页location样式 */
.location {
    display: flex;
    align-items: center;
    justify-content: center;
    
    margin-top: 5px;
}

/* PC端分页列表样式 */
.z-page ul {
    display: flex;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    justify-content: center;
}

.z-page ul li {
    color: #fff;
    background-color: #ccc;
    height: 20px;
    line-height: 20px;
    width: 20px;
    text-align: center;
    font-size: 10px;
    border-radius: 20px;
    margin-right: 5px;
}

.z-page ul li a {
    color: #fff;
}

#aUp {
    color: #297208;
}

#aDown {
    color: #297208;
}

.z-page ul li.z-select {
    background-color: #297208;
}

.z-page ul li:first-child, .z-page ul li:last-child {
    color: #297208;
    background-color: transparent;
    font-size: 16px;
    line-height: 18px;
}

.z-page .tolink {
    width: 43px;
    border-radius: 21px;
    border: 1px solid #ccc;
}

.z-page .z-btn {
    border: 1px solid #ccc;
    background-color: #297208;
    border-radius: 20px;
    width: 40px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    padding-left: 1px;
}

/* 绿色系 layui 提示框样式 - 现代化设计 */
.layui-layer-msg {
    background: linear-gradient(135deg, #ffffff, #f8fff8) !important;
    color: #297208 !important;
    border: 2px solid #90c695 !important;
    box-shadow: 0 8px 25px rgba(41, 114, 8, 0.15), 0 2px 10px rgba(144, 198, 149, 0.3) !important;
    border-radius: 20px !important;
    /* 删除backdrop-filter: blur(10px) !important; */
    position: fixed !important; /* 改为fixed */
    top: 50% !important;        /* 添加垂直居中 */
    left: 50% !important;       /* 添加水平居中 */
    transform: translate(-50%, -50%) !important; /* 确保真正居中 */
    min-width: 180px !important; /* 增加最小宽度 */
    z-index: 19891020 !important; /* 确保显示在最上层 */
    overflow: hidden !important;
}

.layui-layer-msg::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #b8df25, #90c695, #297208) !important;
    border-radius: 20px 20px 0 0 !important;
}

.layui-layer-msg .layui-layer-content {
    background-color: transparent !important;
    color: #297208 !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    padding: 18px 28px !important;
    line-height: 1.5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* 绿色主题消息框 - 优化版本 */
.layui-layer.green-theme-msg {
    background: linear-gradient(135deg, #ffffff, #f0f9f0) !important;
    border: 2px solid #b8df25 !important;
    border-radius: 18px !important;
    box-shadow: 
        0 10px 30px rgba(41, 114, 8, 0.2),
        0 4px 15px rgba(184, 223, 37, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
    position: relative !important;
    overflow: hidden !important;
}

.layui-layer.green-theme-msg::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #b8df25, #90c695, #297208) !important;
    border-radius: 18px 18px 0 0 !important;
}

.layui-layer.green-theme-msg .layui-layer-content {
    background-color: transparent !important;
    color: #297208 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    text-align: center !important;
    padding: 20px 30px !important;
    letter-spacing: 0.6px !important;
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
}

/* 成功图标绿色主题 - 现代化 */
.layui-layer.green-theme-msg .layui-layer-ico1 {
    background: linear-gradient(135deg, #b8df25, #90c695) !important;
    color: #297208 !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 8px rgba(184, 223, 37, 0.4) !important;
    flex-shrink: 0 !important;
}

.layui-layer.green-theme-msg .layui-layer-ico1::before {
    content: '✓' !important;
    color: #297208 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* 成功提示 */
.layui-layer-hui .layui-layer-content {
    color: #297208 !important;
}

/* 加载层绿色主题 */
.layui-layer-loading .layui-layer-content {
    background-color: rgba(255, 255, 255, 0.9) !important;
    border: 2px solid #90c695 !important;
}

.layui-layer-loading .layui-layer-loading1 {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"><circle cx="25" cy="25" r="20" fill="none" stroke="%23297208" stroke-width="4" stroke-dasharray="31.416" stroke-dashoffset="31.416"><animate attributeName="stroke-array" dur="2s" values="0 31.416;15.708 15.708;0 31.416" repeatCount="indefinite"/><animate attributeName="stroke-dashoffset" dur="2s" values="0;-15.708;-31.416" repeatCount="indefinite"/></circle></svg>') !important;
}



/* laydateæ—¥æœŸå¼¹å‡ºæ¡†ç»¿è‰²ç³»æ ·å¼ */
.layui-laydate {
    border: 1px solid #90c695 !important;
    box-shadow: 0 4px 12px rgba(41, 114, 8, 0.15) !important;
}

.layui-laydate-header {
    background-color: #297208 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #90c695 !important;
}

.layui-laydate-header i {
    color: #ffffff !important;
}

.layui-laydate-header i:hover {
    color: #90c695 !important;
}

.layui-laydate-content td.layui-this {
    background-color: #297208 !important;
    color: #ffffff !important;
}

.layui-laydate-content td.layui-this:hover {
    background-color: #90c695 !important;
}

.layui-laydate-content td:hover {
    background-color: #f0f8f0 !important;
    color: #297208 !important;
}


/* 覆盖默认的紫色样式 */
.layui-laydate-content td.layui-this div {
    background-color: #297208 !important;
    color: #ffffff !important;
}

.layui-laydate-content .layui-this {
    background-color: #297208 !important;
    color: #ffffff !important;
}
#layui-laydate1 td.layui-this>div{
    background-color: #297208 !important;
    color: #ffffff !important;
}

/* 链接样式 - 绿色系 */
.link {
    color: #297208 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.link:hover {
    color: #4a7c59 !important;
    text-decoration: underline !important;
}

.link:active {
    color: #1e5f06 !important;
}

/* 保存按钮加载状态样式 - 全局适用 */
button:disabled, input[type="button"]:disabled, .btn:disabled, .confirm:disabled {
    background: #ccc !important;
    cursor: not-allowed !important;
    opacity: 0.7 !important;
}

button:disabled:hover, input[type="button"]:disabled:hover, .btn:disabled:hover, .confirm:disabled:hover {
    opacity: 0.7 !important;
}

/* 自定义绿色主题加载动画样式 */
.layui-layer-loading .layui-layer-content {
    background: rgba(255, 255, 255, 0.95) !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(41, 114, 8, 0.25) !important;
}

.layui-layer-loading2 {
    width: 40px !important;
    height: 40px !important;
    background: none !important;
}

/* 绿色主题的旋转加载图标 */
.green-loading {
    width: 40px;
    height: 40px;
    border: 4px solid #e8f5e8;
    border-top: 4px solid #297208;
    border-radius: 50%;
    animation: green-spin 1s linear infinite;
    margin: 0 auto 15px;
}

@keyframes green-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 加载遮罩优化 - 绿色主题 */
.layui-layer-shade {
    background-color: rgba(41, 114, 8, 0.4) !important;
}

/* 自定义加载弹窗样式 */
.custom-loading-modal {
    border-radius: 15px !important;
    border: 2px solid #90c695 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 8px 25px rgba(41, 114, 8, 0.2), 0 4px 15px rgba(144, 198, 149, 0.3) !important;
    backdrop-filter: blur(5px) !important;
}

.custom-loading-content {
    text-align: center;
    padding: 25px 35px;
}

.custom-loading-text {
    color: #297208;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.5px;
}

/* layer.open 加载弹窗内容样式 */
.loading-content-wrapper {
    text-align: center;
    padding: 25px 35px;
}

.loading-text {
    color: #297208;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.5px;
}

/* layer.open 加载弹窗容器样式 */
.loading-modal {
    border-radius: 15px !important;
    border: 2px solid #90c695 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 8px 25px rgba(41, 114, 8, 0.2), 0 4px 15px rgba(144, 198, 149, 0.3) !important;
    backdrop-filter: blur(5px) !important;
}

/* 绿色主题遮罩层样式 */
.green-shade {
    background-color: rgba(41, 114, 8, 0.3) !important;
}

/* layer消息提示统一居中样式 */
.layer-msg-center {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 19891020 !important;
}

/* 成功消息样式 */
.success-msg {
    background: linear-gradient(135deg, #ffffff, #f8fff8) !important;
    color: #297208 !important;
    border: 2px solid #90c695 !important;
    box-shadow: 0 8px 25px rgba(41, 114, 8, 0.15), 0 2px 10px rgba(144, 198, 149, 0.3) !important;
    border-radius: 20px !important;
    min-width: 180px !important;
}

/* 警告/错误消息样式 */
.alert-msg {
    background: linear-gradient(135deg, #ffffff, #fff8f8) !important;
    color: #d32f2f !important;
    border: 2px solid #ffab91 !important;
    box-shadow: 0 8px 25px rgba(211, 47, 47, 0.15), 0 2px 10px rgba(255, 171, 145, 0.3) !important;
    border-radius: 20px !important;
    min-width: 180px !important;
}

.user-id img {
    height: 20px;
    vertical-align: middle;
    margin-right: 5px;
}


#Carousel > [carousel-item] > * {
    display: none !important;
  }
  #Carousel > [carousel-item] > .layui-this {
    display: block !important;
    position: static !important;
    height: auto !important;
    min-height: 1px !important;
    max-height: none !important;
    overflow: visible !important;
  }
  #Carousel img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

.layui-carousel > [carousel-item]:before {
  display: none !important;
  content: none !important;
}

@media screen and (max-width: 600px) {
    #Carousel,
    #Carousel > [carousel-item],
    #Carousel > [carousel-item] > .layui-this {
      height: auto !important;
      min-height: 1px !important;
      max-height: none !important;
      position: static !important;
      overflow: visible !important;
      display: block !important;
    }
    #Carousel > [carousel-item] > * {
      position: static !important;
    }
    #Carousel img {
      width: 100% !important;
      height: auto !important;
      display: block !important;
    }
  }
  

/* 等级图片基础样式 */
body .user-status-panel .status-panel-header img[src*="grade/"] {
    width: 60px !important;
    height: 60px !important;
    margin: 0 auto !important;
        display: block !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 4px rgba(41, 114, 8, 0.2) !important;
    transition: all 0.3s ease !important;
}

/* 等级图片悬停效果 */
body .user-status-panel .status-panel-header img[src*="grade/"]:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 4px 8px rgba(41, 114, 8, 0.3) !important;
}

