/* ============================================================================
 * 标智选 · 设计精修层（polish.css）
 * ----------------------------------------------------------------------------
 * 建立日期：2026-11-14
 * 依据：《标智选 UI 视觉优化建议书》（千问）+ 线上实测样式取值
 *
 * ★★★ 为什么单独成文件，不直接改 portal.css ★★★
 *
 *   layout.php 第 73-77 行记着一条历史教训：
 *     「客户 11-08 起在做前端大改，portal.css 是双方共同编辑的文件，
 *      我方单方面改它会有覆盖风险（今天已经因此误覆盖过一次，已回退）」
 *
 *   所以本文件的设计原则是**只叠加、不覆盖、可一键摘除**：
 *     · 全部规则都是"精修"，不重写布局骨架
 *     · 引用位置在 portal.css 之后 → 同名权重下自然生效
 *     · 需要回滚时：删掉 layout.php 里的一行 <link> 即可，portal.css 一个字节不动
 *
 * ★ 只做「一致性 / 可读性 / 可访问性」，不换风格 ★
 *   白底不变、主色不变（#1a56d6）、圆角卡片 + 细边框 + 轻阴影的清爽商务风不变。
 *   下面每条规则都写了「为什么」，方便以后判断哪条可以删。
 * ========================================================================== */

/* ============================================================================
 * 一、设计令牌（Design Tokens）
 * ----------------------------------------------------------------------------
 * 现有 portal.css 的变量零散（--blue / --blue-d / --blue-l / --orange 等），
 * 但缺语义色（成功/警告/危险）、缺间距阶梯、缺圆角阶梯。
 * 这里补齐，命名加 zs- 前缀避免和 portal.css 现有变量撞名。
 * ========================================================================== */
:root{
  /* --- 主色（沿用现有，不换色）--- */
  --zs-primary:        #1a56d6;
  --zs-primary-hover:  #1548b8;
  --zs-primary-active: #123c8f;
  --zs-primary-l:      #eaf1ff;

  /* --- 强调色 ---
   * ★★★ 这里我改过一次，最后决定：不用橙色 ★★★
   *
   * 千问建议书把搜索按钮从橙 #ff7e33 加深到 #e05e12/#c2410c 来解决对比度。
   * 我照做了，实测截图发现**明显变难看**：深棕橙和品牌蓝打架，
   * 一屏里两个高饱和色互相抢，反而破坏白底清爽感。
   *
   * 更关键的是违反了两条已定的约束：
   *   · 客户定死「白底 + 单一强调色 #1a56d6」
   *   · 项目记忆铁律「禁第二品牌色」
   *
   * 真正的解法不是"把橙色加深"，而是**让搜索按钮回归品牌蓝**：
   *   蓝色 #1a56d6 配白字对比度 5.5:1 本来就达标，
   *   且与输入框、选中 chip、主按钮同色系，整屏只有一个强调色。
   * 橙色只留给极少数"促销/购买"场景，或干脆不用。
   *
   * 所以 --zs-cta 保留但**默认不使用**；下面按钮规则里已改为品牌蓝。
   */
  --zs-cta:            #1a56d6;   /* 回归品牌蓝（原橙色方案已废弃，见上） */
  --zs-cta-hover:      #1548b8;
  --zs-cta-active:     #123c8f;

  /* --- 语义色（原来完全没有，导致成功/错误提示颜色各处不一）--- */
  --zs-success:        #16a34a;
  --zs-success-l:      #e7f6ec;
  --zs-warning:        #d97706;
  --zs-warning-l:      #fef3e2;
  --zs-danger:         #dc2626;
  --zs-danger-l:       #fdecec;

  /* --- 中性色 --- */
  /* --muted2 原值 #8b95a4 在白底上对比度约 3.0:1，低于 AA 的 4.5:1。
     加深到 #6b7280 后约 4.8:1 达标。
     注意：portal.css 里 --muted2 被大量复用，直接在 :root 改会影响全局，
     所以本文件只在需要处显式用 --zs-muted2，不动原变量。 */
  --zs-muted2:         #6b7280;
  --zs-border-input:   #cbd5e1;   /* 原 #dde3ec 偏浅，输入框边界不清晰 */

  /* --- 圆角阶梯（原来同屏出现 0 / 6 / 7 / 14px 四种）--- */
  --zs-r-sm:   4px;    /* 徽章、小标签 */
  --zs-r-md:   6px;    /* chip、小按钮 */
  --zs-r-lg:   8px;    /* 按钮、输入框（统一） */
  --zs-r-xl:   12px;   /* 卡片、弹层 */

  /* --- 间距阶梯（原来出现 13/15/29/44/53 等非栅格值）--- */
  --zs-s1: 4px;  --zs-s2: 8px;  --zs-s3: 12px;
  --zs-s4: 16px; --zs-s5: 20px; --zs-s6: 24px;

  /* --- 过渡（按钮/输入框统一手感）--- */
  --zs-ease: .15s ease;
}

