/* ============================================================
 * product_unify.css — ccve365 产品详情页统一排版覆盖层
 * 作用域严格限定 .met-showproduct，避免污染新闻/案例页。
 * 设计目标：面向行业技术人员/采购，专业、清爽、统一。
 * 部署：通过 templates/mui539/head.php 注入（filemtime 版本号）。
 * 回滚：将本文件改名 .off 即 30 秒还原（不影响任何模板源码）。
 * 注：颜色重着色一律 !important，以压过编译 CSS 与富文本内联样式。
 * ============================================================ */

:root {
  --pd-brand: #166875;          /* 唯一品牌主色（原藏蓝 #295283 / 浅绿 #9fe37b / #62e062 均收敛于此） */
  --pd-brand-dark: #10505a;
  --pd-brand-soft: #f7fafb;     /* 主色极浅底 */
  --pd-text: #2a333c;          /* 正文主色 */
  --pd-text-2: #525a63;        /* 次级文字 */
  --pd-text-3: #76838f;        /* 弱化/说明文字 */
  --pd-border: #e4eaec;        /* 分隔线/卡片边框 */
  --pd-bg-soft: #f7fafb;       /* 区块浅底 */
  --pd-radius: 4px;
  --pd-gap: 8px;
  --pd-font: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB",
             "Source Han Sans SC", "Noto Sans CJK SC", "WenQuanYi Micro Hei",
             -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- 0. 全站字体栈统一（仅字体，最低风险） ---------- */
body, button, input, textarea, select {
  font-family: var(--pd-font) !important;
}

/* ============================================================
 * 一、字体污染清除（产品描述富文本）
 * 仅作用于 .tab-pane.met-editor，不波及 FAQ 区块（其在 .tab-pane 之外）
 * ============================================================ */
.met-showproduct .tab-pane.met-editor,
.met-showproduct .tab-pane.met-editor p,
.met-showproduct .tab-pane.met-editor div,
.met-showproduct .tab-pane.met-editor span,
.met-showproduct .tab-pane.met-editor li,
.met-showproduct .tab-pane.met-editor a,
.met-showproduct .tab-pane.met-editor table,
.met-showproduct .tab-pane.met-editor td,
.met-showproduct .tab-pane.met-editor th,
.met-showproduct .tab-pane.met-editor img {
  font-family: var(--pd-font) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: var(--pd-text) !important;
  background-color: transparent !important;
  letter-spacing: normal !important;
  text-align: justify !important;
  text-decoration: none !important;
}
/* 内嵌图统一：清硬编码宽高，自适应 */
.met-showproduct .tab-pane.met-editor img {
  max-width: 100% !important;
  height: auto !important;
  width: auto !important;
  margin: 12px 0 !important;
  border: 1px solid var(--pd-border) !important;
  border-radius: var(--pd-radius) !important;
}
/* 退化 <table> 降级为清爽边框表（排除未来统一规格卡 .pd-spec-table） */
.met-showproduct .tab-pane.met-editor table:not(.pd-spec-table) {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 16px 0 !important;
}
.met-showproduct .tab-pane.met-editor table:not(.pd-spec-table) td,
.met-showproduct .tab-pane.met-editor table:not(.pd-spec-table) th {
  border: 1px solid var(--pd-border) !important;
  padding: 8px 12px !important;
  text-align: left !important;
}

/* ============================================================
 * 二、颜色收敛（藏蓝/浅绿/页脚绿 → 品牌青）
 * ============================================================ */
/* 在线浮窗（全局，DB met_online_color 已改 #166875，这里兜底 hover） */
.consult,
.consult:hover { background-color: var(--pd-brand) !important; }

/* 页脚（全局） */
.foot_info_met_16_2_52.border-top1 { border-color: var(--pd-brand) !important; }
.fNav ul li a:hover span { color: var(--pd-brand) !important; }

/* 产品页 CTA 按钮（咨询/返回） */
.met-showproduct a.linkbtn,
.met-showproduct a.linkbtn:hover,
.met-showproduct .comeback-btn a:hover { background-color: var(--pd-brand) !important; }

/* ============================================================
 * 三、版式与排版
 * ============================================================ */
/* 整体留白与最大宽度，避免内容过宽 */
.met-showproduct .met-showproduct-head { padding-top: 24px; }

/* 型号标题区 */
.met-showproduct .product-intro { padding: 8px 0 20px; border-bottom: 1px solid var(--pd-border); margin-bottom: 20px; }
.met-showproduct .product-intro h1.font-size-24 {
  font-size: 26px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  color: var(--pd-text) !important;
  margin: 0 0 10px !important;
}
.met-showproduct .product-intro p.description {
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: var(--pd-text-3) !important;
  margin: 0 !important;
}

/* 速览参数条（met_plist 渲染的 ul.product-para） */
.met-showproduct ul.product-para { margin: 16px 0 !important; padding: 16px !important; background: var(--pd-bg-soft); border: 1px solid var(--pd-border); border-radius: var(--pd-radius); }
.met-showproduct ul.product-para li { font-size: 14px !important; color: var(--pd-text-2) !important; padding: 4px 0 !important; }
.met-showproduct ul.product-para li span { color: var(--pd-brand) !important; font-weight: 600 !important; margin-right: 4px; }

/* 主图区：统一比例，避免高度跳动 */
.met-showproduct #met-imgs-slick { margin-bottom: 20px; }
.met-showproduct #met-imgs-slick .slick-slide img,
.met-showproduct #met-imgs-slick img {
  width: 100% !important;
  aspect-ratio: 500 / 280 !important;
  object-fit: contain !important;
  background: #fff !important;
  border: 1px solid var(--pd-border) !important;
  border-radius: var(--pd-radius) !important;
}

