/* ============================================================
   head-missav.css  —  頁首:常駐搜尋條(頁首第二列,固定於版面,非浮動)
   全站共用頁首,PC 生效;行動版頁首為獨立區塊,不受影響。
   ============================================================ */

@media screen and (min-width:820px){

    /* 頁首內容對齊內容欄(30rem 置中);底色列仍滿版 */
    #topnav .head_box.show-pc .header{
        max-width:30rem;
        margin-left:auto;
        margin-right:auto;
        box-sizing:border-box;
    }

    /* 第一列:logo(左) + 選單(左) …… 語言(右) */
    #topnav .head_box.show-pc .head_a{
        gap:8px;
        justify-content:flex-start !important;
        padding-left:0;
        padding-right:0;
    }
    #topnav .head_box.show-pc .head_logo{ order:1; }
    #topnav .head_box.show-pc .head_menu_a{ order:2; flex:0 1 auto; min-width:0; margin-right:auto; }
    #topnav .head_box.show-pc .head-search-toggle,
    #topnav .head_box.show-pc .head-search-link{ order:3; }
    #topnav .head_box.show-pc .head_user{ order:4; }

    /* 放大鏡(語言左邊) */
    #topnav .head_box.show-pc .head-search-toggle,
    #topnav .head_box.show-pc .head-search-link{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:30px;
        height:38px;
        padding:0;
        background:transparent;
        border:0;
        border-radius:8px;
        color:var(--tpl-text,#ddd);
        text-decoration:none;
        cursor:pointer;
        transition:color .15s ease, background .15s ease;
    }
    #topnav .head_box.show-pc .head-search-toggle:hover,
    #topnav .head_box.show-pc .head-search-link:hover{
        color:var(--tpl-accent,#40cc92);
        background:rgba(255,255,255,.06);
    }
    #topnav .head_box.show-pc .head-search-toggle svg,
    #topnav .head_box.show-pc .head-search-link svg{ width:22px; height:22px; display:block; }

    /* ===== 點放大鏡在頁首下方展開的搜尋面板(絕對定位,不改頁首高度) ===== */
    #topnav .head_box.show-pc .head-search-panel{
        position:absolute;
        top:100%;
        left:0;
        right:0;
        width:100%;
        z-index:99998;
        padding:14px 16px;
        background:var(--tpl-bg-base,#16151b);
        border-top:1px solid var(--tpl-border-soft,#2a2a2a);
        border-bottom:1px solid var(--tpl-border-soft,#2a2a2a);
        box-shadow:0 12px 28px rgba(0,0,0,.5);
        box-sizing:border-box;
    }
    #topnav .head_box.show-pc .head-search-panel[hidden]{ display:none; }
    #topnav .head_box.show-pc .head-search-panel__inner{ max-width:720px; margin:0 auto; }
    #topnav .head_box.show-pc .head-search-panel__form{
        display:flex;
        align-items:stretch;
        width:100%;
        border:2px solid #5e81ac;
        border-radius:6px;
        background:#3b4252;
        overflow:hidden;
        box-sizing:border-box;
    }
    #topnav .head_box.show-pc .head-search-panel__input{
        flex:1 1 auto;
        min-width:0;
        height:46px;
        border:0;
        outline:0;
        background:transparent;
        padding:0 16px;
        font-size:15px;
        color:#e5e9f0;
        box-sizing:border-box;
    }
    #topnav .head_box.show-pc .head-search-panel__input::placeholder{ color:#9aa4b8; }
    #topnav .head_box.show-pc .head-search-panel__btn{
        flex-shrink:0;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:6px;
        height:46px;
        padding:0 22px;
        border:0;
        background:#434c5e;
        color:#eceff4;
        font-size:15px;
        cursor:pointer;
        transition:background .15s ease;
    }
    #topnav .head_box.show-pc .head-search-panel__btn:hover{ background:#4c566a; }
    #topnav .head_box.show-pc .head-search-panel__btn svg{ width:18px; height:18px; }

    /* ===== 第二列:搜尋條(預設隱藏,點放大鏡才顯示;顯示時固定在版面上) ===== */
    #topnav .head_box.show-pc .head_search_row_fixed{
        display:none;
        width:100%;
        padding:2px 0 12px;
        box-sizing:border-box;
    }
    #topnav .head_box.show-pc.is-search-open .head_search_row_fixed{
        display:block;
    }
    #topnav .head_box.show-pc .head_search_row_fixed .head_search,
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_inner{
        width:100%;
        position:relative;
    }
    /* 定位容器需有高度(=膠囊高),下拉 top:100% 才會落在輸入框下方而非蓋住 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_inner{
        min-height:46px;
    }
    /* 外層 row / form 撐滿,避免塌陷 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_row,
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_row_capsule,
    #topnav .head_box.show-pc .head_search_row_fixed #search,
    #topnav .head_box.show-pc .head_search_row_fixed form{
        display:block;
        width:100%;
        margin:0;
    }
    /* 膠囊:明確高度,不再塌成一條線 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule{
        display:flex !important;
        align-items:center;
        width:100%;
        height:46px;
        min-height:46px;
        box-sizing:border-box;
        border-radius:24px;
        padding:0 6px 0 12px;
    }
    /* 輸入格撐滿中間 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field{
        flex:1 1 auto !important;
        min-width:0;
        height:100%;
        display:flex;
        align-items:center;
    }
    /* 輸入框:填滿、透明底、亮字 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field .mac_wd,
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field input{
        width:100% !important;
        height:100%;
        min-width:0;
        box-sizing:border-box;
        background:transparent;
        border:0;
        outline:0;
        font-size:14px;
        color:var(--tpl-text-strong,#f3f4f6);
    }
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field input::placeholder{
        color:#8a8a93;
    }
    /* 火焰圖示、送出按鈕不縮 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_hot,
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_submit{
        flex-shrink:0;
    }
    /* 搜索历史:固定顯示在輸入框下方(常駐、正常流,不再浮動也不隱藏) */
    #topnav .head_box.show-pc .head_search_row_fixed .mac_results_hot{
        display:block !important;
        position:static !important;
        width:100%;
        margin-top:8px;
    }

    /* ===== 搜尋框樣式:nord 藍灰矩形(參考款) ===== */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule{
        background:#3b4252 !important;
        border:1px solid #4c566a !important;
        border-radius:6px !important;
        padding:0 0 0 14px !important;
        gap:0 !important;
        overflow:hidden;
    }
    /* 去掉左側火焰圖示 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_hot{
        display:none !important;
    }
    /* 輸入文字 / placeholder */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field .mac_wd,
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field input{
        color:#e5e9f0 !important;
    }
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_field input::placeholder{
        color:#9aa4b8 !important;
    }
    /* 送出按鈕:藍灰底、白字、方角、貼右緣 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_submit{
        background:#4c566a !important;
        color:#eceff4 !important;
        border:0 !important;
        border-radius:0 !important;
        height:100% !important;
        min-width:auto !important;
        margin:0 !important;
        padding:0 20px !important;
        gap:6px;
        align-self:stretch;
    }
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_submit span{
        color:#eceff4 !important;
        font-size:14px;
    }
    /* 隱藏 AI gif,改用白色放大鏡圖示 */
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_ai_ico{
        display:none !important;
    }
    #topnav .head_box.show-pc .head_search_row_fixed .head_search_capsule_submit::before{
        content:"";
        width:16px;
        height:16px;
        flex-shrink:0;
        display:inline-block;
        background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23eceff4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.35-4.35'/%3E%3C/svg%3E");
    }
}