/* ============================================================================
 * 二、字体栈统一
 * ----------------------------------------------------------------------------
 * 问题：body 用「Microsoft YaHei / PingFang SC」，但 <button> 和 <input>
 *      浏览器默认不继承字体 → 回落到 Arial 13.33px，按钮上的字和正文不一样。
 *      这是"机器拼装感"最明显的来源之一。
 * 修法：显式让表单控件继承，并统一字体栈顺序（PingFang 优先，Mac 更好看）。
 * ========================================================================== */
body,
button, input, select, textarea,
.btn-primary, .mini-btn, .adv-btn{
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
}

/* 数字类内容用等宽数字，金额/编号纵向对齐更整齐 */
.p-tbl-frame td, .p-tbl-kv, .dinfo, .res-fields,
.zs-num{font-variant-numeric:tabular-nums}

/* ============================================================================
 * 三、按钮规范统一
 * ----------------------------------------------------------------------------
 * 实测现状（同屏四种圆角，客户会觉得"没做完"）：
 *   .btn-primary      14px（第 195 行）→ 第 1736 行又被改成 6px
 *   .mini-btn          6px
 *   .hB-sform button   0px（搜索按钮直角）
 *   一般 button        浏览器默认 9px
 *
 * 统一为 8px（中号），小按钮 6px。字号 12px→14px（原偏小）。
 *
 * ★ 为什么分组写，而不是一把 :where() ★
 *   一开始我用 :where(.btn-primary, .hB-sform button, ...) 一把抓，实测发现：
 *   :where() 权重为 0，被 portal.css 里 .hB-sform button{border:0}
 *   和 .btn-primary{font-size:12px}（第1736行更具体）压过去了 —— 圆角仍是 0px、
 *   字号仍是 13.5px。所以下面按「需要跟 portal.css 抢优先级」和
 *   「只需补默认值」两类分开写。
 * ========================================================================== */

/* --- 3.1 搜索按钮 ---
 * portal.css 里有一串相互覆盖的规则，最后一刀是第 1743 行：
 *     .hB-sform button{border-radius:0;height:auto}
 * 它排在文件后部，用普通权重压不住。本文件定位是"最终精修层"，
 * 所以这里用 !important 明确宣示最终值。
 *
 * ★ 形态保持不变：右侧只圆外角（与左侧输入框拼成一体），
 *   这是原设计的优点，不要为了"统一圆角"把它改成四角全圆 ——
 *   那样搜索框看起来会像个孤立按钮，反而松散。 */
.hB-sform button{
  border-radius:0 var(--zs-r-lg) var(--zs-r-lg) 0 !important;
  font-size:14px !important;
  font-weight:600;
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  transition:background-color var(--zs-ease);
}
.b-search button{
  border-radius:0 var(--zs-r-lg) var(--zs-r-lg) 0 !important;
  font-size:14px !important;
  font-weight:600;
  transition:background-color var(--zs-ease);
}

/* --- 3.2 主按钮 ---
 * ★ 注意排除 .sub-card-btn ★
 *   首页右下角「订阅此条件」是 .btn-primary + .sub-card-btn 双类，
 *   portal.css 第 5006-5013 行专门为它写过（11-13 修过"H5 文字贴左"），
 *   里面用 !important 把字号定在 13.5px / 高 40px，是刻意调过的尺寸。
 *   我这里不覆盖它 —— 40px 高的大按钮配 13.5px 字视觉上正常，
 *   强行拉到 14px 反而会打乱那边已校准过的比例。
 *   （:not() 排除后，本规则只作用于其余普通主按钮。） */
.btn-primary:not(.sub-card-btn),
.adv-btn,
.ai-input .btn-primary,
.ins-heroish .btn-primary{
  border-radius:var(--zs-r-lg) !important;
  font-size:14px !important;
  font-weight:500;
  height:auto;
  min-height:34px;
  padding:0 18px;
  transition:background-color var(--zs-ease), border-color var(--zs-ease), color var(--zs-ease);
}

