@charset "utf-8";

/* 1. 標頭基礎穩定設定 */
#header { 
    height: 212px; 
    position: relative; 
}
#nav { 
    top: 150px; 
}

/* --- 搜尋欄核心修正：鎖定背景、按鈕強制右對齊 --- */

/* 2. 外層容器：鎖定總寬度 420px，並強制顯示 */
.otlink-google-cse {
    position: absolute !important;
    top: 92px !important;    
    right: 3% !important;    
    width: 420px !important; 
    height: 42px !important; 
    z-index: 9999 !important;
    display: block !important;
    visibility: visible !important; /* 強制現身 */
    opacity: 1 !important;        /* 防止透明度被腳本改掉 */
}

/* 3. 背景圖容器：鎖定 auto 38px，確保字體比例完美 */
.gsc-input-box {
    background: #fff url("https://www.hongyi-craft.com.tw/images/hongyi-cse.jpg") no-repeat left center !important;
    /* ★ 核心鎖定：寬度自動以維持文字比例，高度配合框線 */
    background-size: auto 38px !important; 
    height: 40px !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    position: relative !important; 
    box-shadow: none !important;
}

/* 4. 透明化層級：確保背景字體透出 */
.gsc-control-cse, 
.gsc-control-cse *,
.gsc-input,
td.gsc-input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 5. 搜尋按鈕：強制釘在最右側，完全不干擾背景圖比例 */
td.gsc-search-button {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    padding: 0 !important;
    width: 60px !important;
    height: 40px !important;
}

button.gsc-search-button,
button.gsc-search-button-v2 {
    background-color: #555 !important; /* 按鈕深灰色 */
    height: 40px !important;
    width: 60px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 4px 4px 0 !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* 6. 放大鏡圖示 */
.gsc-search-button svg {
    fill: #ffffff !important;
    width: 20px !important;
    height: 20px !important;
}

/* 7. 文字偏移：避開左側背景字體，並統一字體大小 */
input.gsc-input {
    padding-left: 60px !important; 
    font-size: 16px !important;
    height: 38px !important;
    color: #333 !important;
    background: none !important;
}

/* 徹底移除 Google 預設干擾 */
.gsc-input input.gsc-input { background: none !important; }