/* ==========================================================================
   猿急送 V2.0 CSS 架构 - 核心 Token 与基础原子类
   ==========================================================================
   🚨 AI Instructions（跨对话强约束 · 最高优先级）
   本文件是全站色彩基线的唯一权威来源（Single Source of Truth）。
   任何 AI / 开发者，在新建对话、新页面开发、旧页面改造前，必须先读本文件，然后：

   1. 所有品牌绿 / 深绿 / 淡绿 / 深蓝灰导航 / 近黑正文 等色值，
      一律引用本文件 :root 里的 var(--yjs-*) 变量，禁止直接写十六进制裸值。

   2. 禁止在页面级 CSS / 内联 style 里另写死这些色值：
      #27AE60  #2ecc71  #008C6C  #006F5B
      #f4fbf7  #e0f0e6  #1a1d29  #232735
      #1d2129  #303133
      #1e8449  #1f8f4e  #208d4e  #1F8A4E  （已废弃深绿家族）

   3. 优先复用本文件底部提供的通用组件 class：
      .yjs-text-link / .yjs-badge-light / .yjs-nav-dark
      .yjs-btn-cta / .yjs-btn-ghost / .yjs-text-strong / .yjs-text-body

   4. 品牌色阶记忆方式：记变量与组件类，不记十六进制色号。
      样式修改前，先对照 `/consultant` 页面的现网表现，再回到本文件取变量/类实现；
      H5 / PC 必须保持同一套变量口径，不允许自行发明“近似绿色”。

   5. 违反上述任一条 → 视为违规，必须自纠。
   6. 完整规范见：`docs/V2_色阶与交互规范.md`
   ========================================================================== */

:root {
	/* ================= 品牌绿三阶（"三绿两灰"色阶方案 · 占页面 5%） =================
	   使用法则：主 CTA 用 --yjs-brand；白底文字链默认用 --yjs-brand-link-rest（深绿防飘），
	   hover 才回到 --yjs-brand；徽章/选中态底板用 --yjs-brand-bg。 */
	--yjs-brand: #27AE60;
	/* 绝对主角：主 CTA 按钮唯一色 */
	--yjs-brand-hover: #2ecc71;
	/* 备用亮绿（一般用 brightness(1.1) 替代） */
	--yjs-brand-active: #008C6C;
	/* 按下瞬间 & 文字链 hover 后深色态 */
	--yjs-brand-dark: #006F5B;
	/* 极深绿：极少数需要更深层级的文本 */
	--yjs-brand-link-rest: #008C6C;
	/* 沉稳基石：白底文字链默认色（防飘核心） */
	--yjs-brand-bg: #f4fbf7;
	/* 呼吸点缀：徽章底/选中态底（极淡绿） */
	--yjs-brand-bg-hover: #e0f0e6;
	/* 极淡绿的加深态，用于选中项 hover */

	/* ================= 中性压舱石（"三绿两灰"骨架 · 占页面 15%） ================= */
	--yjs-nav-dark: #1a1d29;
	/* 页面天花板：全站顶部导航底色 */
	--yjs-nav-dark-2: #232735;
	/* 导航渐变末端，与 nav-dark 配套使用 */
	--yjs-text-strong: #1d2129;
	/* 近黑：卡片主标题、核心数据、面包屑当前项 */
	--yjs-text-body: #303133;
	/* 深灰：正文、KV 数据、次级标题 */
	--yjs-price: #E67E22;
	/* 价格暖橙：项目金额、预算、总价等价格信息唯一色 */

	/* ================= 兼容旧 Token（保留不动，防止老页面样式漂移） ================= */
	--yjs-text-primary: #1f2d3d;
	--yjs-text-secondary: #5c6b77;
	--yjs-text-muted: #a0aab5;

	/* ================= 留白与舞台（占页面 80%） ================= */
	--yjs-border-color: #e0e6ed;
	--yjs-bg-light: #f5f7fa;
	/* 老 Token */
	--yjs-bg-page: #f4f5f7;
	/* 新：页面底色·极浅工业灰 */
	--yjs-bg-white: #ffffff;

	/* ================= 阴影体系 (Shadows) ================= */
	--yjs-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
	--yjs-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
	--yjs-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.08);

	/* 交互阴影 */
	--yjs-shadow-hover: 0 6px 14px rgba(39, 174, 96, 0.12);
	--yjs-shadow-btn-hover: 0 6px 14px rgba(39, 174, 96, 0.35);
	--yjs-shadow-cta: 0 4px 10px rgba(39, 174, 96, 0.2);
}

/* ==========================================================================
   全局重置与原子类
   ========================================================================== */

/* ------------------------------------------------------------------
   全站 <a> 默认色矫正
   历史 base（webpage_2.6.css / main.css）把 a 默认色写死为 #008C6C（老 active 色），
   与规则「文字链默认态 = var(--yjs-brand)」冲突，导致新组件默认继承深绿。
   在 v2 层做一次矫正，加载晚于 base css，天然覆盖，不改动老 css 便于回滚。

   【重要 · 智能排除按钮型 <a>】
   本规则仅作用于"裸文字链"，对任何 class 含 btn/cta/button 的 <a> 自动豁免，
   避免出现「绿底绿字」（按钮背景绿 + 全局把文字也染绿导致视觉消失）。
   命中豁免的按钮由自身 CSS 决定颜色，无需再五态锁 color。
   排除范围覆盖：`.xxx-btn` / `.btn-xxx` / `.btn` / `.xxx-cta` / `.cta-xxx` / `.button` 等。
   ------------------------------------------------------------------ */
a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]),
a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]):link,
a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]):visited {
	color: var(--yjs-brand);
}

a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]):hover,
a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]):focus {
	color: var(--yjs-brand-active);
}

/* 卡片型 <a> 重置：颜色继承父级，用于 stat-item / quick-item / card-more 等
   把整块区域包成 <a> 的组件。避免每写一个新组件都要抄五态 !important 模板。 */
.yjs-v2-a-reset,
.yjs-v2-a-reset:link,
.yjs-v2-a-reset:visited,
.yjs-v2-a-reset:hover,
.yjs-v2-a-reset:focus,
.yjs-v2-a-reset:active {
	color: inherit;
	text-decoration: none;
}

/* 简历通用卡片骨架 */
.yjs-v2-card {
	border: 1px solid var(--yjs-border-color);
	border-radius: 6px;
	padding: 14px 16px;
	overflow: visible;
	position: relative;
	z-index: 1;
	transition: all 0.3s;
	background: var(--yjs-bg-white);
}

.yjs-v2-card:hover {
	z-index: 20;
}

/* 高亮关键词 */
.yjs-v2-highlight {
	color: #E74C3C;
	font-weight: bold;
}

/* SVG 图标 */
.yjs-v2-icon {
	width: 12px;
	height: 12px;
	margin-right: 3px;
	vertical-align: -2px;
	fill: currentColor;
}

/* ================= SVG Sprite 通用图标类 =================
   配合 Public/Icons/sprite.html 使用：
   <svg class="yjs-icon"><use href="#icon-xxx"/></svg>
   颜色继承父级 color；默认 14px，尺寸变体见下方修饰类 */
.yjs-icon {
	width: 14px;
	height: 14px;
	fill: currentColor;
	vertical-align: -2px;
	flex-shrink: 0;
}

.yjs-icon--sm {
	width: 12px;
	height: 12px;
}

