/* 下拉框文字显示修复 - 最高优先级 */

/* 强制应用正确的select样式 */
select.form-select,
select#filter-subject,
select#filter-grade,
select#filter-level,
select#sort-by,
select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  
  /* 自定义箭头 */
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="%2300d4ff" d="M6 8L0 0h12z"/></svg>') !important;
  background-repeat: no-repeat !important;
  background-position: right 20px center !important;
  background-size: 12px !important;
  
  /* 充足的padding，防止文字被遮挡和裁剪 */
  padding: 14px 52px 14px 20px !important;
  
  /* 尺寸 */
  min-width: 200px !important;
  min-height: 50px !important;  /* 增加最小高度 */
  
  /* 文字保护和显示完整 */
  white-space: nowrap !important;
  overflow: visible !important;  /* 改为visible，防止裁剪 */
  text-overflow: ellipsis !important;
  line-height: 1.8 !important;  /* 增加行高，防止文字底部被裁剪 */
  
  /* 字体 */
  font-size: 16px !important;
  font-weight: 500 !important;
  
  /* 垂直对齐 */
  display: inline-flex !important;
  align-items: center !important;
}

/* 悬停效果 */
select.form-select:hover,
select#filter-subject:hover,
select#filter-grade:hover,
select#filter-level:hover,
select#sort-by:hover,
select:hover {
  border-color: var(--color-primary) !important;
  transform: translateY(-1px) !important;
}

/* 下拉选项列表样式（多浏览器兼容） */
select.form-select option,
select#filter-subject option,
select#subject option,
select#filter-level option,
select#sort-by option,
select option {
  background-color: #1e293b !important;  /* 使用固定暗色 */
  background: #1e293b !important;
  color: #e2e8f0 !important;
  padding: 12px 20px !important;
}

/* WebKit浏览器（Chrome、Edge、Safari） */
@supports (-webkit-appearance: none) {
  select option {
    background-color: #1e293b !important;
    background: #1e293b !important;
    color: #e2e8f0 !important;
  }
}

/* Firefox浏览器 */
@-moz-document url-prefix() {
  select option {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
  }
}

/* 选中的选项 */
select.form-select option:checked,
select option:checked {
  background-color: #667eea !important;
  background: #667eea !important;
  color: white !important;
  font-weight: 600 !important;
}

/* 悬停的选项 */
select.form-select option:hover,
select option:hover {
  background-color: rgba(102, 126, 234, 0.5) !important;
  background: rgba(102, 126, 234, 0.5) !important;
  color: white !important;
}

/* 针对Edge浏览器的特殊处理 */
select::-ms-expand {
  display: none;
}

/* 如果浏览器不支持option样式，至少让select本身保持暗色 */
select {
  color-scheme: dark !important;
}

