/* ===================================================================
 * site-polish.css — 站点细节打磨（独立文件，不改动打包产物）
 * -------------------------------------------------------------------
 * 一、报价卡片底部操作栏
 *   原生问题：
 *     1) 容器是 3 列网格 grid-template-columns:1fr 1fr 1.15fr，
 *        但实际只有 2 个元素（查看详情 / 我也报价），右侧约 1/3 长期留白；
 *     2) .quote-action-primary 这个 class 在主包里没有任何对应样式规则，
 *        导致「我也报价」与普通文字无异，主次不分。
 *   处理：改为两列铺满的胶囊按钮组，建立「次要 / 主操作」层级。
 *
 * 二、首页「寻找产业带」网格
 *   原生问题：主包 .belt-grid 用 repeat(auto-fill,minmax(230px,1fr))，
 *     在 1240px 容器里算出 5 列，而首页只渲染 4 张卡 → 右侧空一格。
 *   处理：卡片补到 8 条（见 index-app-v2.js），桌面固定 4 列 →
 *     恰好两行 × 四列铺满，无留白。
 *
 * 三、Logo「冀」字颜色
 *   原生问题：.logo-mark 是品牌红底（--c-primary #c93628），里面是内联
 *     SVG <text>冀</text>；主包只给了字体规则、没给 fill，而 SVG 的 fill
 *     初始值就是黑色 → 红底黑字，对比度低。
 *   处理：统一改白字。
 * =================================================================== */

/* ---------- 一、报价卡片底部操作栏 ---------- */

.quote-card-actions {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--c-line);
  background: linear-gradient(180deg, #fffdfb, #fff9f4);
}

.quote-card-actions a,
.quote-card-actions button {
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  padding: 9px 6px;
  text-align: center;
  border-radius: 9px;
  border: 1px solid var(--c-line-2);
  background: #fff;
  color: var(--c-ink-soft);
  cursor: pointer;
  transition: background 0.18s, color 0.18s, border-color 0.18s, box-shadow 0.18s;
}

/* 左：次要动作 —— 白底描边胶囊 */
.quote-card-actions a {
  color: var(--c-ink-soft);
  border-color: var(--c-line-2);
}
.quote-card-actions a:hover {
  border-color: var(--c-primary);
  color: var(--c-primary);
  background: #fff7f3;
}

/* 右：主操作（我也报价）—— 浅红胶囊，hover 转实心 */
.quote-card-actions button.quote-action-primary {
  color: var(--c-primary-deep);
  background: #fff1e9;
  border-color: #f0d4c6;
  font-weight: 900;
}
.quote-card-actions button.quote-action-primary:hover {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff;
  box-shadow: 0 5px 12px -4px rgba(201, 54, 40, 0.5);
}

/* 兼容原有「报价质疑」按钮配色 */
.quote-card-actions button.question {
  color: #a86a25;
  background: #fffaf0;
  border-color: #efdcb8;
}
.quote-card-actions button.question:hover {
  background: #a86a25;
  border-color: #a86a25;
  color: #fff;
}

@media (max-width: 640px) {
  .quote-card-actions {
    gap: 7px;
    padding: 9px 10px;
  }
  .quote-card-actions a,
  .quote-card-actions button {
    padding: 10px 4px;
    font-size: 12.5px;
  }
}

/* ---------- 二、首页「寻找产业带」两行铺满 ---------- */
/* 首页共 8 张产业带卡片：桌面 4 列 → 2 行铺满；中屏 2 列 → 4 行铺满。
   640px 以下沿用主包的单列布局。 */