/* ===== 自訂頁首 logo 圖片尺寸(全裝置) ===== */
.mac-logo--head-custom{ display:flex; align-items:center; }
.mac-logo-custom-img{
    display:block;
    height:auto;
    width:auto;
    max-height:42px;
    max-width:220px;
    object-fit:contain;
}
@media (max-width:820px){
    .mac-logo-custom-img{ max-height:34px; max-width:160px; }
}

/* ===== 手機頁首單列(logo 左 + 搜尋/語言/全部分类 右) ===== */
@media (max-width:820px){
    .head_box.show-mobile .header .head_a{
        display:flex !important;
        align-items:center;
        justify-content:space-between;
        width:100%;
        box-sizing:border-box;
        padding:8px 12px;
        height:auto !important;
    }
    .head_box.show-mobile .head_logo{ flex:0 0 auto; }
    .head_box.show-mobile .mh-actions{
        display:flex;
        align-items:center;
        gap:18px;
    }
    .head_box.show-mobile .mh-actions .mh-ico{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        color:var(--tpl-text,#ddd);
        text-decoration:none;
        cursor:pointer;
        position:relative;
        line-height:1;
    }
    .head_box.show-mobile .mh-actions .mh-ico svg{ width:24px; height:24px; display:block; }
    .head_box.show-mobile .mh-actions .mh-ico .iconfont{ font-size:24px; line-height:1; }
    .head_box.show-mobile .mh-actions .change-lang .lang-txt{ display:none; }
    .head_box.show-mobile .mh-actions .change-lang .has-lang{ width:24px; height:24px; display:inline-block; }
    /* 全部分类下拉沿用既有 all_menu 樣式,只確保觸發鈕乾淨 */
    .head_box.show-mobile .mh-menu .menu span{ display:none; }
}
