.nf-form-content .submit-container {
    text-align: right !important;
    display: block !important;
}

/* 1. 讓整排篩選器組件在 Widget 區域保持橫向排列 (如果是放在同一個 flex 容器內) */
.widget_layered_nav {
    display: inline-block;
    vertical-align: top;
    margin-right: 15px;
    margin-bottom: 15px;
}

/* 2. 移除原本的大標題(H3)佔位，或讓它變成上方小字提示 */
.woocommerce-widget-layered-nav h3 {
    font-size: 14px;
    color: #b59556; /* 根據你原圖的金色調整 */
    margin-bottom: 5px;
    font-weight: normal;
}

/* 3. 核心修正：將表單改為 flex 布局，讓下拉選單和「套用」按鈕強行排在同一行 */
form.woocommerce-widget-layered-nav-dropdown {
    display: flex !important;
    align-items: center !important;
    position: relative;
}

/* 4. 修正下拉選單樣式，確保有或沒有按鈕時寬度都正常 */
form.woocommerce-widget-layered-nav-dropdown select.woocommerce-widget-layered-nav-dropdown {
    display: inline-block !important;
    height: 36px !important;
    padding: 0 30px 0 10px !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    background-color: #fff !important;
    font-size: 14px !important;
    color: #666 !important;
    cursor: pointer;
    -webkit-appearance: none; /* 隱藏原生箭頭，改用自定義 */
    -moz-appearance: none;
    appearance: none;
    min-width: 150px;
    max-width: 200px;
}

/* 5. 針對有 multiple 屬性的下拉框進行特殊修復（避免它變成傳統的多選高盒子） */
form.woocommerce-widget-layered-nav-dropdown select[multiple="multiple"] {
    height: 36px !important; /* 強制與單選一樣高度 */
    overflow: hidden !important; /* 防止展開 */
}

/* 6. 美化「套用」按鈕，讓它緊貼在下拉框右側或優雅地靠在旁邊 */
button.woocommerce-widget-layered-nav-dropdown__submit {
    display: inline-block !important;
    height: 36px !important;
    margin-left: 5px !important; /* 與下拉框的間距 */
    padding: 0 12px !important;
    background-color: #ffffff !important;
    border: 1px solid #999 !important;
    border-radius: 4px !important;
    color: #333 !important;
    font-size: 13px !important;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

button.woocommerce-widget-layered-nav-dropdown__submit:hover {
    background-color: #b59556 !important;
    color: #fff !important;
    border-color: #b59556 !important;
}

/* 7. 為下拉選單加上小箭頭圖標（替代原本跑位的自訂箭頭） */
form.woocommerce-widget-layered-nav-dropdown::after {
    content: "▼";
    font-size: 10px;
    color: #999;
    position: absolute;
    right: 12px;
    /* 如果有套用按鈕，要把箭頭往左移，避免疊在按鈕上 */
    pointer-events: none;
}
/* 如果表單內包含按鈕，將箭頭向左移到下拉框內部 */
form.woocommerce-widget-layered-nav-dropdown:has(button)::after {
    right: 65px; 
}