﻿.custom-language-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    height: 30px !important;
    min-width: 100px !important;
    padding: 0 25px 0 10px !important;
    /* 改用 middle，並微調 margin-top */
    display: inline-block !important;
    vertical-align: middle !important;
    margin-top: 8px !important; 

    font-size: 14px !important;
    color: #333 !important;
    line-height: 28px !important;
    background-color: #ffffff !important;
    border: 1px solid #ccc !important;
    border-radius: 5px !important;
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23666' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 8px center !important;
}

.language-selector {
    display: block !important; /* 或者 inline-block */
    float: right !important; /* 強制它跟著登入按鈕一起往右靠 */
    height: 58px !important;
    line-height: 58px !important;
    margin-right: 10px !important;
}
.language-modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
}

.language-content {
    background: #fff;
    padding: 20px;
    width: 80vw;
    height: 250px;
    margin: 15% auto;
    border-radius: 8px;
    text-align: center;
}
.language-selector-view {
    width: 25vw;
    border: 5px;
    background-color: #f0f0f0;
}