.yjs-icon--md {
	width: 16px;
	height: 16px;
}

.yjs-icon--lg {
	width: 20px;
	height: 20px;
}

/* 弹窗防抖动：模态框弹出时阻止 body 右侧出现空白 */
body.modal-open {
	padding-right: 0 !important;
	overflow-y: scroll !important;
}

/* 保护顶部导航不被 Bootstrap 弹窗推移 */
body.modal-open .header_nav {
	padding-right: 0 !important;
}

/* 基础主按钮：恢复全局主 CTA 默认态，避免 Bootstrap 2.x 灰色按钮回退 */
.yjs-v2-btn-primary,
.yjs-v2-btn-primary:link,
.yjs-v2-btn-primary:visited {
	background-color: var(--yjs-brand) !important;
	border-color: var(--yjs-brand) !important;
	color: var(--yjs-bg-white) !important;
	text-decoration: none !important;
	cursor: pointer;
}

.yjs-v2-btn-primary:hover,
.yjs-v2-btn-primary:focus {
	background-color: var(--yjs-brand) !important;
	border-color: var(--yjs-brand) !important;
	color: var(--yjs-bg-white) !important;
	filter: brightness(1.1);
	box-shadow: var(--yjs-shadow-btn-hover) !important;
	text-decoration: none !important;
}

.yjs-v2-btn-primary:active {
	background-color: var(--yjs-brand-active) !important;
	border-color: var(--yjs-brand-active) !important;
	color: var(--yjs-bg-white) !important;
	filter: brightness(0.95);
}

/* 基础次级按钮（如浅色底绿字） */
.yjs-v2-btn-secondary {
	background-color: #edf6f1 !important;
	color: var(--yjs-brand-active) !important;
	transition: all 0.2s ease-in-out;
}

/* ==========================================================================
   V2 筛选器（列表页顶部）— 覆盖 webpage_2.6.css 老版黑色 active 皮肤
   保持 <a> 结构不动（SEO/GEO 硬红线），只做视觉替换
   ========================================================================== */
.left_main .widget .filter_div .filter_container .filter_item>a,
.left_main .widget .filter_div .filter_container .filter_item>a:link,
.left_main .widget .filter_div .filter_container .filter_item>a:visited {
	color: var(--yjs-text-body);
	background-color: transparent;
	border-radius: 6px;
	padding: 4px 12px;
	margin-right: 4px;
	margin-bottom: 6px;
	transition: all 0.18s ease;
	text-decoration: none;
	display: inline-block;
}

.left_main .widget .filter_div .filter_container .filter_item>a:hover {
	color: var(--yjs-brand);
	background-color: var(--yjs-brand-bg);
	text-decoration: none;
}

.left_main .widget .filter_div .filter_container .filter_item .active,
.left_main .widget .filter_div .filter_container .filter_item .active:link,
.left_main .widget .filter_div .filter_container .filter_item .active:visited,
.left_main .widget .filter_div .filter_container .filter_item .active:hover,
.left_main .widget .filter_div .filter_container .filter_item .active:focus {
	background-color: var(--yjs-brand-bg);
	color: var(--yjs-brand);
	font-weight: 600;
	border-radius: 6px;
}

.left_main .widget .filter_div .filter_title {
	color: var(--yjs-text-muted);
	font-weight: 400;
	font-size: 13px;
	padding-top: 4px;
}

.left_main .widget .filter_div .filter_container .filter_more_list,
.left_main .widget .filter_div .filter_container .filter_more_list:link,
.left_main .widget .filter_div .filter_container .filter_more_list:visited {
	color: var(--yjs-text-muted);
	background-color: transparent;
	padding: 4px 8px;
	border-radius: 6px;
	text-decoration: none;
}

.left_main .widget .filter_div .filter_container .filter_more_list:hover {
	color: var(--yjs-brand);
	background-color: var(--yjs-brand-bg);
}

/* 接项目列表页筛选区：Flex 重写老 float 布局，修复角色行折行后顶到左侧的问题 */
.yjs-job-list-page .yjs-job-filter-card {
	padding: 20px 24px;
	margin-bottom: 14px;
	overflow: hidden;
	border-radius: 12px;
}

.yjs-job-list-page .yjs-job-filter-card .filter_div {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 10px;
}

.yjs-job-list-page .yjs-job-filter-card .filter_div:last-child {
	margin-bottom: 0;
}

.left_main .yjs-job-list-page .yjs-job-filter-card .filter_title,
.yjs-job-list-page .yjs-job-filter-card .filter_title {
	float: none;
	width: 36px;
	flex: 0 0 36px;
	padding: 4px 0 0;
	line-height: 22px;
	text-align: left;
	/* "城市/技术/排序" 标签必须清晰可读，用深黑 strong + 600 加粗，
	   加 !important 覆盖 L256 `.left_main .widget .filter_div .filter_title` 的 muted 灰。
	   避免继承 muted 灰 + 13px 导致视觉消失。 */
	color: var(--yjs-text-strong) !important;
	font-weight: 600 !important;
	font-size: 14px !important;
}

.yjs-job-list-page .yjs-job-filter-card .filter_container {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	width: auto;
	min-width: 0;
	flex: 1;
}

/* 特异性提到 5 级，压过老规则 `.widget .filter_div .filter_container .filter_item`(0,0,4,0) */
.yjs-job-list-page .yjs-job-filter-card .filter_div .filter_container .filter_item {
	float: none;
	width: auto;
	min-width: 0;
	flex: 1;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 4px;
	/* 默认收纳态保持 1 行：通过压缩选项横向留白，让常用项尽量在首行展示 */
	height: 34px;
	padding: 2px 0;
	overflow: hidden;
}

/* 接项目页职位行：默认首行刚好显示到"嵌入式工程师"，后续交给"更多"展开，避免过度拥挤 */
.yjs-job-list-page .yjs-job-filter-card .filter_div:nth-of-type(2) .filter_container .filter_item {
	flex: 0 0 602px;
}

.yjs-job-list-page .yjs-job-filter-card .filter_div .filter_container .filter_item_show {
	height: auto;
	padding: 2px 0;
	overflow: visible;
}

/* 点击"更多"按钮后 main_2.3.js 会给 .filter_item 加 .open 类，需展开为多行 */
.yjs-job-list-page .yjs-job-filter-card .filter_div .filter_container .filter_item.open {
	height: auto;
	overflow: visible;
}

.left_main .widget.yjs-job-filter-card .filter_div .filter_container .filter_item>a,
.left_main .widget.yjs-job-filter-card .filter_div .filter_container .filter_item>a:link,
.left_main .widget.yjs-job-filter-card .filter_div .filter_container .filter_item>a:visited,
.yjs-job-list-page .yjs-job-filter-card .filter_item>a,
.yjs-job-list-page .yjs-job-filter-card .filter_item>a:link,
.yjs-job-list-page .yjs-job-filter-card .filter_item>a:visited {
	margin: 0;
	padding-left: 8px;
	padding-right: 8px;
	line-height: 22px;
	white-space: nowrap;
}

.yjs-job-list-page .yjs-job-filter-card .filter_more_list,
.yjs-job-list-page .yjs-job-filter-card .filter_more_list:link,
.yjs-job-list-page .yjs-job-filter-card .filter_more_list:visited {
	float: none;
	flex: 0 0 auto;
	line-height: 22px;
	padding-left: 6px;
	padding-right: 6px;
	margin-top: 0;
	white-space: nowrap;
}