/* 主按钮三态（原来只有默认态） */
.btn-primary:not(:disabled):hover,
.mini-btn.primary:hover{
  background:var(--zs-primary-hover);
}
.btn-primary:not(:disabled):active,
.mini-btn.primary:active{
  background:var(--zs-primary-active);
}
.btn-primary:disabled{
  background:#a9c0f0;
  cursor:not-allowed;
}

/* 小号按钮：保持小圆角，字号 13px */
.mini-btn{
  border-radius:var(--zs-r-md);
  font-size:13px;
  transition:background-color var(--zs-ease), border-color var(--zs-ease), color var(--zs-ease);
}
.mini-btn:hover{
  border-color:var(--zs-primary);
  color:var(--zs-primary);
}
.mini-btn.primary:hover{
  color:#fff;
}

/* CTA（搜索/主提交按钮）：统一用品牌蓝，不用橙色。
 * 品牌蓝 #1a56d6 配白字对比度 5.5:1，天然达标；
 * 且整屏只有一个强调色，符合客户「单一强调色」定调。 */
.b-search button,
.hB-sform button{
  background:var(--zs-cta);
}
.b-search button:hover,
.hB-sform button:hover{
  background:var(--zs-cta-hover);
}
.b-search button:active,
.hB-sform button:active{
  background:var(--zs-cta-active);
}

/* 键盘可访问：所有可点元素聚焦时给出明确轮廓（原来完全没有 focus 态） */
:where(a, button, input, select, textarea, [tabindex]):focus-visible{
  outline:2px solid var(--zs-primary);
  outline-offset:2px;
  border-radius:var(--zs-r-sm);
}

/* ============================================================================
 * 四、链接可识别性
 * ----------------------------------------------------------------------------
 * 问题：portal.css 里 a{color:inherit} → 正文里的链接和正文同色，
 *      用户看不出哪里可以点（客户报告 P 类问题里也提到过）。
 * 修法：只给"正文区域内"的链接上色，导航/按钮/卡片容器不动，
 *      避免把整站链接都染蓝破坏清爽感。
 * ========================================================================== */
.zs-prose a,
.p-article a,
.tender-body a{
  color:var(--zs-primary);
  text-decoration:none;
}
.zs-prose a:hover,
.p-article a:hover,
.tender-body a:hover{
  text-decoration:underline;
}

/* ============================================================================
 * 五、标讯列表项精修
 * ----------------------------------------------------------------------------
 * 现状：标题 14px/700 与正文同色，整行 hover 无反馈 → 不知道能不能点。
 * 修法：标题 15px/600（略增突出但不夸张），hover 变主色 + 行背景极浅蓝。
 * ========================================================================== */
.res-title{
  font-size:15px;
  font-weight:600;
  transition:color var(--zs-ease);
}
.res-title:hover{
  color:var(--zs-primary);
}
.res-item{
  transition:background-color var(--zs-ease);
}
.res-item:hover{
  background:#f8faff;
}

/* 元信息（时间/地区）用更淡但达标的灰 */
.res-foot{
  color:var(--zs-muted2);
}

/* ============================================================================
 * 六、筛选 chip 规范
 * ----------------------------------------------------------------------------
 * 现状：未选文字 #41504F（偏绿灰，与全站中性色不一致）、高 29px（非栅格）、
 *      无边框、无 hover。
 * 修法：统一到 --muted 系、高 30px、补 1px 边框与 hover。
 * ========================================================================== */
.chip{
  border-radius:var(--zs-r-md);
  min-height:30px;
  display:inline-flex;
  align-items:center;
  border:1px solid transparent;
  transition:background-color var(--zs-ease), border-color var(--zs-ease), color var(--zs-ease);
}
.chip:not(.on){
  color:var(--muted);
  border-color:var(--line);
}
.chip:not(.on):hover{
  background:var(--zs-primary-l);
  color:var(--zs-primary);
  border-color:#c9dbff;
}
.chip.on{
  font-weight:600;
}

/* ============================================================================
 * 七、输入框规范
 * ----------------------------------------------------------------------------
 * 现状：高 32px、圆角 6px、边框 #dde3ec（偏浅）、无 focus 态。
 * 修法：高 36px（与中号按钮对齐）、圆角 8px、边框加深、focus 给主色边框 + 光环。
 * ========================================================================== */
