/**
 * 全局下拉框样式修复
 * 解决白色背景+白色文字导致看不见的问题
 * 适用于全站所有页面
 */

/* 基础下拉框样式 - 深色背景 + 白色文字 */
select {
    background-color: rgba(22, 22, 26, 0.95) !important;
    background-image: none !important;
    color: white !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

/* 下拉选项样式 - 深色背景 + 白色文字 */
select option {
    background-color: #16161a !important;
    color: white !important;
    padding: 8px 12px !important;
}

/* 选中状态的选项 */
select:focus option:checked,
select option:checked {
    background-color: rgba(242, 127, 13, 0.3) !important;
    color: white !important;
}

/* 悬停状态的选项 */
select option:hover {
    background-color: rgba(242, 127, 13, 0.2) !important;
    color: white !important;
}

/* 聚焦状态 */
select:focus {
    background-color: rgba(22, 22, 26, 0.95) !important;
    color: white !important;
    border-color: rgba(242, 127, 13, 0.5) !important;
    outline: none !important;
}

/* 禁用状态 */
select:disabled {
    background-color: rgba(22, 22, 26, 0.5) !important;
    color: rgba(255, 255, 255, 0.5) !important;
    cursor: not-allowed !important;
}

/* 针对不同主题的适配 */
body.dark select,
html.dark select {
    background-color: rgba(22, 22, 26, 0.95) !important;
    color: white !important;
}

body.dark select option,
html.dark select option {
    background-color: #16161a !important;
    color: white !important;
}

/* 确保下拉框文字始终可见 */
select::-ms-expand {
    display: none;
}

/* 针对特定页面的额外修复 */
select.bg-white,
select.bg-white\/5,
select.bg-transparent {
    background-color: rgba(22, 22, 26, 0.95) !important;
    color: white !important;
}

select.text-gray-300,
select.text-gray-400,
select.text-slate-100 {
    color: white !important;
}