/* ==========================================================================
   V2 全站面包屑统一基线（GEO/SEO 双友好）
   ==========================================================================
   基线口径（图 3/4 · 精准搜页面）：
     - 分隔符：/ （灰色 #c0c4cc）
     - 前置链接：弱灰 --yjs-text-muted
     - 尾项：近黑 --yjs-text-strong
     - hover：变品牌绿
     - 点击后不保留脏色
   两大挂载点：
     1) 老页面：.crumbs_div.yjs-global-crumb（保留 4 页现挂载）
     2) 新页面：<nav class="yjs-breadcrumb">（组件 Public/breadcrumb.html）
   硬红线：不改任何 <a> 数量、锚文本、href，仅收敛视觉。
   ========================================================================== */

/* ---------- 老挂载点 · 兼容层 ----------
   注：老版本用 .webpage_main>.crumbs_div.yjs-global-crumb 直接子选择器，
   但 pro_list / ConsultantProduction/listpage 把面包屑放在 .left_main 内部，
   无法命中。改为纯类选择器 .crumbs_div.yjs-global-crumb 全命中，
   yjs-global-crumb 本身是显式钩子（opt-in），不会外溢。 */
.crumbs_div.yjs-global-crumb {
	clear: both;
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 2px 0 6px;
	margin-top: 0;
	margin-bottom: 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--yjs-text-muted);
}

/* 通栏面包屑（.webpage_main 直接子）· 与 /job 基线一致，
   为左右双栏提供顶部呼吸带（下方 12px 留白），确保左右栏顶部对齐 */
.webpage_main>.crumbs_div.yjs-global-crumb {
	margin-bottom: 12px;
}

.webpage_main>.yjs-job-list-page {
	clear: both;
}

.webpage_main>.yjs-job-list-page,
.webpage_main>.yjs-job-sidebar {
	margin-top: 5px;
}

.webpage_main .crumbs_div.yjs-global-crumb a,
.webpage_main .crumbs_div.yjs-global-crumb a:link,
.webpage_main .crumbs_div.yjs-global-crumb a:visited,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:link,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:visited {
	color: var(--yjs-text-muted);
	text-decoration: none;
	transition: color .15s ease;
}

.webpage_main .crumbs_div.yjs-global-crumb a:hover,
.webpage_main .crumbs_div.yjs-global-crumb a:focus-visible,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:hover,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:focus-visible {
	color: var(--yjs-brand);
	text-decoration: none;
}

.webpage_main .crumbs_div.yjs-global-crumb a:active,
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:active {
	color: var(--yjs-brand-active);
	text-decoration: none;
}

.webpage_main .crumbs_div.yjs-global-crumb a:focus:not(:focus-visible),
.crumbs_div.yjs-global-crumb.yjs-global-crumb a:focus:not(:focus-visible) {
	color: var(--yjs-text-muted);
	text-decoration: none;
}

.crumbs_div.yjs-global-crumb h1 {
	display: inline;
	font-size: 13px;
	font-weight: 600;
	color: var(--yjs-text-strong);
	margin: 0;
	line-height: 1.6;
}

/* h1 内的 <a>（如 pro_list.html <h1><a>{$crumbs_3}</a></h1>）取消链接色 */
.webpage_main .crumbs_div.yjs-global-crumb h1 a,
.webpage_main .crumbs_div.yjs-global-crumb h1 a:link,
.webpage_main .crumbs_div.yjs-global-crumb h1 a:visited,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:link,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:visited {
	color: var(--yjs-text-strong);
	font-weight: 600;
	text-decoration: none;
}

.webpage_main .crumbs_div.yjs-global-crumb h1 a:hover,
.webpage_main .crumbs_div.yjs-global-crumb h1 a:focus-visible,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:hover,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:focus-visible {
	color: var(--yjs-brand);
	text-decoration: none;
}

.webpage_main .crumbs_div.yjs-global-crumb h1 a:active,
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:active {
	color: var(--yjs-brand-active);
	text-decoration: none;
}

.webpage_main .crumbs_div.yjs-global-crumb h1 a:focus:not(:focus-visible),
.crumbs_div.yjs-global-crumb.yjs-global-crumb h1 a:focus:not(:focus-visible) {
	color: var(--yjs-text-strong);
	text-decoration: none;
}

/* 分隔符收敛：把老 &rsaquo;（›）视觉替换为 /，字符本体不动（保留 DOM 结构，SEO 零损） */
.crumbs_div.yjs-global-crumb .scrumbs_span_icon {
	display: inline-block;
	width: 18px;
	text-align: center;
	font-size: 0 !important;
	color: transparent !important;
	vertical-align: baseline;
}

.crumbs_div.yjs-global-crumb .scrumbs_span_icon::before {
	content: '/';
	font-size: 13px;
	color: #c0c4cc;
	font-weight: 400;
}

/* ---------- 新组件 · Public/breadcrumb.html 挂载点 ---------- */
.yjs-breadcrumb {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 2px 0 6px;
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--yjs-text-muted);
}

.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link,
.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:link,
.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:visited,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:link,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:visited {
	color: var(--yjs-text-muted);
	text-decoration: none;
	transition: color .15s ease;
}

.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:hover,
.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:focus-visible,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:hover,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:focus-visible {
	color: var(--yjs-brand);
	text-decoration: none;
}

.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:active,
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:active {
	color: var(--yjs-brand-active);
	text-decoration: none;
}

.webpage_main .yjs-breadcrumb .yjs-breadcrumb-link:focus:not(:focus-visible),
.yjs-breadcrumb.yjs-breadcrumb .yjs-breadcrumb-link:focus:not(:focus-visible) {
	color: var(--yjs-text-muted);
	text-decoration: none;
}

.yjs-breadcrumb .yjs-breadcrumb-current {
	display: inline;
	font-size: 13px;
	font-weight: 600;
	color: var(--yjs-text-strong);
	margin: 0;
}

.yjs-breadcrumb .yjs-breadcrumb-sep {
	display: inline-block;
	margin: 0 6px;
	color: #c0c4cc;
	font-weight: 400;
}

/* 组件模式差异化：默认 row 通栏（放在 .webpage_main 内、.left_main 之上）
   与 /job 基线的 .crumbs_div.yjs-global-crumb 呼吸带对齐 */
.webpage_main>.yjs-breadcrumb--row {
	margin-bottom: 12px;
}

/* inline 模式：兼容嵌在左栏内部的老布局，保持与原视觉一致 */
.yjs-breadcrumb--inline {
	margin-bottom: 8px;
}

/* ---------- 兼容 · Consultant/listpage.html inline 面包屑 ---------- */
.yjs-crumb-inline .consultant_crumb_link,
.yjs-crumb-inline .consultant_crumb_link:link,
.yjs-crumb-inline .consultant_crumb_link:visited {
	color: var(--yjs-brand-link-rest);
	text-decoration: none;
	transition: color .15s ease;
}

.yjs-crumb-inline .consultant_crumb_link:hover,
.yjs-crumb-inline .consultant_crumb_link:focus {
	color: var(--yjs-brand);
	text-decoration: underline;
}

/* V2 顶部胶囊通知条（替代原来的 yjs-card-list "成为技术顾问"） */
.yjs-v2-notice-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 20px;
	background: linear-gradient(90deg, #f7fcf9 0%, #ffffff 100%);
	border-radius: 8px;
	border: 1px solid var(--yjs-brand-bg);
	margin-bottom: 16px;
}

