/*
 * Redmine Select Search - 让 select2 融入 Redmine 3.x / 4.x 的过滤器样式
 * Redmine 原生规则: fieldset#filters td.values select { min-width: 130px; }
 */

/* 原生 select 的宽度基准,供 select2 的 width:'resolve' 测量 */
fieldset#filters td.values select.value {
  width: 200px;
}

/* 即使 select 在隐藏容器中初始化,也保证下拉有可用宽度 */
fieldset#filters .select2-container {
  min-width: 130px;
  max-width: 320px;
  vertical-align: middle;
}

/* 与 Redmine 12px 字号、小控件高度对齐 */
fieldset#filters .select2-container .select2-selection--single,
fieldset#filters .select2-container .select2-selection--multiple {
  min-height: 24px;
  padding: 0 4px;
  font-size: 12px;
}

fieldset#filters .select2-container .select2-selection--single .select2-selection__rendered {
  padding: 0 18px 0 0;
  font-size: 12px;
  line-height: 22px;
}

fieldset#filters .select2-container .select2-selection--single .select2-selection__arrow {
  height: 22px;
}

fieldset#filters .select2-selection--multiple .select2-selection__choice {
  margin: 2px 2px 0 0;
  padding: 0 5px;
  font-size: 12px;
  line-height: 18px;
}

fieldset#filters .select2-container .select2-selection--multiple .select2-search--inline .select2-search__field {
  min-width: 80px;
  margin-top: 3px;
  font-size: 12px;
  line-height: 16px;
}

/* 下拉面板:字号对齐,层级高于 Redmine 的 tabs / 表格表头 */
.select2-dropdown {
  z-index: 1051;
  font-size: 12px;
}

/* ---------- 下拉面板按内容撑开 + 最大宽度上限(2026-09-24) ----------
   select_search.js 给 select2 开了 dropdownAutoWidth:下拉面板以选择框宽度为
   最小宽,再按选项内容自动撑开(宽度上限由浏览器对绝对定位层的收缩适配保证:
   不会超出视口右缘,页面不会出现横向滚动条)。
   这里再加一道「视觉上限」:个别超长选项名不至于把面板撑得比页面还宽,
   超过 600px 的部分由 .select2-results__option 的换行规则(见下)折行显示。
   改大/改小只会影响观感,不影响功能。 */
.select2-dropdown {
  max-width: 600px;
}

.select2-results__option {
  padding: 4px 6px;
  font-size: 12px;
}

.select2-results__option[aria-selected=true] {
  background-color: #f0f0f0;
}

/* ---------- 搜索框放大镜图标(2026-09-23) ----------
   目的:让用户一眼看出该下拉可以输入搜索。
   图标用内联 SVG data URI,不额外引入图片文件(避免新增资产需重启镜像)。
   放大镜:圆 + 斜手柄,#999 中性灰,适配 Redmine 默认浅色主题。 */

/* 下拉面板里的搜索框(单选/默认形态) */
.select2-search--dropdown .select2-search__field {
  padding-left: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6' fill='none' stroke='%23999' stroke-width='2.4'/%3E%3Cpath d='M15.4 15.4 20.5 20.5' fill='none' stroke='%23999' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 7px center;
  background-size: 14px 14px;
}

/* 多选形态:搜索框在已选框内(.select2-search--inline),图标更小一些 */
.select2-search--inline .select2-search__field {
  padding-left: 17px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6' fill='none' stroke='%23999' stroke-width='2.8'/%3E%3Cpath d='M15.4 15.4 20.5 20.5' fill='none' stroke='%23999' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 12px 12px;
}

/* ---------- 结果项长文本换行显示(2026-09-24) ----------
   低分辨率/窄窗口下,长选项名(如 PX30-S_Rockchip_Android14.0_Express_SDK)
   里只有一个断行点("PX30-" 后),后半段 S_Rockchip_Android14.0_Express_SDK
   是无空格长串:浏览器默认不在其中断行 => 内容横向溢出容器,
   表现为「换行后的那截文字被右边界裁掉(像是被遮住)」+ 列表出现横向滚动条。
   允许在任意位置断开长串,文字即可完整换行显示。 */
.select2-results__option {
  white-space: normal;
  word-wrap: break-word;      /* 老浏览器(IE) */
  overflow-wrap: break-word;  /* 标准:仅在必要时强断长串 */
  line-height: 1.5;
  height: auto;
  max-height: none;
}

/* 结果区不再出现横向滚动条(纵向滚动仍由 select2 的 max-height:200px 提供) */
.select2-container--default .select2-results > .select2-results__options {
  overflow-x: hidden;
}