/* 语言选择器样式 */
.lang {
    position: relative;
}

.lang-icon {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}

.lang-drop {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
}

.lang-drop.active,
.lang:hover .lang-drop {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-wrap {
    list-style: none;
    margin: 0;
    padding: 8px 0;
}

.lang-wrap li {
    margin: 0;
}

.lang-wrap li a {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    color: #333;
    text-decoration: none;
    transition: background 0.2s;
}

.lang-wrap li a:hover {
    background: #f5f5f5;
}

.lang-wrap li.lang-active a {
    background: #e8f4f8;
    color: #1890ff;
    font-weight: 500;
}

.lang-arrow {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 8px;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #666;
}

/* Local language flag icons */
.lang-wrap li a span[class^="lang-"], .lang-wrap li a span[class*=" lang-"]{display:inline-block;width:20px;height:14px;margin-right:8px;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex:0 0 20px;}
.lang-af{background-image:url("../img/language/af.webp");}
.lang-ar{background-image:url("../img/language/ar.webp");}
.lang-ba{background-image:url("../img/language/ba.webp");}
.lang-bg{background-image:url("../img/language/bg.webp");}
.lang-ca{background-image:url("../img/language/ca.webp");}
.lang-cn{background-image:url("../img/language/cn.webp");}
.lang-cy{background-image:url("../img/language/cy.webp");}
.lang-cz{background-image:url("../img/language/cz.webp");}
.lang-de{background-image:url("../img/language/de.webp");}
.lang-dk{background-image:url("../img/language/dk.webp");}
.lang-ee{background-image:url("../img/language/ee.webp");}
.lang-en{background-image:url("../img/language/en.webp");}
.lang-es{background-image:url("../img/language/es.webp");}
.lang-fi{background-image:url("../img/language/fi.webp");}
.lang-fj{background-image:url("../img/language/fj.webp");}
.lang-fr{background-image:url("../img/language/fr.webp");}
.lang-gr{background-image:url("../img/language/gr.webp");}
.lang-hr{background-image:url("../img/language/hr.webp");}
.lang-ht{background-image:url("../img/language/ht.webp");}
.lang-hu{background-image:url("../img/language/hu.webp");}
.lang-id{background-image:url("../img/language/id.webp");}
.lang-il{background-image:url("../img/language/il.webp");}
.lang-it{background-image:url("../img/language/it.webp");}
.lang-ja{background-image:url("../img/language/ja.webp");}
.lang-ko{background-image:url("../img/language/ko.webp");}
.lang-lt{background-image:url("../img/language/lt.webp");}
.lang-lv{background-image:url("../img/language/lv.webp");}
.lang-mt{background-image:url("../img/language/mt.webp");}
.lang-mww{background-image:url("../img/language/mww.webp");}
.lang-my{background-image:url("../img/language/my.webp");}
.lang-nl{background-image:url("../img/language/nl.webp");}
.lang-no{background-image:url("../img/language/no.webp");}
.lang-otq{background-image:url("../img/language/otq.webp");}
.lang-pk{background-image:url("../img/language/pk.webp");}
.lang-pl{background-image:url("../img/language/pl.webp");}
.lang-pt{background-image:url("../img/language/pt.webp");}
.lang-ro{background-image:url("../img/language/ro.webp");}
.lang-ru{background-image:url("../img/language/ru.webp");}
.lang-se{background-image:url("../img/language/se.webp");}
.lang-si{background-image:url("../img/language/si.webp");}
.lang-sk{background-image:url("../img/language/sk.webp");}
.lang-srcyrl{background-image:url("../img/language/srcyrl.webp");}
.lang-srla{background-image:url("../img/language/srla.webp");}
.lang-th{background-image:url("../img/language/th.webp");}
.lang-tlh{background-image:url("../img/language/tlh.webp");}
.lang-tr{background-image:url("../img/language/tr.webp");}
.lang-ua{background-image:url("../img/language/ua.webp");}
.lang-vn{background-image:url("../img/language/vn.webp");}
.lang-yua{background-image:url("../img/language/yua.webp");}

/* Unified language menu component */
.head-lang{
    position:relative !important;
    flex:0 0 auto !important;
    margin-left:20px !important;
    margin-right:0 !important;
    z-index:10020 !important;
}

.head-lang .lang{
    position:relative !important;
}

.head-lang .lang-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    min-width:132px !important;
    height:38px !important;
    padding:0 14px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-radius:999px !important;
    background:var(--hovercolor,#1d8f5f) !important;
    color:#fff !important;
    box-sizing:border-box !important;
    cursor:pointer !important;
    user-select:none !important;
    white-space:nowrap !important;
}

.head-lang .lang-icon img{
    display:block !important;
    width:22px !important;
    height:22px !important;
    object-fit:contain !important;
    filter:none !important;
    flex:0 0 22px !important;
}

.head-lang .lang-icon span{
    display:inline-flex !important;
    align-items:center !important;
    position:relative !important;
    max-width:92px !important;
    margin:0 !important;
    padding:0 14px 0 0 !important;
    color:inherit !important;
    font-size:14px !important;
    line-height:1 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

.head-lang .lang-icon span::before{
    display:none !important;
    content:none !important;
}

.head-lang .lang-icon span::after{
    content:"" !important;
    position:absolute !important;
    right:0 !important;
    top:50% !important;
    width:0 !important;
    height:0 !important;
    margin-top:-2px !important;
    border-left:4px solid transparent !important;
    border-right:4px solid transparent !important;
    border-top:5px solid currentColor !important;
    background:transparent !important;
    transform:none !important;
}

.head-lang .lang-drop,
.head-lang .lang-drop.lang-flex{
    display:block !important;
    position:absolute !important;
    top:calc(100% + 12px) !important;
    right:0 !important;
    left:auto !important;
    width:320px !important;
    max-width:calc(100vw - 24px) !important;
    max-height:420px !important;
    padding:8px !important;
    overflow:auto !important;
    box-sizing:border-box !important;
    background:#fff !important;
    border:1px solid rgba(0,0,0,.08) !important;
    border-radius:8px !important;
    box-shadow:0 16px 40px rgba(0,0,0,.16) !important;
    opacity:0 !important;
    visibility:hidden !important;
    transform:translateY(8px) !important;
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease !important;
    z-index:10030 !important;
}

.head-lang .lang:hover .lang-drop,
.head-lang .lang-drop.active,
.head-lang .lang:focus-within .lang-drop{
    top:calc(100% + 8px) !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:translateY(0) !important;
}

.head-lang .lang-arrow{
    display:block !important;
    position:absolute !important;
    top:-7px !important;
    right:22px !important;
    left:auto !important;
    width:12px !important;
    height:12px !important;
    margin:0 !important;
    border:1px solid rgba(0,0,0,.08) !important;
    border-right:0 !important;
    border-bottom:0 !important;
    background:#fff !important;
    transform:rotate(45deg) !important;
}

.head-lang .lang-wrap,
.head-lang .lang-flex .lang-wrap{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:4px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    box-sizing:border-box !important;
}

.head-lang .lang-wrap li,
.head-lang .lang-flex .lang-wrap li{
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:6px !important;
    background:transparent !important;
    box-sizing:border-box !important;
}

.head-lang .lang-wrap li a{
    display:flex !important;
    align-items:center !important;
    min-height:34px !important;
    padding:7px 9px !important;
    border-radius:6px !important;
    color:#333 !important;
    font-size:13px !important;
    line-height:1.2 !important;
    text-decoration:none !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    box-sizing:border-box !important;
}

.head-lang .lang-wrap li:hover,
.head-lang .lang-wrap li.lang-active{
    background:transparent !important;
}

.head-lang .lang-wrap li a:hover{
    background:#f3f7f5 !important;
    color:var(--hovercolor,#1d8f5f) !important;
}

.head-lang .lang-wrap li.lang-active a{
    background:rgba(29,143,95,.12) !important;
    color:var(--hovercolor,#1d8f5f) !important;
    font-weight:600 !important;
}

.head-lang .lang-wrap li a span[class^="lang-"],
.head-lang .lang-wrap li a span[class*=" lang-"]{
    display:inline-block !important;
    width:20px !important;
    height:14px !important;
    margin:0 8px 0 0 !important;
    border-radius:2px !important;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    box-shadow:0 0 0 1px rgba(0,0,0,.08) !important;
    flex:0 0 20px !important;
}

@media (max-width:1024px){
    .head-lang{
        margin-left:auto !important;
        margin-right:10px !important;
    }
    .head-lang .lang-icon{
        min-width:44px !important;
        width:44px !important;
        height:38px !important;
        padding:0 !important;
        background:transparent !important;
        border-color:rgba(0,0,0,.08) !important;
        color:var(--hovercolor,#1d8f5f) !important;
    }
    .head-lang .lang-icon span{
        display:none !important;
    }
    .head-lang .lang-icon img{
        width:28px !important;
        height:28px !important;
    }
    .head-lang .lang-drop,
    .head-lang .lang-drop.lang-flex{
        position:absolute !important;
        right:0 !important;
        left:auto !important;
        width:min(320px,calc(100vw - 24px)) !important;
        max-height:70vh !important;
        transform:translateY(8px) !important;
    }
}

@media (max-width:480px){
    .head-lang .lang-drop,
    .head-lang .lang-drop.lang-flex{
        right:-54px !important;
        width:calc(100vw - 24px) !important;
    }
    .head-lang .lang-arrow{
        right:76px !important;
    }
    .head-lang .lang-wrap,
    .head-lang .lang-flex .lang-wrap{
        grid-template-columns:1fr !important;
    }
}

.footer-friend-links{
    margin-top:8px;
    font-size:12px;
    line-height:1.6;
    color:rgba(255,255,255,.62);
}

.footer-friend-links span{
    margin-right:4px;
}

.footer-friend-links a{
    color:rgba(255,255,255,.72);
    text-decoration:none;
}

.footer-friend-links a:hover{
    color:#fff;
    text-decoration:underline;
}