.yjs-v2-notice-bar .yjs-notice-text {
	font-size: 13px;
	color: var(--yjs-text-body);
}

.yjs-v2-notice-bar .yjs-notice-text strong {
	color: var(--yjs-brand);
	font-weight: 600;
}

.yjs-v2-notice-bar .yjs-notice-cta {
	font-size: 13px;
	padding: 6px 18px;
	border-radius: 6px;
	font-weight: 500;
}

/* V2 顶部元信息（数据背书） */
.yjs-v2-meta-info {
	font-size: 13px;
	color: var(--yjs-text-muted);
	padding: 4px 0 12px;
	line-height: 1.6;
}

.yjs-v2-meta-info strong {
	color: var(--yjs-brand);
	font-weight: 600;
	margin: 0 2px;
}

/* V2 卡片右上角热标（投递热度） */
.yjs-v2-hot-tag {
	position: absolute;
	top: 22px;
	right: 24px;
	font-size: 12px;
	color: var(--yjs-text-muted);
	font-weight: 400;
	line-height: 18px;
	letter-spacing: 0.2px;
	background: transparent;
	padding: 0;
}

.yjs-v2-hot-tag i {
	font-style: normal;
	font-weight: 500;
	color: var(--yjs-text-body);
}

/* V2 已投递态胶囊（非按钮形态） */
.yjs-v2-status-done {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 14px;
	border-radius: 6px;
	background-color: #f0f2f5;
	color: #a0aab5;
	font-size: 13px;
	font-weight: 500;
	cursor: default;
}

.yjs-v2-status-done::before {
	content: "✓";
	font-size: 12px;
}

/* ============================================================
   投递职位弹窗 V2 化（作用域仅 .appoint_dialog，不影响其他 WeUI 弹窗）
   覆盖 weui.css 老样式：白底 + 16px 圆角 + 柔阴影 + 现代按钮
   ============================================================ */
.appoint_dialog .weui_mask {
	background: rgba(15, 23, 42, 0.55);
}

.appoint_dialog .weui_dialog {
	width: 420px;
	max-width: calc(100vw - 32px);
	background-color: #fff;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18), 0 4px 12px rgba(15, 23, 42, 0.06);
	overflow: hidden;
	text-align: left;
}

.appoint_dialog .weui_dialog .weui_dialog_hd {
	padding: 24px 28px 8px;
	text-align: left;
}

.appoint_dialog .weui_dialog .weui_dialog_title {
	font-size: 18px;
	font-weight: 600;
	color: var(--yjs-text-strong);
	line-height: 1.4;
}

.appoint_dialog .weui_dialog .weui_dialog_bd {
	padding: 4px 28px 24px;
	font-size: 14px;
	line-height: 1.7;
	color: var(--yjs-text-body);
	text-align: left;
	word-break: normal;
}

.appoint_dialog .weui_dialog .weui_dialog_ft {
	margin-top: 0;
	padding: 16px 20px 20px;
	display: flex;
	gap: 12px;
	justify-content: flex-end;
	line-height: normal;
	font-size: 14px;
	border-top: 1px solid #f0f2f5;
}

.appoint_dialog .weui_dialog_ft::after,
.appoint_dialog .weui_dialog_ft a::after {
	display: none !important;
}

.appoint_dialog .weui_btn_dialog {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 96px;
	height: 40px;
	padding: 0 20px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.18s ease;
	position: static;
}

.appoint_dialog .weui_btn_dialog.default,
.appoint_dialog .weui_btn_dialog.default:link,
.appoint_dialog .weui_btn_dialog.default:visited {
	background-color: #fff;
	color: var(--yjs-text-body);
	border: 1px solid #e0e6ed;
}

.appoint_dialog .weui_btn_dialog.default:hover,
.appoint_dialog .weui_btn_dialog.default:focus {
	background-color: #f5f7fa;
	color: var(--yjs-text-strong);
	border-color: #cfd6e0;
}

.appoint_dialog .weui_btn_dialog.default:active {
	background-color: #eaecef;
}

.appoint_dialog .weui_btn_dialog.primary,
.appoint_dialog .weui_btn_dialog.primary:link,
.appoint_dialog .weui_btn_dialog.primary:visited {
	background-color: var(--yjs-brand);
	color: #fff;
	border: 1px solid var(--yjs-brand);
	box-shadow: 0 4px 10px rgba(39, 174, 96, 0.2);
}

.appoint_dialog .weui_btn_dialog.primary:hover,
.appoint_dialog .weui_btn_dialog.primary:focus {
	filter: brightness(1.06);
	box-shadow: var(--yjs-shadow-btn-hover);
	color: #fff;
}

.appoint_dialog .weui_btn_dialog.primary:active {
	background-color: var(--yjs-brand-active);
	filter: brightness(0.96);
	color: #fff;
}

/* V2 分页 Ghost 化：省略号与首页锚点 */
.pagination_webpage>li>a,
.pagination_webpage>li>a:link,
.pagination_webpage>li>a:visited {
	color: var(--yjs-text-body);
	background-color: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	transition: all 0.18s ease;
	margin: 0 2px;
}

.pagination_webpage>li>a:hover,
.pagination_webpage>li>a:focus {
	color: var(--yjs-brand);
	background-color: var(--yjs-brand-bg);
	border-color: transparent;
}

.pagination_webpage>li.disabled>span {
	background-color: transparent;
	border: 1px solid transparent;
	color: #a0aab5;
}

/* 全局清除点击时的浏览器默认黑框 (Focus Outline) */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline: none !important;
	text-decoration: none;
}

/* ==========================================================================
   YJS V2 Design System - Global Reusable Component Cards (Atomic/Utility)
   (提取自 consultant 页面，供全站需求大厅、后台等场景复用)
   ========================================================================== */

/* 1. 通用列表卡片骨架 (The Universal List Card)
   使用: <div class="yjs-card-list">...</div>
   作用: 统一全站卡片的 8px 圆角、呼吸 padding，作为静态容器使用 */
.yjs-card-list {
	background-color: var(--yjs-bg-white);
	border: none;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 16px;
	position: relative;
}

/* --- 卡片顶部品牌色点缀线已被废弃 --- */

/* 2. 多行文本截断 (Text Clamp Description)
   使用: <p class="yjs-text-clamp-4">大段文本...</p>
   作用: 优雅展示技术栈、项目描述等，超过 N 行自动省略号，统一行高与字色 */
.yjs-text-clamp-2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	word-break: break-all;
	font-size: 13px;
	line-height: 1.8;
	color: var(--yjs-text-body);
}

.yjs-text-clamp-4 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	word-break: break-all;
	font-size: 13px;
	line-height: 1.8;
	color: var(--yjs-text-body);
}

/* 3. Ghost 状态标签体系 (Ghost Status Badges)
   使用: <span class="yjs-badge-ghost-xxx">标签名</span>
   作用: 拒绝实心重色块，用 10% 底色 + 100% 字色传递轻量反馈 */
.yjs-badge-ghost {
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 12px;
	line-height: 18px;
	font-weight: 500;
	white-space: nowrap;
}

.yjs-badge-ghost-normal {
	/* 淡蓝: 普通/个人 */
	color: #2aabd2;
	background-color: #E8F4F8;
}

.yjs-badge-ghost-neutral {
	/* 中性属性: 项目制/远程等非重点信息 */
	color: var(--yjs-text-secondary);
	background-color: var(--yjs-bg-light);
}

