/*!
 * jz-search-horizontal —— Directorist 搜索筛选「左右 pill 展开」优化（v2）
 * ------------------------------------------------------------------
 * 目标（用户 2026-10-22 反馈后重做）：复刻站点 WPCOM 主题（justnews）「标准库」页
 * 属性筛选 UI（.multi-filter）—— 白卡片内按行组织：左侧属性名 + 右侧横排 pill 标签，
 * 行间 1px 细分隔线，选中态主色底白字，pill 多时折叠两行 + 展开钮。
 *
 * 作用域（双重保险，只命中这两处，其他页面/组件不受影响）：
 *   A. .directorist-search-form__top.jz-mf-on   —— /search-home 盒式搜索框
 *      （jz-mf-on 由 JS 改造成功后添加；JS 失效 ⇒ 页面保持原样，零视觉变化）
 *   B. .directorist-search-modal--basic          —— 归档页/首页移动端基础搜索弹层
 *
 * 加载顺序：本文件经插件 PHP 在 directorist main.css 之后入队，同级特异性下后加载者胜；
 * 关键规则均用更高特异性（.jz-mf-on 锚点）确保覆盖插件默认样式。
 * 视觉数值全部复刻主题 multi-filter（线上实证），颜色取主题 --theme-* 变量（带 fallback），
 * 换主题色自动跟随；全文件不用 !important。
 */

/* ==================================================================
 * A. 盒式布局（/search-home 桌面端）—— 左右排列 pill 行
 * ================================================================== */

/* A0. 防旧版样式闪现（FOUC）：补丁 JS 执行前，卡片里**只显示骨架条**，旧版表单内容不可见。
 *     jz-mf-loading 由插件 PHP 在 wp_head 挂到 <html>（自带 DCL+1.5s 兜底移除，
 *     另有 noscript 兜底）；JS 改造成功/失败都会移除它揭盖（见 JS revealForm）。
 *     卡片外壳（白底/圆角/阴影）保留 ⇒ 位置与高度稳定，不引发布局跳动 */
html.jz-mf-loading .directorist-search-form__box {
  position: relative;
}
html.jz-mf-loading .directorist-search-form__box > * {
  visibility: hidden;
}
html.jz-mf-loading .directorist-search-form-action {
  visibility: hidden;
}

/* A0b. 加载期骨架条：**延迟出现**——0.45 秒内就加载完的话根本不显示（否则会看到"闪现一下"），
 *      只有真的慢（弱网/服务器慢）才淡入，避免"空白一片像卡住"。用户 2026-10-26 两轮反馈。 */
html.jz-mf-loading .directorist-search-form__box::before {
  content: '';
  position: absolute;
  left: 22px;
  right: 22px;
  top: 26px;
  height: 12px;
  border-radius: 6px;
  opacity: 0;
  background: linear-gradient(90deg, #f1f3f6 25%, #e7eaef 37%, #f1f3f6 63%);
  background-size: 400% 100%;
  box-shadow: 0 30px 0 0 #f1f3f6, 0 60px 0 0 #f1f3f6, 0 90px 0 0 #f1f3f6;
  animation: jz-mf-skel-in .2s ease .45s forwards, jz-mf-shimmer 1.2s ease infinite;
}
@keyframes jz-mf-skel-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes jz-mf-shimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

/* A1. 行容器与字段列表：由插件默认的横排 flex 改为竖排（每个字段占一行） */
.directorist-search-form__top.jz-mf-on {
  display: block;
}
.directorist-search-form__top.jz-mf-on .directorist-search-adv-filter {
  display: block;
}

/* A2. 改造后的字段行：左标题 + 右内容
 *     覆盖插件 .directorist-search-form__top .directorist-search-field 的
 *     flex:30%/竖向(flex-direction:column)/padding-right:15px 与 :not(:last-child) 的右侧竖线；
 *     注意 flex-direction:row 必须显式写——插件默认是 column，不覆盖会把标题竖排拉高；
 *     注意不要依赖 .directorist-search-adv-filter 祖先层：各站表单结构不一致
 *     （铝材汇的字段直接挂在 __top 下，没有 adv-filter 包裹层），锚点用 __top.jz-mf-on 即可；
 *     行间不加分隔线（用户要求线条弱化删除，保留阴影即可）：分隔由间距+卡片阴影承担 */
.directorist-search-form__top.jz-mf-on .directorist-search-field.jz-mf-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  position: relative;
  flex: 1 1 100%;
  width: 100%;
  max-width: none;
  padding: 0 0 16px;
  margin: 0 0 16px;
  border-right: none;
  border-bottom: none;
  font-size: 14px;
  box-sizing: border-box;
}
.directorist-search-form__top.jz-mf-on .directorist-search-field.jz-mf-item:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

