/**
 * 註冊頁面 - 下拉選單自定義樣式
 * 覆蓋 standard-dropdown.css 以匹配註冊精靈的配色
 */

/* 下拉按鈕樣式 */
.register-wrapper .bootstrap-select .dropdown-toggle {
    border: 2px solid #e2e8f0 !important;
    background: #f1f5f9 !important;
    color: #1e293b !important;
    border-radius: 8px !important;
    padding: 0.75rem 1rem !important;
    min-height: 48px !important;
    font-size: 1rem !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.register-wrapper .bootstrap-select .dropdown-toggle:hover {
    border-color: #cbd5e1 !important;
    background: #ffffff !important;
}

.register-wrapper .bootstrap-select.show .dropdown-toggle,
.register-wrapper .bootstrap-select .dropdown-toggle:focus {
    border-color: #6366f1 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1) !important;
    outline: none !important;
}

/* 下拉選單容器 */
.register-wrapper .bootstrap-select .dropdown-menu {
    border: 2px solid #6366f1 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12) !important;
    padding: 0.5rem 0 !important;
    margin-top: 4px !important;
}

/* 搜尋框樣式 */
.register-wrapper .bootstrap-select .bs-searchbox input {
    border: 2px solid #e2e8f0 !important;
    border-radius: 6px !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.95rem !important;
    margin: 0.5rem !important;
    width: calc(100% - 1rem) !important;
    transition: all 0.3s ease !important;
}

.register-wrapper .bootstrap-select .bs-searchbox input:focus {
    border-color: #6366f1 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1) !important;
    outline: none !important;
}

/* 選項樣式 */
.register-wrapper .bootstrap-select .dropdown-menu li a {
    padding: 0.65rem 1rem !important;
    color: #1e293b !important;
    font-size: 0.95rem !important;
    transition: all 0.2s ease !important;
}

.register-wrapper .bootstrap-select .dropdown-menu li a:hover {
    background: #f1f5f9 !important;
    color: #4f46e5 !important;
}

/* 選中的選項 */
.register-wrapper .bootstrap-select .dropdown-menu li.selected a,
.register-wrapper .bootstrap-select .dropdown-menu li.active a {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%) !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

.register-wrapper .bootstrap-select .dropdown-menu li.selected.active a {
    background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%) !important;
}

/* 勾選圖示 */
.register-wrapper .bootstrap-select .dropdown-menu li.selected a .check-mark {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* 禁用狀態 */
.register-wrapper .bootstrap-select.disabled .dropdown-toggle,
.register-wrapper .bootstrap-select .dropdown-toggle:disabled {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

/* 讓下拉選單與表單輸入框風格一致 */
.register-wrapper .form-group-modern select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

/* 確保下拉選單在 Step 4 中的間距 */
#step4 .bootstrap-select {
    display: block;
    width: 100%;
}

#step4 .bootstrap-select .dropdown-toggle {
    width: 100%;
    text-align: left;
}

/* 下拉箭頭圖示優化 */
.register-wrapper .bootstrap-select .dropdown-toggle::after {
    border-top-color: #64748b !important;
    transition: transform 0.3s ease !important;
}

.register-wrapper .bootstrap-select.show .dropdown-toggle::after {
    border-top-color: #6366f1 !important;
    transform: rotate(180deg) !important;
}

/* 無結果提示 */
.register-wrapper .bootstrap-select .no-results {
    padding: 1rem !important;
    color: #64748b !important;
    text-align: center !important;
    font-size: 0.9rem !important;
}