.yjs-badge-ghost-hot {
	/* 淡橙: 火热/成就 */
	color: #e65c00;
	background-color: #fff5eb;
}

.yjs-badge-ghost-official {
	/* 淡绿: 官方/团队 */
	color: var(--yjs-brand);
	background-color: var(--yjs-brand-bg);
}

/* 4. 侧边栏通用背书面板 (Trust Badge Sidebar Panel)
   使用: <div class="yjs-trust-panel">...</div>
   作用: 在支付、详情页侧边栏增强转化率的独立模块，带有极淡的底部渐变 */
.yjs-trust-panel {
	background: linear-gradient(180deg, #f7fcf9 0%, #ffffff 100%);
	border: none;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 24px;
}

/* 5. 悬浮操作胶囊 (Floating Action Button Capsule)
   使用: <div class="yjs-fab-capsule">...</div>
   作用: 返回顶部、悬浮客服等需要从圆圈丝滑展开为长条的交互容器 */
.yjs-fab-capsule {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	height: 48px;
	width: 48px;
	min-width: 48px;
	border-radius: 24px;
	overflow: hidden;
	transition: width 0.28s cubic-bezier(0.16, 1, 0.3, 1), border-radius 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), filter 0.28s cubic-bezier(0.16, 1, 0.3, 1), transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 文字链（沉稳基石版）：白底上的纯文字跳转，默认深绿防飘，hover 回品牌绿加下划线
   使用示例：<a class="yjs-text-link" href="...">案例名称</a>
   适用：案例名、"还有 X 个 >"、"返回列表"、卡片内跳转文字 */
.yjs-text-link,
.yjs-text-link:link,
.yjs-text-link:visited {
	color: var(--yjs-brand-link-rest) !important;
	text-decoration: none !important;
	transition: color 0.2s ease;
}

.yjs-text-link:hover,
.yjs-text-link:focus {
	color: var(--yjs-brand) !important;
	text-decoration: underline !important;
}

/* 徽章/身份标签（呼吸点缀版）：极淡绿底 + 品牌绿字
   使用示例：<span class="yjs-badge-light">团队</span>
   适用：身份识别徽章、静态属性标签、筛选选中态背景 */
.yjs-badge-light {
	color: var(--yjs-brand) !important;
	background-color: var(--yjs-brand-bg) !important;
	font-size: 12px;
	line-height: 18px;
	padding: 2px 8px;
	border-radius: 4px;
	display: inline-block;
}

/* 信息型轻标签：用于“个人”等客观属性，不与主品牌绿抢权重 */
.yjs-badge-soft-info {
	color: #4f6b7a !important;
	background-color: #eef4f7 !important;
	font-size: 12px;
	line-height: 18px;
	padding: 2px 8px;
	border-radius: 4px;
	display: inline-block;
}

/* 暖色背书标签：用于“已交付”等信任增强，不用于主按钮 */
.yjs-badge-warm {
	color: #e65c00 !important;
	background-color: #fff5eb !important;
	font-size: 12px;
	line-height: 18px;
	padding: 2px 8px;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
}

/* 深色顶部导航（页面天花板）：全站顶部导航渐变工具类
   使用示例：<nav class="yjs-nav-dark">...</nav>
   或直接在 CSS 里用：background: linear-gradient(90deg, var(--yjs-nav-dark) 0%, var(--yjs-nav-dark-2) 100%); */
.yjs-nav-dark {
	background: linear-gradient(90deg, var(--yjs-nav-dark) 0%, var(--yjs-nav-dark-2) 100%);
}

/* 主 CTA 按钮（绝对主角）：品牌绿实心 + 白字，hover 用 brightness 提亮 + 加阴影
   使用示例：<a class="yjs-btn-cta" href="...">发布任务</a>
   适用：全站唯一转化按钮（发布任务、咨询该人才、提交等） */
.yjs-btn-cta,
.yjs-btn-cta:link,
.yjs-btn-cta:visited {
	display: inline-block;
	background-color: var(--yjs-brand) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 6px;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 24px;
	text-decoration: none !important;
	box-shadow: var(--yjs-shadow-cta);
	transition: all 0.2s ease;
	cursor: pointer;
}

.yjs-btn-cta:hover,
.yjs-btn-cta:focus {
	color: #ffffff !important;
	filter: brightness(1.1);
	box-shadow: var(--yjs-shadow-btn-hover);
	text-decoration: none !important;
}

.yjs-btn-cta:active {
	background-color: var(--yjs-brand-active) !important;
	color: #ffffff !important;
	filter: brightness(0.95);
}

/* 次级按钮（白底灰框）：默认白底灰字，hover 变品牌绿框 + 淡绿底
   使用示例：<a class="yjs-btn-ghost">收藏</a>
   适用：辅助操作按钮 */
.yjs-btn-ghost,
.yjs-btn-ghost:link,
.yjs-btn-ghost:visited {
	display: inline-block;
	background-color: #ffffff !important;
	color: #8492a6 !important;
	border: 1px solid var(--yjs-border-color) !important;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 500;
	padding: 7px 20px;
	text-decoration: none !important;
	transition: all 0.2s ease;
	cursor: pointer;
}

.yjs-btn-ghost:hover,
.yjs-btn-ghost:focus {
	color: var(--yjs-brand) !important;
	border-color: var(--yjs-brand) !important;
	background-color: var(--yjs-brand-bg) !important;
	text-decoration: none !important;
}

.yjs-btn-ghost:active {
	color: var(--yjs-brand-active) !important;
	border-color: var(--yjs-brand) !important;
	background-color: var(--yjs-brand-bg-hover) !important;
}

/* 文字骨架（近黑/深灰）·工具类，用于打散老页面里的裸色值 */
.yjs-text-strong {
	color: var(--yjs-text-strong) !important;
}

.yjs-text-body {
	color: var(--yjs-text-body) !important;
}

/* 主品牌色线框按钮（用于需要突出但非最高权重的 CTA，如侧边栏补充入口）
   默认白底绿字绿框，hover 淡绿底色
   使用示例：<a class="yjs-btn-outline-primary">发布任务</a> */
.yjs-btn-outline-primary,
.yjs-btn-outline-primary:link,
.yjs-btn-outline-primary:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #ffffff !important;
	color: var(--yjs-brand) !important;
	border: 1px solid var(--yjs-brand) !important;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 500;
	padding: 7px 20px;
	text-decoration: none !important;
	transition: all 0.2s ease;
	cursor: pointer;
}

.yjs-btn-outline-primary:hover,
.yjs-btn-outline-primary:focus {
	color: var(--yjs-brand-active) !important;
	border-color: var(--yjs-brand-active) !important;
	background-color: var(--yjs-brand-bg) !important;
	text-decoration: none !important;
}

.yjs-btn-outline-primary:active {
	background-color: var(--yjs-brand-bg-hover) !important;
	color: var(--yjs-brand-dark) !important;
	border-color: var(--yjs-brand-dark) !important;
}

/* 接项目列表页卡片底部：左侧只放核心预算，右侧聚合雇主信息与投递动作 */
.yjs-job-card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--yjs-border-color);
}

.yjs-job-budget {
	flex: 0 0 auto;
}

.yjs-job-budget-label {
	font-size: 13px;
	color: var(--yjs-text-muted);
	margin-bottom: 4px;
	line-height: 1;
}

