/* ============================================================
 * 产品校验双引擎工作台（modules/product-validation.js）
 * 2026-10-20 老板：参考 dt-order-flow（对接仓库订货流程）成熟版式整体美化——
 *   hero 只留 icon+标题+副标题（右侧控件下移到工具条）、
 *   hero 下方独立工具条（主操作实心按钮 + 平台 + 统计 + 右侧提示）、
 *   内容分「① 上传源表 / ② 校验结果」两个浅色分区面板、
 *   上传卡按线（参谋/达摩盘/流量校验）着左边条 + 线徽标、
 *   结果表包 overflow-x、内置 760/480 手机断点（全站同口径）。
 * 全部 .pv-* 作用域，不污染其他页面。根贴边全屏（不设 max-width）。
 * ============================================================ */
.pv-root { width: 100%; max-width: 100%; margin: 0; padding: 0; color: #1f2937; box-sizing: border-box; }
.pv-root * { box-sizing: border-box; }

/* ── 工具条（hero 下方，参考 dt-order-flow Toolbar 范式）── */
.pv-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; }
.pv-btn-primary { padding: 8px 18px; background: #4f46e5; color: #fff; border: 0; border-radius: 9px; cursor: pointer; font-size: 13px; font-weight: 600; white-space: nowrap; box-shadow: 0 1px 2px rgba(79, 70, 229, .25); }
.pv-btn-primary:hover { background: #4338ca; }
.pv-platform { padding: 7px 10px; border: 1px solid #c7d2fe; border-radius: 9px; background: #fff; font-size: 13px; color: #374151; }
.pv-stat { font-size: 13px; color: #4b5563; }
.pv-stat b { color: #4f46e5; }
.pv-spacer { flex: 1; }
.pv-hint { font-size: 12px; color: #9ca3af; }

.pv-msg { min-height: 20px; font-size: 13px; color: #374151; margin: 0 0 8px; }

/* ── 分区面板（① 上传 / ② 结果）── */
.pv-section { background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; padding: 16px 18px; margin: 0 0 16px; box-shadow: 0 1px 3px rgba(16, 24, 40, .05); }
.pv-section-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid #f1f2f4; }
.pv-section-title { font-size: 15px; font-weight: 700; color: #111827; }
.pv-section-sub { font-size: 12px; color: #9ca3af; }

/* ── 上传卡：按线着左边条 + 线徽标 ── */
.pv-line-cm { --pv-accent: #4f46e5; --pv-accent-bg: #eef2ff; }
.pv-line-dmp { --pv-accent: #0d9488; --pv-accent-bg: #f0fdfa; }
.pv-line-check { --pv-accent: #d97706; --pv-accent-bg: #fffbeb; }
.pv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.pv-card { border: 1px solid #e5e7eb; border-left: 4px solid var(--pv-accent, #4f46e5); border-radius: 12px; padding: 14px 16px; background: #fbfcfe; }
.pv-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.pv-card-line { color: var(--pv-accent, #4f46e5); background: var(--pv-accent-bg, #eef2ff); padding: 2px 9px; border-radius: 10px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.pv-card-name { font-weight: 700; font-size: 14px; color: #111827; }
.pv-card-hint { color: #6b7280; font-size: 12px; margin: 0 0 12px; min-height: 17px; line-height: 1.5; }
.pv-file-row { display: flex; align-items: center; gap: 8px; }
.pv-file-input { display: none; } /* 隐藏原生控件，label 代替按钮 */
.pv-file-btn { padding: 6px 12px; border: 1px dashed var(--pv-accent, #a5b4fc); border-radius: 8px; font-size: 12px; color: var(--pv-accent, #4f46e5); background: var(--pv-accent-bg, #f5f7ff); cursor: pointer; white-space: nowrap; }
.pv-file-btn:hover { filter: brightness(.97); }
.pv-file-name { flex: 1; min-width: 0; font-size: 12px; color: #374151; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-btn-up { padding: 6px 16px; background: #16a34a; color: #fff; border: 0; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 600; white-space: nowrap; }
.pv-btn-up:hover { background: #15803d; }
.pv-card-foot { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #e5e7eb; display: flex; align-items: center; gap: 10px; font-size: 12px; }
.pv-rows { color: #374151; }
.pv-rows.pv-has-data { color: #16a34a; font-weight: 600; }
.pv-btn-clear { padding: 3px 10px; background: #fff; color: #dc2626; border: 1px solid #fca5a5; border-radius: 6px; cursor: pointer; font-size: 12px; }

/* ── 结果区 ── */
.pv-sec-title { font-size: 15px; font-weight: 700; margin: 0 0 8px; }
.pv-kw-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 12px; }
.pv-kw-input { padding: 6px 10px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13px; min-width: 200px; }
.pv-table-wrap { overflow-x: auto; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; }
.pv-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 640px; }
.pv-table th { padding: 9px 12px; background: #f5f6fa; text-align: left; border-bottom: 2px solid #e5e7eb; white-space: nowrap; color: #374151; }
.pv-table td { padding: 9px 12px; border-bottom: 1px solid #f1f2f4; vertical-align: top; }
.pv-table tbody tr:last-child td { border-bottom: 0; }
.pv-table tbody tr:hover td { background: #fafbff; }
/* 分页后的行序号（与全站表格页一致：跨页累加、窄列、弱色） */
.pv-table td.pv-seq { width: 44px; color: #9ca3af; font-size: 12px; font-variant-numeric: tabular-nums; }
.pv-empty { color: #9ca3af; font-size: 13px; padding: 28px 0; text-align: center; }
.pv-empty-icon { font-size: 34px; display: block; margin-bottom: 8px; opacity: .5; }

/* ──  校验对象（选品记录拍板=已选，一行一品 + 行内上传 + 结论）── */
.pv-targets-wrap { min-height: 34px; }
/* 2026-10-20 老板图一拍板 #2：校验对象表全部居中对齐（表头+单元格），覆盖 .pv-table th 的左对齐；
   名称/无ID 两格是 inline-flex 列，用 align-items 居中而非 text-align */
.pv-target-table th, .pv-target-table td { text-align: center; }
.pv-target-table td { vertical-align: middle; }
.pv-target-table .pv-t-namebtn, .pv-target-table .pv-t-noid { align-items: center; }
.pv-target-table td.pv-seq { text-align: center; }
.pv-target-table td.pv-cw-cell input { max-width: 160px; text-align: center; }
/* 列组缩略隐藏（2026-10-28 老板拍板）：筛选条「🙈 达摩盘隐藏 / 🙈 流量解析隐藏」钮给表加类，
   纯 CSS 整列隐藏，只裁显示不动数据与结论。列序（24 列）：达摩盘组 9 列=第 8~16 列
   （IPV/搜索占比/成交笔数/支付转化率/加购率/付费占比 + 性别/年龄/消费力——2026-10-28 老板
   拍板：人群三列数据源是达摩盘客群画像，归属达摩盘版块，随达摩盘隐藏联动），
   流量解析（趋势） 6 列=第 17~22 列（展现指数/点击指数/点击率/点击转化率/竞争指数/市场均价）。
   列序变了要同步改这里的 nth-child。 */
.pv-target-table.pv-hide-dmp th:nth-child(n+8):nth-child(-n+16),
.pv-target-table.pv-hide-dmp td:nth-child(n+8):nth-child(-n+16),
.pv-target-table.pv-hide-trend th:nth-child(n+17):nth-child(-n+22),
.pv-target-table.pv-hide-trend td:nth-child(n+17):nth-child(-n+22) { display: none; }
/* 筛选条（2026-10-20 老板拍板 #3：仿选品记录 .gbf-bar 芯片族，样式在 growth-boost-styles.css） */
.pv-ft-wrap { margin: 0 0 10px; }
.pv-target-table tbody tr.active td { background: #eef2ff; }
.pv-target-table tbody tr.active td:first-child { box-shadow: inset 3px 0 0 #4f46e5; }
.pv-t-namebtn { cursor: pointer; display: inline-flex; flex-direction: column; gap: 2px; }
.pv-t-namebtn:hover .pv-t-name { color: #4f46e5; text-decoration: underline; }
.pv-t-noid { display: inline-flex; flex-direction: column; gap: 2px; color: #9ca3af; }
.pv-t-name { font-weight: 600; font-size: 13px; color: #111827; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-t-id { color: #9ca3af; font-size: 11px; font-variant-numeric: tabular-nums; }
/* 类目名称是全路径长串（如「饰品/流行首饰>时尚饰品…」），截断显示 + 悬停 title 看全，避免撑高行（与选品池同观感） */
.pv-t-cat { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #4b5563; }
.pv-t-lv { display: inline-block; margin-left: 8px; vertical-align: middle; }
.pv-up-cell { white-space: nowrap; }
.pv-up-cell .pv-up-btn { margin: 2px 6px 2px 0; }
.pv-up-btn { padding: 5px 12px; border: 0; border-radius: 8px; cursor: pointer; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; }
.pv-up-btn:hover { filter: brightness(.94); }
.pv-up-cm { background: #4f46e5; }    /* 生意参谋线色，与上传卡左边条同口径 */
.pv-up-dmp { background: #0d9488; }   /* 达摩盘线色 */
/* ── 应用内上传弹窗（行内按钮 → .ecx-modal 弹窗：拖拽/选文件 + 清单 + 确认）── */
.pv-up-sub { font-size: 13px; color: #3730a3; margin: 2px 0 4px; }
.pv-up-sub b { font-weight: 700; }
.pv-up-pid { color: #9ca3af; font-size: 11px; font-variant-numeric: tabular-nums; }
.pv-up-hint { font-size: 12px; color: #6b7280; margin: 0 0 10px; line-height: 1.5; }
.pv-up-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 12px; border: 1px dashed #c7d2fe; border-radius: 10px; background: #f8f9ff; transition: border-color .15s, background .15s; }
.pv-up-drop.on { border-color: #4f46e5; background: #eef2ff; }
.pv-up-drop-txt { font-size: 12px; color: #9ca3af; }
.pv-up-files { list-style: none; margin: 10px 0 0; padding: 0; max-height: 220px; overflow-y: auto; }
.pv-up-file { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid #eef0f3; border-radius: 8px; margin-bottom: 6px; font-size: 12px; }
.pv-up-file-ic { flex: none; }
.pv-up-file-nm { flex: 1; min-width: 0; color: #374151; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-up-file-sz { flex: none; color: #9ca3af; font-variant-numeric: tabular-nums; }
.pv-up-file-x { flex: none; border: 0; background: transparent; color: #dc2626; cursor: pointer; font-size: 16px; line-height: 1; padding: 0 4px; }
.pv-up-file-x:hover { filter: brightness(.85); }
.pv-up-empty { font-size: 12px; color: #9ca3af; text-align: center; padding: 10px 0; }
/* 结论徽章（二元：🟢符合/🔴不符/⚪待校验） */
.pv-verdict { display: inline-block; padding: 2px 10px; border: 1px solid; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.pv-target-tag { font-size: 10px; color: #9ca3af; border: 1px solid #e5e7eb; border-radius: 8px; padding: 1px 6px; white-space: nowrap; }
/* 结果区顶部：当前校验对象（本品）*/
.pv-self-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; padding: 9px 12px; border: 1px solid #c7d2fe; border-radius: 10px; background: #eef2ff; font-size: 13px; color: #3730a3; }
.pv-self-bar b { font-weight: 700; }
.pv-self-link { color: #4f46e5; text-decoration: underline; font-size: 12px; }
/* ── 关键词趋势上传弹窗的判断区（2026-10-20 老板拍板：传完在弹窗内直接出「趋势 vs 核心词」对账）── */
.pv-tr-judge { margin-top: 10px; }
.pv-tr-judge-head { font-size: 13px; font-weight: 700; color: #15803d; margin-bottom: 6px; }
.pv-tr-judge-list { list-style: none; margin: 0; padding: 0; max-height: 260px; overflow-y: auto; font-size: 12px; }
.pv-tr-judge-list li { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; padding: 5px 8px; border: 1px solid #eef0f3; border-radius: 8px; margin-bottom: 6px; color: #374151; }
.pv-tr-judge-list li > span { min-width: 0; word-break: break-all; } /* 窄屏/长词名不横向溢出裁字（2026-10-21 弹窗自适应拍板） */
.pv-tr-ok { color: #16a34a; font-weight: 700; flex: none; }
.pv-tr-bad { color: #dc2626; font-weight: 700; flex: none; }

/* ── 手机适配（全站统一 760/480 口径）── */
@media (max-width: 760px) {
  .pv-grid { grid-template-columns: 1fr; }
  .pv-toolbar { gap: 8px; }
  .pv-spacer { display: none; }
  .pv-hint { flex-basis: 100%; }
  .pv-t-name { max-width: 160px; }
}
@media (max-width: 480px) {
  .pv-file-row { flex-wrap: wrap; }
  .pv-file-name { flex-basis: 100%; order: 3; }
  .pv-section { padding: 12px; }
  .pv-up-cell { white-space: normal; }
  .pv-up-cell .pv-up-btn { margin: 2px 4px 2px 0; }
  .pv-self-bar { gap: 6px; font-size: 12px; }
}