/* 选项卡导航：留白与激活态对齐品牌色 */
.met-showproduct .met-showproduct-navtabs { border-bottom: 1px solid var(--pd-border) !important; margin-bottom: 20px !important; }
.met-showproduct .met-showproduct-navtabs .nav-link { color: var(--pd-text-2) !important; font-size: 16px !important; }
.met-showproduct .met-showproduct-navtabs .nav-link.active { color: var(--pd-brand) !important; font-weight: 600 !important; }

/* 描述正文区段落间距 */
.met-showproduct .tab-pane.met-editor p { margin: 0 0 14px !important; }
.met-showproduct .tab-pane.met-editor h2,
.met-showproduct .tab-pane.met-editor h3,
.met-showproduct .tab-pane.met-editor h4 {
  font-size: 18px !important;
  line-height: 1.5 !important;
  color: var(--pd-brand) !important;
  border-left: 4px solid var(--pd-brand) !important;
  padding-left: 12px !important;
  margin: 24px 0 12px !important;
  font-weight: 600 !important;
}
.met-showproduct .tab-pane.met-editor ul,
.met-showproduct .tab-pane.met-editor ol { padding-left: 22px !important; margin: 0 0 14px !important; }
.met-showproduct .tab-pane.met-editor li { margin: 4px 0 !important; }

/* ============================================================
 * 四、统一规格卡 .pd-spec-table（由内容清洗脚本写入 content1）
 * ============================================================ */
.met-showproduct table.pd-spec-table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 16px 0 24px !important;
  font-size: 15px !important;
  background: #fff !important;
}
.met-showproduct table.pd-spec-table caption {
  caption-side: top !important;
  text-align: left !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: var(--pd-brand) !important;
  border-left: 4px solid var(--pd-brand) !important;
  padding-left: 12px !important;
  margin-bottom: 12px !important;
}
.met-showproduct table.pd-spec-table td {
  border: 1px solid var(--pd-border) !important;
  padding: 10px 14px !important;
  line-height: 1.7 !important;
}
.met-showproduct table.pd-spec-table td.pd-spec-key {
  width: 32% !important;
  background: var(--pd-bg-soft) !important;
  color: var(--pd-text-2) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

/* ============================================================
 * 五、区块标题（FAQ 等）与页面视觉节奏对齐
 * ============================================================ */
.met-showproduct .seogeo-faq-title {
  font-size: 20px !important;
  line-height: 1.5 !important;
  color: var(--pd-brand) !important;
  border-left: 4px solid var(--pd-brand) !important;
  padding-left: 12px !important;
  margin: 32px 0 16px !important;
  font-weight: 600 !important;
}
.met-showproduct .seogeo-faq-block {
  margin: 8px 0 32px !important;
  padding: 0 !important;
}
.met-showproduct .seogeo-faq-q {
  font-family: var(--pd-font) !important;
  font-size: 15px !important;
  color: var(--pd-text) !important;
}
.met-showproduct .seogeo-faq-a {
  font-family: var(--pd-font) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: var(--pd-text-2) !important;
}

/* ============================================================
 * 六、标签胶囊化 + 相关产品弱化
 * ============================================================ */
.met-showproduct .tag { margin: 16px 0 !important; padding: 12px 0 !important; border-top: 1px solid var(--pd-border) !important; }
.met-showproduct .tag span { color: var(--pd-text-3) !important; font-size: 13px !important; margin-right: 8px !important; }
.met-showproduct .tag a {
  display: inline-block !important;
  margin: 0 8px 8px 0 !important;
  padding: 3px 12px !important;
  font-size: 13px !important;
  color: var(--pd-brand) !important;
  background: var(--pd-brand-soft) !important;
  border: 1px solid var(--pd-border) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
}
.met-showproduct .tag a:hover { background: var(--pd-brand) !important; color: #fff !important; }

/* 相关产品（“为您推荐”）降级为弱对比，突出主内容 */
.met-showproduct .product-hot { margin-top: 24px !important; opacity: 0.92; }
.met-showproduct .product-hot .title-box,
.met-showproduct .product-hot h3 { color: var(--pd-text) !important; font-size: 18px !important; border-left: 4px solid var(--pd-brand) !important; padding-left: 12px !important; }

/* ============================================================
 * 七、响应式：移动端规格表转纵向、速览单列
 * ============================================================ */
@media (max-width: 767px) {
  .met-showproduct .product-intro h1.font-size-24 { font-size: 22px !important; }
  .met-showproduct ul.product-para { padding: 12px !important; }
  .met-showproduct table.pd-spec-table td.pd-spec-key { width: 40% !important; white-space: normal !important; }
}