/* A2b. 白卡片去外边框、只留阴影（用户 2026-10-23 要求"线条弱化删除，保留阴影即可"；
 *     jz-mf-on 由 JS 改造成功后给 box 挂上，JS 失效时卡片保持原样） */
.directorist-search-form__box.jz-mf-on {
  border: none;
}

/* A3. 左标题：仅输入行保留标题列（pill 行的标题已并入行首"全部XX"pill，见 A6c/A7b）。
 *     宽度取 CSS 变量 --jz-mf-title-w（JS 按本页实际标题量出，见 A15）；字重 600（用户要求加粗） */
.directorist-search-form__top.jz-mf-on .jz-mf-title {
  flex: 0 0 var(--jz-mf-title-w, 72px);
  width: var(--jz-mf-title-w, 72px);
  flex-shrink: 0;
  margin: 0 10px 0 0;
  line-height: 24px;
  font-size: 14px;
  font-weight: 600;
  color: var(--theme-black-color, #111);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 搜索行不带标题（JS 加 jz-mf-notitle）："搜索"标题与按钮文字重复、缩进别扭 */
.directorist-search-form__top.jz-mf-on .jz-mf-notitle .jz-mf-title {
  display: none;
}

/* A4. 右内容区：占满剩余宽度 */
.directorist-search-form__top.jz-mf-on .jz-mf-body {
  flex: 1 1 auto;
  min-width: 0;
}

/* A5. pill 列表：横排自动换行；底部 -10px 抵消最后一行 pill 的下间距（复刻 .multi-filter-ul） */
.directorist-search-form__top.jz-mf-on .jz-mf-ul {
  list-style: none;
  margin: 0 0 -10px;
  padding: 0;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
/* 关键词行的 ul 为空（输入框直接放在 body 里），不占位 */
.directorist-search-form__top.jz-mf-on .jz-mf-ul:empty {
  display: none;
}

/* A6. pill：未选中=纯文字，选中=主色底白字（复刻 .multi-filter-li / -current） */
.directorist-search-form__top.jz-mf-on .jz-mf-li {
  display: inline-block;
  vertical-align: top;
  line-height: 24px;
  margin: 0 10px 10px 0;
  padding: 0 8px;
  font-size: 14px;
  color: var(--theme-gray-color, rgba(0, 0, 0, .8));
  border-radius: var(--theme-border-radius-s, 3px);
  cursor: pointer;
  white-space: nowrap;
}
.directorist-search-form__top.jz-mf-on .jz-mf-li a {
  color: inherit;
  text-decoration: none;
}
.directorist-search-form__top.jz-mf-on .jz-mf-li a:hover {
  color: var(--theme-hover, #998fff);
}
/* 未选中 pill 悬停加淡灰底，增强"可点"感（选中态由 A7 覆盖） */
.directorist-search-form__top.jz-mf-on .jz-mf-li:hover {
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
}
/* A6c. pill 行（单选/多选）不单列标题：行标题并入行首 pill（"全部类别"/"全部地区"），
 *      少占一列、行首即标签（用户 2026-10-25 提议）。该 pill 的选中态用弱化版，见 A7b */

/* A7. 选中态（单选 jz-mf-cur / 多选 jz-mf-checked） */
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-cur,
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-checked {
  background: var(--theme-color, #4d3cff);
  color: #fff;
}
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-cur:hover,
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-checked:hover {
  background: var(--theme-hover, #998fff);
}
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-cur a:hover,
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-checked a:hover {
  color: #fff;
}

/* A7b. "全部"的弱化选中态（jz-mf-all-on，JS 在该行无筛选时挂上）：
 *      浅色底 + 主题色字——与 A7 实色选中形成层级：默认全量=轻，主动筛选=重。
 *      用户 2026-10-25：实色太强，弱化。放在 A7 之后，特异性 (0,5,0) 相同时后者胜，
 *      且不依赖 A7 的 cur/checked 类，无争抢。 */
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-all-on {
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
  color: var(--theme-color, #4d3cff);
}
/* 支持 color-mix 的浏览器（Chrome 111+/Safari 16.2+）用 10% 主题色浅底，更贴主题；
 *      旧浏览器保持上面的浅灰底（渐进增强） */
@supports (background: color-mix(in srgb, red 10%, white)) {
  .directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-all-on {
    background: color-mix(in srgb, var(--theme-color, #4d3cff) 10%, #fff);
  }
}
.directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-all-on:hover {
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
}
@supports (background: color-mix(in srgb, red 16%, white)) {
  .directorist-search-form__top.jz-mf-on .jz-mf-li.jz-mf-all-on:hover {
    background: color-mix(in srgb, var(--theme-color, #4d3cff) 16%, #fff);
  }
}

/* A8. 原表单控件视觉隐藏（DOM 保留：提交/条件逻辑/select2 全部不受影响） */
.directorist-search-form__top.jz-mf-on .directorist-search-field .jz-mf-original {
  display: none;
}
/* A8b. 页面已有可见的头部搜索框（body.jz-has-header-search，JS 入口挂类）⇒ 隐藏筛选卡
 *      里的关键词行，避免"头部一个搜索框、卡片里一个"重复。挂 body 类而非 JS 直接隐藏：
 *      表单被 AJAX 重建后重跑改造时头部框可见性判断不稳（实测漏隐藏），body 类不受影响。
 *      特异性须高于 A2 行规则（0,5,0），否则行规则 display:flex 会把本规则压掉（实测踩过） */
body.jz-has-header-search .directorist-search-form__top.jz-mf-on .directorist-search-field.jz-mf-item--input {
  display: none;
}

/* A14. 收紧搜索区与页面头部的间距——**纯 CSS、首绘即生效**（用户 2026-10-26：
 *      运行时上拉会在页面画完之后把整块内容"弹"上去，实测 Layout Shift 0.128）。
 * 两件事一起做：
 *   ① 归档容器固定上拉 26px（实测该值对所有页型都安全：分类归档页 /single-category/xxx
 *      容器上方还有标题，26px 不会压到标题；早期 JS 按页量测最大拉过 88px 才出过"贴顶"）
 *   ② 有搜索卡的页面，把主题页面级的上下内边距收小——让整块内容更靠页面顶部
 * 用 :has() 限定"本页确有搜索卡"；@supports 兜底：不支持 :has 的浏览器完全不动（安全） */
@supports selector(:has(*)) {
  /* 注意：主题有 `.entry .entry-content > :first-child { margin-top: 0 }`（优先级 0,3,0），
   * 会把下面这条压掉 —— 所以用双子类 .directorist-archive-contents.directorist-contents-wrap
   * 把特异性提到 (0,3,1)（实测踩过：规则命中但 computed 仍是 0px） */
  body:has(.directorist-search-form__box) .directorist-archive-contents.directorist-contents-wrap {
    margin-top: -26px;
  }
  /* 主题 A（检测之家 justnews 系）：.entry-main padding-top 20px + .wrap.container margin-top 20px */
  body:has(.directorist-search-form__box) .entry-main { padding-top: 6px; }
  body:has(.directorist-search-form__box) .wrap.container { margin-top: 6px; }
  /* 主题 B（铝材汇 sage 系）：.main.container padding-top 20px + article.content padding-top 30px
   * article.content 只收到 20px（而非 10px）：否则面包屑与卡片间距被压到 21px（用户嫌太贴） */
  body:has(.directorist-search-form__box) .main.container { padding-top: 8px; }
  body:has(.directorist-search-form__box) article.content { padding-top: 20px; }
}

/* A9. 折叠/展开：pill 超过约两行（JS 测 >80px）只露两行（复刻主题 68px 阈值） */
.directorist-search-form__top.jz-mf-on .jz-mf-item.jz-mf-collapsible .jz-mf-ul {
  max-height: 68px;
  overflow: hidden;
}
/* A9b. 地区行强制只露一行（JS 指定顺序与数量，点"更多"看全部） */
.directorist-search-form__top.jz-mf-on .jz-mf-item.jz-mf-oneline .jz-mf-ul {
  max-height: 34px;
}
.directorist-search-form__top.jz-mf-on .jz-mf-item.jz-mf-open .jz-mf-ul {
  max-height: none;
}

/* A10. 展开钮：浅灰底"更多/收起"文字钮（比纯图标框醒目；页面无 #wi-arrow-down
 *      SVG 精灵（线上实证 0 次），箭头用 CSS 画） */
.directorist-search-form__top.jz-mf-on .jz-mf-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  width: auto;
  height: 26px;
  margin-left: 10px;
  padding: 0 10px;
  box-sizing: border-box;
  border: none;
  border-radius: var(--theme-border-radius-s, 3px);
  background: var(--directorist-color-secondary, #f2f3f5);
  color: var(--theme-gray-color, rgba(0, 0, 0, .8));
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
}
.directorist-search-form__top.jz-mf-on .jz-mf-more:hover {
  background: hsla(var(--theme-color-hsl, 0, 0%, 15%), .1);
  color: var(--theme-color, #4d3cff);
}
.directorist-search-form__top.jz-mf-on .jz-mf-more i {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  transition: transform .3s;
}
.directorist-search-form__top.jz-mf-on .jz-mf-item.jz-mf-open .jz-mf-more i {
  margin-top: 3px;
  transform: rotate(-135deg);
}

/* A11. 关键词输入行：一体化搜索条——输入框与按钮在**同一个容器**里（垂直居中、无分隔感）。
 *      44px 浅灰圆角条 + 左侧放大镜 + 内嵌柔和色按钮；聚焦时整条变白 + 主色描边。
 *      用户 2026-10-26 多轮反馈后的定稿（原来"独立按钮 + 各自边框"会出现输入时框体下沉、
 *      左右上下不齐、有分隔感）。 */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input {
  align-items: center;
}
/* A11a. 搜索条限宽：原来 flex:1 拉满整张卡片（1000px+），又空又抢视线；
 *       桌面端限 520px 左对齐（与 pill 行首对齐），手机端仍占满（见 A13） */
@media screen and (min-width: 768px) {
  .directorist-search-form__top.jz-mf-on .jz-mf-item--input .jz-mf-body {
    max-width: 520px;
  }
}
/* 条形容器：背景/圆角/放大镜/内边距都在这里，输入框与按钮都放在里面 */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input .jz-mf-body {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 5px 5px 5px 38px;
  box-sizing: border-box;
  background-color: var(--directorist-color-bg-light-gray, #f4f5f6);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23878d96' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20.5 20.5l-4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 14px center;
  background-size: 16px 16px;
  border: 1px solid transparent;
  border-radius: 10px;
  transition: background-color .2s, border-color .2s;
}
/* 聚焦（点输入框或按钮）时整条变白 + 主色描边——只改颜色不改尺寸，不会"下沉" */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input .jz-mf-body:focus-within {
  background-color: #fff;
  border-color: var(--theme-color, #4d3cff);
}
/* 输入框本身透明无边框，撑满条内剩余空间 */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input input.directorist-search-field__input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: 100%;
  padding: 0 30px 0 0;      /* 右侧留给清除钮 */
  font-family: inherit;
  font-size: 14px;
  line-height: 1.4;
  color: var(--theme-black-color, #111);
  background: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  outline: 0;
  box-shadow: none;
}
/* 搜索行标题被隐藏 ⇒ 恢复 placeholder 显示（插件规则：label 与 input 同级时 placeholder opacity:0） */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input input.directorist-search-field__input::-webkit-input-placeholder { opacity: 1; }
.directorist-search-form__top.jz-mf-on .jz-mf-item--input input.directorist-search-field__input::-moz-placeholder { opacity: 1; }
.directorist-search-form__top.jz-mf-on .jz-mf-item--input input.directorist-search-field__input:-ms-input-placeholder { opacity: 1; }
.directorist-search-form__top.jz-mf-on .jz-mf-item--input input.directorist-search-field__input::placeholder { opacity: 1; }
/* A11b. 条内按钮：柔和色——浅主题色底(12%) + 主题色字（用户反馈实色"太饱和"）；
 *       仍是原生 type=submit，点击即提交 */
.directorist-search-form__top.jz-mf-on .jz-mf-submit {
  flex: 0 0 auto;
  height: 34px;
  margin: 0;
  padding: 0 20px;
  border: none;
  border-radius: 8px;
  background: var(--directorist-color-bg-light-gray, #eceef2);
  color: var(--theme-color, #4d3cff);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s, color .2s;
}
@supports (background: color-mix(in srgb, red 10%, white)) {
  .directorist-search-form__top.jz-mf-on .jz-mf-submit {
    background: color-mix(in srgb, var(--theme-color, #4d3cff) 12%, #fff);
  }
}
.directorist-search-form__top.jz-mf-on .jz-mf-submit:hover {
  background: var(--theme-color, #4d3cff);
  color: #fff;
}
/* 清除钮（有值时出现）：贴输入框右侧垂直居中（插件默认 right:15px;bottom:12px 是旧横排布局的值） */
.directorist-search-form__top.jz-mf-on .jz-mf-item--input .directorist-search-field__btn--clear {
  top: 50%;
  bottom: auto;
  right: 8px;
  transform: translateY(-50%);
}

/* A12. 搜索按钮：位于白卡片下方（DOM 即在 __box 外），全宽主色大按钮
 *     必须同时压 min-height：插件 .directorist-btn.directorist-btn-lg{min-height:50px}
 *     会把 height:44px 钳回 50px；主色/白字/图标由 .directorist-btn-primary 提供，不动 */
.directorist-search-form-action.jz-mf-on {
  width: 100%;
  margin-top: 16px;
}
.directorist-search-form-action.jz-mf-on .directorist-search-form-action__submit {
  width: 100%;
}
.directorist-search-form-action.jz-mf-on .directorist-search-form-action__submit .directorist-btn-search {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 44px;
  min-height: 44px;
  padding: 0 18px;
  border: none;
  border-radius: var(--theme-border-radius-s, 3px);
  font-size: 15px;
  font-weight: 600;
}

/* A13. 响应式 ≤767px：标题移到 pill 上方，展开钮绝对定位右上，按钮已全宽 */
@media screen and (max-width: 767px) {
  .directorist-search-form__top.jz-mf-on .directorist-search-field.jz-mf-item {
    display: block;
    padding: 0 0 16px;
    margin: 0 0 16px;
  }
  .directorist-search-form__top.jz-mf-on .directorist-search-field.jz-mf-item:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .directorist-search-form__top.jz-mf-on .jz-mf-title {
    width: auto;
    flex: none;
    margin: 0 34px 8px 0;    /* 右侧留给绝对定位的展开钮 */
  }
  .directorist-search-form__top.jz-mf-on .jz-mf-body {
    display: block;
  }
  .directorist-search-form__top.jz-mf-on .jz-mf-more {
    position: absolute;
    top: 0;
    right: 0;
    margin-left: 0;
  }
  .directorist-search-form__top.jz-mf-on .jz-mf-item--input .jz-mf-title {
    margin-right: 0;
  }
  /* 移动端与桌面同一套一体化搜索条：按钮仍在条内（不再独占一行），只把条高略降、
   * 按钮内边距收一点，保证小屏文字不挤 */
  .directorist-search-form__top.jz-mf-on .jz-mf-item--input .jz-mf-body {
    height: 42px;
    max-width: none;
  }
  .directorist-search-form__top.jz-mf-on .jz-mf-submit {
    width: auto;
    height: 32px;
    margin: 0;
    padding: 0 14px;
    border-radius: 7px;
  }
}

/* ==================================================================
 * B. 移动端基础搜索弹层（归档页/首页，<576px 底部弹层）
 * ================================================================== */

/* B1. 每个字段行：48px 高、圆角 8px、浅灰底、行间距 12px */
.directorist-search-modal--basic .directorist-search-modal__input {
  margin-bottom: 12px;
}
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field {
  margin: 0;
  padding: 0;
  border: none;
}
.directorist-search-modal--basic .directorist-search-modal__input input.directorist-search-field__input {
  height: 48px;
  border: none;
  border-radius: 8px;
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
  padding: 0 14px;
  font-size: 15px;
  color: var(--directorist-color-dark, #000);
}

/* B2. 隐藏弹层内的浮动 label（下拉 trigger 除外） */
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field__label:not(.directorist-search-basic-dropdown-label) {
  display: none;
}

/* B3. 弹层 placeholder 显示（插件默认规则在弹层内强制 placeholder 透明） */
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field input.directorist-search-field__input::-webkit-input-placeholder { opacity: 1; }
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field input.directorist-search-field__input::-moz-placeholder { opacity: 1; }
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field input.directorist-search-field__input:-ms-input-placeholder { opacity: 1; }
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field input.directorist-search-field__input::-ms-input-placeholder { opacity: 1; }
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field input.directorist-search-field__input::placeholder { opacity: 1; }

/* B4. 弹层 select2：同色圆角行、隐藏原生箭头、chevron 居中 */
.directorist-search-modal--basic .select2-container .select2-selection--single {
  height: 48px;
  border: none;
  border-radius: 8px;
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
}
.directorist-search-modal--basic .select2-container--default .select2-selection--single .select2-selection__arrow {
  display: none;
}
.directorist-search-modal--basic .select2-selection__rendered {
  line-height: 46px;
  padding: 0 14px;
  font-size: 15px;
  color: var(--directorist-color-body, #404040);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.directorist-search-modal--basic .directorist-select2-addons-area {
  top: 50%;
  bottom: auto;
  right: 14px;
  transform: translateY(-50%);
}
.directorist-search-modal--basic .directorist-select2-addons-area .directorist-icon-mask::after {
  width: 12px;
  height: 12px;
}

/* B5. 弹层内「下拉类型」字段行（如前处理设备）：同色圆角行 + 右对齐箭头 */
.directorist-search-modal--basic .directorist-search-basic-dropdown-label {
  display: flex;
  align-items: center;
  position: static;
  height: 48px;
  margin: 0;
  padding: 0 30px 0 14px;
  font-size: 15px;
  font-weight: 400;
  color: var(--directorist-color-body, #404040);
  border-radius: 8px;
  background: var(--directorist-color-bg-light-gray, #f4f5f6);
  cursor: pointer;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.directorist-search-modal--basic .directorist-search-basic-dropdown-label i.directorist-icon-mask {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  margin: 0;
}
.directorist-search-modal--basic .directorist-search-basic-dropdown-label i.directorist-icon-mask::after {
  width: 12px;
  height: 12px;
}

/* B6. 弹层清除按钮：垂直居中 */
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field .directorist-search-field__btn--clear {
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  right: 14px;
}
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field.input-has-value .directorist-search-field__btn--clear,
.directorist-search-modal--basic .directorist-search-modal__input .directorist-search-field.input-is-focused .directorist-search-field__btn--clear {
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
}

/* B7. 底部搜索按钮：主色全宽大按钮（原白色按钮在白底上不醒目）—— 只改样式，文字仍是"搜索" */
.directorist-search-modal--basic .directorist-search-form-action__modal__btn-search {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  min-height: 48px;
  margin-top: 4px;
  border: none;
  border-radius: 8px;
  background: var(--directorist-color-primary, #4d3cff);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}
.directorist-search-modal--basic .directorist-search-form-action__modal__btn-search .directorist-icon-mask::after {
  background-color: #fff;
}