.yjs-job-budget-value {
	/* 与简历详情日薪 .yjs-cd-meta-val.money 保持一致的暖橙金额色，避免与品牌绿 CTA 抢焦点 */
	color: var(--yjs-price);
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
}

.yjs-job-meta-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 18px;
	min-width: 0;
	flex: 1;
}

.yjs-job-employer-meta {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	min-width: 0;
}

.yjs-job-employer-link,
.yjs-job-employer-link:link,
.yjs-job-employer-link:visited,
.yjs-job-employer-link:hover,
.yjs-job-employer-link:focus {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	color: var(--yjs-text-body);
	text-decoration: none;
}

.yjs-job-employer-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	margin-right: 8px;
	flex: 0 0 auto;
}

.yjs-job-employer-name {
	max-width: 86px;
	font-size: 13px;
	color: var(--yjs-text-body);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.yjs-job-employer-stats,
.yjs-job-list-page .yjs-job-employer-stats-link,
.yjs-job-list-page .yjs-job-employer-stats-link:link,
.yjs-job-list-page .yjs-job-employer-stats-link:visited {
	font-size: 12px;
	color: var(--yjs-text-muted);
	white-space: nowrap;
}

.yjs-job-list-page .yjs-job-employer-stats-link:hover,
.yjs-job-list-page .yjs-job-employer-stats-link:focus {
	color: var(--yjs-brand);
	text-decoration: underline;
}

.yjs-job-card-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 0 auto;
}

.yjs-sidebar-resume-btn,
.yjs-sidebar-resume-btn:link,
.yjs-sidebar-resume-btn:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 150px;
	box-sizing: border-box;
	padding: 8px 18px;
}

/* /job 右侧栏"完善简历"按钮外层容器居中 */
.yjs-job-sidebar .yjs-card-list .content.download {
	text-align: center;
}

/* /job 右侧栏"需求方误入引导条"（方案 C：淡品牌绿弱底 + 图标 + 价值副标，弱权重不冲击主 CTA） */
.yjs-sidebar-employer-hint {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	margin-bottom: 12px;
	background: var(--yjs-brand-bg);
	border: none;
	border-radius: 10px;
	line-height: 1.4;
}

.yjs-sidebar-employer-hint .yjs-hint-icon {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	color: var(--yjs-brand);
}

.yjs-sidebar-employer-hint .yjs-hint-text {
	flex: 1;
	min-width: 0;
}

.yjs-sidebar-employer-hint .yjs-hint-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--yjs-text-strong);
	line-height: 1.3;
}

.yjs-sidebar-employer-hint .yjs-hint-sub {
	margin-top: 2px;
	font-size: 12px;
	color: var(--yjs-text-muted);
	line-height: 1.3;
}

.yjs-sidebar-employer-hint .yjs-hint-cta,
.yjs-sidebar-employer-hint .yjs-hint-cta:link,
.yjs-sidebar-employer-hint .yjs-hint-cta:visited {
	flex: 0 0 auto;
	color: var(--yjs-brand);
	text-decoration: none;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	transition: color 0.18s ease;
}

.yjs-sidebar-employer-hint .yjs-hint-cta:hover,
.yjs-sidebar-employer-hint .yjs-hint-cta:focus {
	color: var(--yjs-brand-active);
	text-decoration: underline;
	background-color: transparent;
}

/* ==========================================================================
   /job 列表页专用：中和 webpage_2.6.css 老规则 `.hover1 a:hover{background:#303030;color:#fff}`
   仅在 `.yjs-job-list-page.hover1` 双类同时命中时生效（当前只有 Job/listpage.html 满足），
   不外溢到其它挂 `.hover1` 但没挂 `.yjs-job-list-page` 的 V2 页面（如 ConsultantProduction 系列）。
   特异性 (0,0,3,0)：
   - 高于老规则 `.hover1 a:hover` (0,0,2,0)，可稳定压制黑底白字；
   - 低于筛选器 `.left_main .widget .filter_div .filter_container .filter_item>a:hover` (0,0,4,1)、
     分页 `.pagination_webpage>li>a:hover` (0,0,3,1)、按钮 `!important` 组，因此不会破坏其它 V2 组件 hover。
   ========================================================================== */
/* 兜底：清零老规则的黑底，颜色交由下游各链接自己决定 */
.yjs-job-list-page.hover1 a:hover,
.yjs-job-list-page.hover1 a:focus {
	background-color: transparent;
}

/* 职位标题 hover 变品牌绿（跟 /consultant 人才卡公司名交互语法对齐：
   rest 黑字加粗 → hover 品牌绿，无下划线、无背景变化）。
   必须带 !important 覆盖 `.yjs-text-strong` 自身的 color !important。 */
.yjs-job-list-page .consultant_title>a.yjs-text-strong:hover,
.yjs-job-list-page .consultant_title>a.yjs-text-strong:focus {
	color: var(--yjs-brand) !important;
	background-color: transparent;
	text-decoration: none;
}

/* 卡内“描述区 <a>” hover 时联动主标题也变品牌绿。
   注意：这里不能监听 :focus，否则点击标题自身后，父级 :has() 会把标题长期染绿。 */
.yjs-job-list-page .yjs-card-list:has(> .consultant_title > a[href] + div + a[href]:hover) .yjs-link-title {
	color: var(--yjs-brand) !important;
}

/* ==========================================================================
   V2 页面标记类（Opt-in Design System 入场证）
   任何挂载 .yjs-v2-page 的页面根容器，自动获得以下能力：
     1) 免疫 webpage_2.6.css 老规则 `.hover1 a:hover{background:#303030;color:#fff}`
        的黑底白字祖传 bug，未来新页面不用再打补丁。
     2) 可搭配 .yjs-link-title / .yjs-link-muted 组合出全站统一的 V2 链接交互。
   注意：本类是 opt-in（显式加类才生效），不外溢老页面。
   ========================================================================== */
.yjs-v2-page a:hover,
.yjs-v2-page a:focus {
	background-color: transparent;
}

/* -- 主标题级文字链：卡片内加粗深色标题，hover 品牌绿，无下划线 --
   使用示例：<a class="yjs-link-title">嵌入式软硬件工程师</a>
   适用场景：职位标题、案例名等卡片内独立可点主锚
   （若外层是整卡 <a> 联动子 <span> 的模式，不用此类，写卡片级 hover 联动即可） */
.yjs-link-title,
.yjs-link-title:link,
.yjs-link-title:visited {
	/* !important 用于覆盖同文件 L94 的全局裸链规则
	   `a:not([class*="btn"])...` (特异度 0,3,1)，
	   否则 .yjs-link-title (特异度 0,1,1) 会被染成品牌绿。 */
	color: var(--yjs-text-strong) !important;
	text-decoration: none;
	transition: color 0.18s ease;
}

.yjs-link-title:hover,
.yjs-link-title:focus {
	color: var(--yjs-brand) !important;
	background-color: transparent;
	text-decoration: none;
}

/* PC 接项目列表：点击标题后浏览器会保留 focus，不能让标题长期残留绿色。 */
.yjs-job-list-page .consultant_title>a.yjs-link-title:focus:not(:hover) {
	color: var(--yjs-text-strong) !important;
	background-color: transparent;
	text-decoration: none;
}

/* -- 次级灰色文字链：小字灰色附属信息，hover 品牌绿 + 下划线 --
   使用示例：<a class="yjs-link-muted">需求 20</a>
   适用场景：卡片内附属统计链接（需求数、下单数、返回列表等） */