@media (min-width: 1001px) {
  .belt-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 641px) and (max-width: 1000px) {
  .belt-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ---------- 三、（已撤销）Logo「冀」字配色 ---------- */
/* 2026-09-12：曾把「冀」改成白字（.logo-mark svg text{fill:#fff}），
   当天按需求撤回 —— 恢复主包原样（SVG <text> 默认 fill 为黑）。
   保留本段注释是为了说明：这里**故意不再覆盖** fill，不要再加回来。 */

/* ---------- 四、顶栏导航：桌面端标签不换行 ---------- */
/* 原生问题（2026-09-12 实测）：
     .header-in 内宽固定 1240px（.wrap max-width:1280 + padding:20），扣掉
     logo(143) + .header-right(186) + 两个 26px 的 gap 后，.main-nav 只剩 858px；
     而主包 .main-nav a 是 white-space:normal 且作为 flex 子项默认可压缩，
     一旦内容超宽就被压到框里折行 —— 每注入一个大斤入口就恶化一档，
     4 个大斤（8 字全名各 142px）时导航共需 1092px，超 234px，
     实测「首页」折成竖排「首／页」、「高薪用工匹配大厅」折成两行。
   处理三步：
     1) 标签一律 white-space:nowrap —— 任何宽度下都不再折行；
     2) 大斤入口改用 4 字简称（hall-nav.js 的 short 字段），
        全名进 title / aria-label，标签由 142px 收到 84px；
     3) .main-nav 变成横向滚动容器做兜底：宁可极窄桌面下滑动，
        也绝不折行、不把页面顶出横向滚动条。
   宽度账（修完后，单行所需 / nav 可用）：
     ≥1280px  808 / 843~858  ✅ 全显示
     ≤1279px  704 / 763(1200px)  ✅ 全显示
     ≤1150px  652 / 663(1100px)  ✅ 全显示
     ≤1050px  652 / 588(1025px)  ⚠️ 转为横向滚动（主包在 ≤1024 已隐藏 .main-nav，
                                     这一段只有 1025~1050 的极窄窗口） */
.main-nav {
  gap: 5px;                        /* 2026-09-16 6→5px：加「商家二维码摊位」后 9 项需再省 8px（1280 档可用恒 828px） */
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;          /* Firefox */
  -ms-overflow-style: none;       /* 旧 Edge/IE */
}
.main-nav::-webkit-scrollbar { display: none; }
.main-nav a { white-space: nowrap; }
/* 2026-09-16 顶栏观感统一：字重 / 字距 / 悬停胶囊底色（配合综合服务下拉与新闻中心） */
.main-nav a {
  font-weight: 600;
  letter-spacing: 0.3px;
  padding-left: 9px;               /* 2026-09-16 10→9px：「商家群二维码摊位」9 字后预算 ~823 ≤ 828 */
  padding-right: 9px;
  border-radius: 9px;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.main-nav a:hover { color: #c93628; background: #faf3ee; }
/* 注入的「综合服务」触发项与下拉项：内边距与整体节奏一致 */
.main-nav a[data-hb-hall] { padding-left: 12px; padding-right: 12px; }

/* 中窄桌面（1025~1279px）整体收一档字号与内边距，保证仍能一行放全 */
@media (max-width: 1279px) {
  .main-nav a { font-size: 13px; padding-left: 10px; padding-right: 10px; }
  .main-nav a[data-hb-hall] { padding-left: 9px; padding-right: 9px; }
  .main-nav { gap: 4px; }
}
/* 极窄桌面（1025~1150px）再收一档，1050px 以上仍可一行放全 */
@media (max-width: 1150px) {
  .main-nav a { font-size: 12.5px; padding-left: 8px; padding-right: 8px; }
  .main-nav a[data-hb-hall] { padding-left: 7px; padding-right: 7px; }
}

/* ---------- 五、发布页「自动匹配类目」输入框放大（2026-09-20） ---------- */
/* 原生问题（无头 Edge 实测，/publish/demand）：
     桌面 1256px：input 42px / 按钮 42px / 同级 select 45px
     移动  390px：input **23px** / 按钮 40px / 同级 select 45px  ← 细成一条缝
   根因：主包基规则 .category-match-input input{flex:1}（= flex-basis:0%），
     而 @media(max-width:640px) 里 .category-match-input{flex-direction:column}
     把主轴换成了**纵向** —— flex-basis:0% 于是作用到高度上，height:42px 被
     压回内容高度（23px，正好是一行文字高）。桌面上是横向 flex，所以看不出问题。
   处理：
     ① 纵向布局下改 flex:none，把高度还给 height（这是"框小"的真正病根）；
     ② 顺手整体放大：input 48px / 15px 字号，按钮 46px 两者对齐
        （用户要求「这个框大点」）。
   覆盖面：桌面与移动都放大，避免"手机上修好了、桌面还是小的"这种半截效果。
   注意本文件在 index-CfXowBzj.css 之后、mobile-v5.css 之前加载 ——
     这几个类名后者都没有涉及，同权重靠"后来者胜"即可压过主包。 */
.category-match-input input {
  height: 48px;
  font-size: 15px;
  padding: 0 14px;
  border-radius: 10px;
}
.category-match-input .fc-btn {
  height: 46px;
  border-radius: 10px;
}

@media (max-width: 640px) {
  .category-match-input input {
    flex: none;          /* 关键：纵向 flex 下 flex:1 会把高度压成内容高度 */
    height: 48px;
    font-size: 16px;     /* 沿用站内移动端 16px 口径（防 iOS 聚焦缩放） */
  }
  .category-match-input .fc-btn {
    height: 46px;
  }
}

/* ---------- 六、发布页「补充附件」文件控件与输入框视觉统一（2026-09-20） ---------- */
/* 原生问题（无头 Edge 实测 /publish/demand）：文件框只继承了 .form-field input 的
   边框/圆角，内部仍是浏览器默认的「选择文件」灰按钮 + 系统字体，
   与右侧 10px 圆角、14px 内边距的文本输入框不成一套。
   处理：① ::file-selector-button 换成站内主色按钮（8px 圆角、白字、13px/700）；
         ② 未选文件时的文字降一级成 --c-ink-light；
         ③ 桌面/移动同一套，宽度仍 100%；只加样式，不动 publish-guard.js 注入的提示节点。 */
.publish-page .form-field input[type="file"] {
  padding: 8px 12px;
  font-size: 13px;
  color: var(--c-ink-light);
  cursor: pointer;
}
.publish-page .form-field input[type="file"]::file-selector-button {
  margin-right: 12px;
  padding: 8px 16px;
  border: 0;
  border-radius: 8px;
  background: var(--c-primary);
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: 0.15s;
}
.publish-page .form-field input[type="file"]:hover { border-color: var(--c-primary); }
.publish-page .form-field input[type="file"]:hover::file-selector-button { background: var(--c-primary-deep); }
.publish-page .form-field input[type="file"]::-webkit-file-upload-button {
  margin-right: 12px;
  padding: 8px 16px;
  border: 0;
  border-radius: 8px;
  background: var(--c-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}