:where(.input, input[type="text"], input[type="search"], input[type="tel"],
       input[type="email"], input[type="password"], input[type="number"], textarea, select):not(.readonly){
  border-radius:var(--zs-r-lg);
  border-color:var(--zs-border-input);
  transition:border-color var(--zs-ease), box-shadow var(--zs-ease);
}
:where(.input, input[type="text"], input[type="search"], input[type="tel"],
       input[type="email"], input[type="password"], input[type="number"], textarea, select):not(.readonly):focus{
  border-color:var(--zs-primary);
  box-shadow:0 0 0 3px rgba(26,86,214,.12);
  outline:none;
}

/* 只读字段（手机号/邮箱等展示位）保持朴素，但不要看着像"没填" */
.input.readonly{
  background:#f7f9fc;
  color:var(--muted);
}

/* ============================================================================
 * 八、徽章 / 标签
 * ----------------------------------------------------------------------------
 * 现状：.badge 字号 11px、padding 0 4px（太挤）、底 #ff5a4e 配白字对比度 3.3:1 不达标。
 * 修法：字号 12px、padding 2px 8px、危险色统一到 #dc2626（4.5:1 达标）。
 * ========================================================================== */
.badge{
  font-size:12px;
  font-weight:500;
  padding:2px 8px;
  border-radius:var(--zs-r-sm);
  line-height:1.5;
}
.badge,
.badge.danger{
  background:var(--zs-danger);
}

/* 类型标签（招标/中标）与状态标签（在招/已截止）预留语义色，
   供后续视图逐步迁移；现在只保证已用 .tag 的地方不刺眼。 */
.tag{
  border-radius:var(--zs-r-sm);
  font-weight:500;
}

/* ============================================================================
 * 九、卡片
 * ----------------------------------------------------------------------------
 * 圆角 10px→12px（统一到 4 的倍数），补 hover 轻提升。
 * 阴影保持极轻——白底风格里阴影一重就显脏。
 * ========================================================================== */
.card{
  border-radius:var(--zs-r-xl);
}
.card:hover{
  /* 只有可点卡片才需要 hover 阴影；不可点的卡片由 JS 加了 .is-static 时跳过 */
}
a.card:hover,
.card-hover:hover{
  box-shadow:0 4px 12px rgba(30,60,110,.10);
  border-color:#d7e0f5;
}

/* ============================================================================
 * 十、页脚可读性
 * ----------------------------------------------------------------------------
 * 现状：深色底 #0b1220 上文字 #8b95a4，对比度约 4.0:1（大字号勉强，小字不够）。
 * 修法：提亮到 #aeb8c4（约 7:1）。页脚是全站唯一深色块，保留不动。
 * ★ 只改颜色，不改布局 / 不改成白底 ★
 * ========================================================================== */
.site-foot{color:#aeb8c4}
.site-foot a:hover{color:#fff}

/* ============================================================================
 * 十一、H5 触控优化
 * ----------------------------------------------------------------------------
 * 依据 WCAG 2.5.5 与 Apple HIG：触控目标建议 ≥44px，最低不小于 36px。
 * 现状 chip 高 29-30px，手机上容易点错。
 * ★ 只在小屏生效，PC 布局完全不受影响 ★
 * ========================================================================== */
@media (max-width:900px){
  .chip{
    min-height:36px;
    padding-left:14px;
    padding-right:14px;
  }
  /* 点按区域补足，但不改变视觉尺寸 */
  .mini-btn,
  .res-foot a,
  .sort a{
    min-height:36px;
    display:inline-flex;
    align-items:center;
  }
  /* 汉堡菜单展开项行高 ≥44px，当前项加主色左边条 */
  .main-nav a{
    min-height:44px;
    display:flex;
    align-items:center;
  }
  .main-nav a.on{
    box-shadow:inset 3px 0 0 var(--zs-primary);
  }
  /* 刘海屏底部安全区 */
  .site-foot{
    padding-bottom:calc(24px + env(safe-area-inset-bottom, 0px));
  }
}

/* ============================================================================
 * 十二、尊重系统「减少动态效果」偏好
 * ----------------------------------------------------------------------------
 * 部分用户（尤其老年人、前庭功能敏感者）开了系统的"减少动画"，
 * 这时不该再给过渡动画。客户提到"年纪大的用户"，这条有实际意义。
 * ========================================================================== */
@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}