.yjs-link-muted,
.yjs-link-muted:link,
.yjs-link-muted:visited {
	color: var(--yjs-text-muted);
	text-decoration: none;
	transition: color 0.18s ease;
}

.yjs-link-muted:hover,
.yjs-link-muted:focus {
	color: var(--yjs-brand) !important;
	background-color: transparent;
	text-decoration: underline;
}

/* ===========================================================================
   /plist 案例列表页 · P0 骨架现代化（作用域 .yjs-plist-page 严格本地化）
   =========================================================================== */

/* 老 margin 收敛：面包屑上方多余空白压掉（已挂 yjs-global-crumb 走全局） */
.yjs-plist-page {
	padding-top: 8px;
}

/* 中间"找不到合适案例？"弱兜底条（透明底 + 上下极浅分隔线，避免夹在两块白卡之间形成灰色割裂条带） */
.yjs-plist-page .yjs-plist-cs-hint {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 16px;
	margin: 8px 0 12px;
	background: transparent;
	border: none;
	border-radius: 0;
	font-size: 13px;
	color: var(--yjs-text-muted);
	line-height: 1.5;
}

.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-text {
	color: var(--yjs-text-muted);
}

.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-cta,
.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-cta:link,
.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-cta:visited {
	color: var(--yjs-brand);
	text-decoration: none;
	font-weight: 500;
	background-color: transparent;
}

.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-cta:hover,
.yjs-plist-page .yjs-plist-cs-hint .yjs-hint-cta:focus {
	color: var(--yjs-brand-active);
	text-decoration: underline;
	background-color: transparent;
}

/* 案例卡 V2 化 */
.yjs-plist-page .yjs-plist-card {
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	padding: 20px 24px;
	margin-bottom: 16px;
}

.yjs-plist-page .yjs-plist-card-title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
}

.yjs-plist-page .yjs-plist-card-title .yjs-link-title {
	color: var(--yjs-text-strong);
}

.yjs-plist-page .yjs-plist-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 6px;
	margin-bottom: 10px;
	font-size: 13px;
	color: var(--yjs-text-muted);
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-tag,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-tag:link,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-tag:visited {
	color: var(--yjs-brand);
	text-decoration: none;
	background-color: transparent;
	padding: 2px 8px;
	background: var(--yjs-brand-bg);
	border-radius: 4px;
	font-size: 12px;
	line-height: 1.4;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-tag:hover,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-tag:focus {
	background: #e0f0e6;
	color: var(--yjs-brand-active);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-meta-sep {
	color: #cdd3dc;
	padding: 0 2px;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:link,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:visited {
	color: var(--yjs-text-body);
	text-decoration: none;
	background-color: transparent;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 4px;
	border-radius: 4px;
	transition: color 0.15s ease, background-color 0.15s ease;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author .yjs-plist-author-icon {
	color: var(--yjs-text-muted);
	flex-shrink: 0;
	transition: color 0.15s ease;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:hover,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:focus {
	color: var(--yjs-brand-link-rest);
	text-decoration: none;
	background-color: transparent;
}

.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:hover .yjs-plist-author-icon,
.yjs-plist-page .yjs-plist-card-meta .yjs-plist-author:focus .yjs-plist-author-icon {
	color: var(--yjs-brand-link-rest);
}

.yjs-plist-page .yjs-plist-card-desc {
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.7;
	color: var(--yjs-text-body);
}

.yjs-plist-page .yjs-plist-card-pics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: 16px;
}

.yjs-plist-page .yjs-plist-pic-item,
.yjs-plist-page a.yjs-plist-pic-item:link,
.yjs-plist-page a.yjs-plist-pic-item:visited {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 6px;
	background: #f5f7fa;
	aspect-ratio: 4 / 3;
	cursor: pointer;
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-pic-item::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgba(255, 255, 255, 0);
	pointer-events: none;
	transition: background-color 0.2s ease;
}

.yjs-plist-page a.yjs-plist-pic-item:hover::after,
.yjs-plist-page a.yjs-plist-pic-item:focus::after {
	background-color: rgba(255, 255, 255, 0.08);
}

.yjs-plist-page .yjs-plist-pic-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.yjs-plist-page .yjs-plist-card-footer {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 10px;
	padding-top: 12px;
	border-top: 1px solid #f0f2f5;
}

.yjs-plist-page .yjs-plist-btn-secondary,
.yjs-plist-page .yjs-plist-btn-secondary:link,
.yjs-plist-page .yjs-plist-btn-secondary:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	padding: 0 16px;
	background: #fff;
	color: var(--yjs-text-body);
	border: 1px solid #e0e6ed;
	border-radius: 6px;
	font-size: 13px;
	text-decoration: none;
	transition: all 0.18s ease;
	background-color: #fff;
}

.yjs-plist-page .yjs-plist-btn-secondary:hover,
.yjs-plist-page .yjs-plist-btn-secondary:focus {
	color: var(--yjs-brand);
	border-color: var(--yjs-brand);
	background: var(--yjs-brand-bg);
	background-color: var(--yjs-brand-bg);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-btn-primary,
.yjs-plist-page .yjs-plist-btn-primary:link,
.yjs-plist-page .yjs-plist-btn-primary:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	padding: 0 18px;
	background: var(--yjs-brand);
	background-color: var(--yjs-brand);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	box-shadow: 0 4px 10px rgba(39, 174, 96, 0.2);
	transition: all 0.18s ease;
}

.yjs-plist-page .yjs-plist-btn-primary:hover,
.yjs-plist-page .yjs-plist-btn-primary:focus {
	color: #fff;
	background: var(--yjs-brand);
	background-color: var(--yjs-brand);
	filter: brightness(1.06);
	box-shadow: var(--yjs-shadow-btn-hover);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-btn-primary:active {
	background: var(--yjs-brand-active);
	background-color: var(--yjs-brand-active);
	filter: brightness(0.95);
	color: #fff;
}

/* ===========================================================================
   /plist P1 · 筛选卡 + 分页 V2 化
   =========================================================================== */

/* 筛选卡容器 */
.yjs-plist-page .yjs-plist-filter-card {
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	padding: 16px 20px;
	margin-bottom: 16px;
}

.yjs-plist-page .yjs-plist-filter-block {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px dashed #f0f2f5;
}

.yjs-plist-page .yjs-plist-filter-block:last-of-type {
	border-bottom: none;
}

.yjs-plist-page .yjs-plist-filter-sub {
	background: #fafbfc;
	margin: 4px -12px;
	padding: 8px 12px;
	border-radius: 6px;
	border-bottom: none;
}

.yjs-plist-page .yjs-plist-filter-label {
	flex: 0 0 72px;
	padding-top: 6px;
	font-size: 13px;
	color: var(--yjs-text-muted);
	line-height: 1.4;
}

.yjs-plist-page .yjs-plist-filter-items {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 4px;
	align-items: center;
}

/* 筛选胶囊 */
.yjs-plist-page .yjs-plist-filter-items>a,
.yjs-plist-page .yjs-plist-filter-items>a:link,
.yjs-plist-page .yjs-plist-filter-items>a:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 28px;
	padding: 0 12px;
	border-radius: 14px;
	font-size: 13px;
	color: var(--yjs-text-body);
	text-decoration: none;
	background: transparent;
	background-color: transparent;
	line-height: 1;
	transition: all 0.18s ease;
}

.yjs-plist-page .yjs-plist-filter-items>a:hover,
.yjs-plist-page .yjs-plist-filter-items>a:focus {
	color: var(--yjs-brand);
	background: var(--yjs-brand-bg);
	background-color: var(--yjs-brand-bg);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-filter-items>a.active,
.yjs-plist-page .yjs-plist-filter-items>a.active:link,
.yjs-plist-page .yjs-plist-filter-items>a.active:visited,
.yjs-plist-page .yjs-plist-filter-items>a.active:hover,
.yjs-plist-page .yjs-plist-filter-items>a.active:focus {
	background: var(--yjs-brand);
	background-color: var(--yjs-brand);
	color: #fff;
	box-shadow: 0 2px 6px rgba(39, 174, 96, 0.25);
	text-decoration: none;
}

/* 关键词搜索行 */
.yjs-plist-page .yjs-plist-search-form {
	margin: 0;
	padding: 4px 0 0;
}

.yjs-plist-page .yjs-plist-search-row {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* 搜索行的"关键词"label 单独重置：不需要多行 wrap 的顶部对齐 padding */
.yjs-plist-page .yjs-plist-search-row .yjs-plist-filter-label {
	padding-top: 0;
}

.yjs-plist-page .yjs-plist-search-input {
	flex: 1;
	min-width: 0;
}

.yjs-plist-page .yjs-plist-search-input .input-group {
	width: 100%;
	margin: 0;
	padding: 0;
	line-height: 1;
}

.yjs-plist-page .yjs-plist-search-input .input_search_text {
	width: 100%;
	height: 36px;
	line-height: 36px;
	padding: 0 12px;
	border: 1px solid #e0e6ed;
	border-radius: 6px;
	font-size: 13px;
	color: var(--yjs-text-body);
	background: #fff;
	box-shadow: none;
	margin: 0;
	vertical-align: middle;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
	box-sizing: border-box;
}

.yjs-plist-page .yjs-plist-search-input .input_search_text:focus {
	border-color: var(--yjs-brand);
	box-shadow: 0 0 0 3px rgba(39, 174, 96, 0.12);
	outline: none;
}

.yjs-plist-page .yjs-plist-search-btn {
	flex: 0 0 auto;
	height: 36px;
	padding: 0 20px;
	background: var(--yjs-brand);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	box-shadow: 0 3px 8px rgba(39, 174, 96, 0.2);
	transition: all 0.18s ease;
}

.yjs-plist-page .yjs-plist-search-btn:hover,
.yjs-plist-page .yjs-plist-search-btn:focus {
	filter: brightness(1.06);
	box-shadow: var(--yjs-shadow-btn-hover);
}

.yjs-plist-page .yjs-plist-search-btn:active {
	background: var(--yjs-brand-active);
	filter: brightness(0.95);
}

.yjs-plist-page .yjs-plist-search-tip,
.yjs-plist-page .yjs-plist-search-tip:link,
.yjs-plist-page .yjs-plist-search-tip:visited {
	flex: 0 0 auto;
	color: var(--yjs-brand-link-rest);
	font-size: 12px;
	text-decoration: none;
	background-color: transparent;
}

.yjs-plist-page .yjs-plist-search-tip:hover,
.yjs-plist-page .yjs-plist-search-tip:focus {
	color: var(--yjs-brand-active);
	text-decoration: underline;
	background-color: transparent;
}

.yjs-plist-page .yjs-plist-search-desc {
	margin-top: 10px;
	padding: 10px 12px;
	background: #fafbfc;
	border-radius: 6px;
	font-size: 12px;
	color: var(--yjs-text-muted);
	line-height: 1.7;
}

.yjs-plist-page .yjs-plist-search-desc b {
	color: var(--yjs-brand);
	font-weight: 500;
}

/* 分页 V2 化（作用域覆盖 include page 的老类） */
.yjs-plist-page .yjs-plist-pager-wrap {
	margin: 20px 0 8px;
	text-align: center;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination,
.yjs-plist-page .yjs-plist-pager-wrap ul.pagination {
	display: inline-flex;
	gap: 6px;
	padding: 0;
	margin: 0;
	list-style: none;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	border: none;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination>li {
	display: inline-block;
	margin: 0;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>a,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>span,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>a:link,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>a:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 10px;
	border: none;
	border-radius: 6px;
	background: transparent;
	background-color: transparent;
	color: var(--yjs-text-body);
	font-size: 13px;
	line-height: 1;
	text-decoration: none;
	transition: all 0.18s ease;
	box-shadow: none;
	float: none;
	margin: 0;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>a:hover,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li>a:focus {
	background: var(--yjs-brand-bg);
	background-color: var(--yjs-brand-bg);
	color: var(--yjs-brand);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>a,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>span,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>a:link,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>a:visited,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>a:hover,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.active>a:focus {
	background: var(--yjs-brand);
	background-color: var(--yjs-brand);
	color: #fff;
	box-shadow: 0 2px 6px rgba(39, 174, 96, 0.25);
	text-decoration: none;
}

.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.disabled>a,
.yjs-plist-page .yjs-plist-pager-wrap .pagination>li.disabled>span {
	background: transparent;
	color: #c0c4cc;
	cursor: not-allowed;
}

/* 隐藏冗余 weui 分页 */
.yjs-plist-page .button_sp_area.display_none {
	display: none !important;
}

/* ==========================================================================
   全站悬浮客服气泡（employer_float_ball 公共组件配套样式）
   ========================================================================== */
.float_cs_bubble {
	position: absolute;
	right: 100%;
	bottom: 0;
	margin-right: 16px;
	display: none;
	align-items: center;
	gap: 8px;
	height: 48px;
	padding: 0 14px 0 18px;
	background: #FFFFFF;
	color: #2C3E50;
	font-size: 13px;
	line-height: 1.4;
	border: 1px solid #E6E9EE;
	border-radius: 24px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	white-space: nowrap;
	cursor: pointer;
	z-index: 10;
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s;
}

.service_box:hover .float_cs_bubble.is_show {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
}

.float_cs_bubble.is_show {
	display: inline-flex;
	animation: floatCsIn 0.25s ease-out both;
}

.float_cs_bubble::after {
	content: "";
	position: absolute;
	right: -5px;
	top: 50%;
	margin-top: -5px;
	transform: rotate(45deg);
	width: 10px;
	height: 10px;
	background: #FFFFFF;
	border-right: 1px solid #E6E9EE;
	border-top: 1px solid #E6E9EE;
}

.float_cs_bubble .float_cs_bubble_text em {
	color: var(--yjs-brand);
	font-style: normal;
	font-weight: 600;
}

.float_cs_bubble.is_hidden {
	display: none !important;
}

.float_cs_bubble .float_cs_bubble_divider {
	display: inline-block;
	width: 1px;
	height: 14px;
	margin-left: 10px;
	background: #EEF0F3;
}

.float_cs_bubble .float_cs_bubble_close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin-left: 6px;
	border-radius: 50%;
	color: #B0B6BE;
	font-size: 12px;
	line-height: 1;
	background: transparent;
	cursor: pointer;
	transition: color 0.15s, background 0.15s;
}

.float_cs_bubble .float_cs_bubble_close:hover {
	color: #7A8290;
	background: #EEF0F3;
}

@keyframes floatCsIn {
	from {
		opacity: 0;
		transform: translateX(8px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}