/**
 * 词安卫士 · 词库大全页样式（06 §3.2 + §十 视觉体系）
 * BEM wc-wb- 前缀；色值/字号/圆角一律引用 wc-tokens.css 变量，禁止写死
 */

/* ---------- 页头（复用 wc-sec-head 区头） ---------- */
.wc-wb-head {
  padding: var(--wc-sp-8) 0 var(--wc-sp-6);
  background: linear-gradient(180deg, var(--wc-tint) 0%, #ffffff 100%);
}

.wc-wb-main { padding-bottom: var(--wc-sp-8); }

/* ---------- 工具行：类目 Tab + 搜索 ---------- */
.wc-wb-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wc-sp-4);
  flex-wrap: wrap;
  margin-bottom: var(--wc-sp-4);
}

.wc-wb-tabs {
  display: flex;
  flex-wrap: wrap; /* 9 个类目中档宽度一行放不下：整项换行而非逐字折行（FINDING-003） */
  gap: var(--wc-sp-1);
  list-style: none;
  margin: 0;
  padding: 0;
}

.wc-wb-tabs__link {
  position: relative;
  display: block;
  padding: 10px 18px;
  border-radius: var(--wc-radius-md);
  color: var(--wc-text-2);
  font-size: var(--wc-fs-15);
  text-decoration: none;
  white-space: nowrap; /* 标签文字永不逐字折行，放不下由容器整项换行 */
  transition: color .15s ease, background-color .15s ease;
}
.wc-wb-tabs__link:hover { color: var(--wc-text-hi); text-decoration: none; }
.wc-wb-tabs__link--active { color: var(--wc-primary); font-weight: 600; background: var(--wc-primary-soft); }

/* 行业词包会员标识：tab 文字后内联小角标（2026-10-29 走查：原绝对定位右上角在 tab 折行后
   脱离锚点，改 static 内联随文字走；字号 10px→12px 达辅助文字下限）。
   2026-10-31 走查 FINDING-013：实底墨青角标 ×5 同屏超「一屏一块墨」配额，改细描边弱化为属性标识 */
.wc-wb-tabs__vip {
  position: static;
  display: inline-block;
  margin-left: 6px;
  vertical-align: 2px;
  font-size: var(--wc-fs-12);
  line-height: 1;
  padding: 2px 5px;
  border-radius: var(--wc-radius-tag);
  border: 1px solid var(--wc-primary);
  background: transparent;
  color: var(--wc-primary);
  font-weight: 600;
  letter-spacing: .5px;
}

/* ---------- 大搜索（朱批·安印 Mockup B 2026-10-29：搜索即主角，56px） ---------- */
.wc-wb-hero { display: flex; gap: var(--wc-sp-2); margin-bottom: var(--wc-sp-4); }
.wc-wb-hero__input {
  flex: 1;
  height: 56px;
  padding: 0 var(--wc-sp-5);
  border: 1px solid var(--wc-border);
  border-radius: var(--wc-radius-lg);
  background: #fff;
  font-size: 16px; /* ≥16px 防 iOS 聚焦缩放 */
  color: var(--wc-text-hi);
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wc-wb-hero__input::placeholder { color: var(--wc-text-3); }
.wc-wb-hero__input:focus { border-color: var(--wc-primary); box-shadow: var(--wc-focus-ring); }
.wc-wb-hero__btn { height: 56px; padding: 0 28px; font-size: var(--wc-fs-15); }

/* ---------- 比例条（Mockup B：通用/食品/美妆真实词数，flex=计数） ---------- */
.wc-wb-ratio { margin: 0 0 var(--wc-sp-5); }
.wc-wb-ratio__bar {
  display: flex;
  height: 8px;
  border-radius: var(--wc-radius-pill);
  overflow: hidden;
  background: var(--wc-tint);
}
.wc-wb-ratio__seg--general { background: var(--wc-primary); }
.wc-wb-ratio__seg--food { background: var(--wc-ink-600); }
.wc-wb-ratio__seg--mz { background: var(--wc-primary-soft-2); }
.wc-wb-ratio__leg {
  display: flex;
  gap: var(--wc-sp-5);
  margin-top: var(--wc-sp-2);
  font-size: var(--wc-fs-13);
}
.wc-wb-ratio__leg a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--wc-text-2);
  text-decoration: none;
}
.wc-wb-ratio__leg a:hover { color: var(--wc-text-hi); text-decoration: none; }
.wc-wb-ratio__leg b { font-family: var(--wc-font-mono); font-weight: 600; color: var(--wc-text-1); }
.wc-wb-ratio__dot { width: 8px; height: 8px; border-radius: 2px; font-style: normal; }
.wc-wb-ratio__dot--general { background: var(--wc-primary); }
.wc-wb-ratio__dot--food { background: var(--wc-ink-600); }
.wc-wb-ratio__dot--mz { background: var(--wc-primary-soft-2); }
@media (max-width: 767px) {
  .wc-wb-hero__btn { padding: 0 var(--wc-sp-4); }
  /* 触控目标 ≥44px（第 5 步 H5 红线；桌面档维持视觉密度不变）（FINDING-004） */
  .wc-wb-ratio__leg { gap: var(--wc-sp-4); flex-wrap: wrap; }
  .wc-wb-ratio__leg a { min-height: 44px; }
}

/* ---------- 词表格（bootstrap-table 皮肤，全部 wc- 覆盖） ---------- */
.wc-wb-main .fixed-table-container {
  border: none;
  border-radius: var(--wc-radius-lg);
  box-shadow: var(--wc-shadow-sm);
  background: #fff;
}

.wc-wb-table { border: none; margin-bottom: 0; }

.wc-wb-table thead th {
  background: #fff;
  border-bottom: 1px solid var(--wc-border);
  color: var(--wc-text-2);
  font-size: var(--wc-fs-13);
  font-weight: 500;
}

.wc-wb-table tbody td {
  vertical-align: middle;
  border-bottom: 1px solid var(--wc-line-soft);
  color: var(--wc-text-1);
}

.wc-wb-table tbody tr:hover td { background: var(--wc-tint); }

.wc-wb-table__word { font-weight: 600; color: var(--wc-text-hi); font-size: var(--wc-fs-15); }
.wc-wb-table__none { color: var(--wc-text-3); }

/* 小号按钮（操作列） */
.wc-btn--sm {
  height: 30px;
  line-height: 28px;
  padding: 0 12px;
  font-size: var(--wc-fs-13);
  border-radius: var(--wc-radius-md);
  min-width: 0;
  margin-left: 0;
}

/* 词源标签底色补全（法规/平台/案例；与检测页 wc-source-tag 同族，第三轮 3a 旧蓝 rgba 已收敛） */
.wc-source-tag--law { background: var(--wc-primary-soft); color: var(--wc-primary); }
.wc-source-tag--platform { background: rgba(105, 65, 198, .08); color: var(--wc-purple); } /* tint 由 --wc-purple (#6941C6) 同源派生（2026-10-29 走查） */
.wc-source-tag--case { background: rgba(23, 23, 28, .06); color: var(--wc-text-2); }

/* ---------- 分页条（bootstrap-table 覆盖） ---------- */
.wc-wb-main .fixed-table-pagination { padding: var(--wc-sp-4) 0 0; }
.wc-wb-main .fixed-table-pagination .pagination { margin: 0; }
.wc-wb-main .fixed-table-pagination .pagination > li > a {
  border: none;
  color: var(--wc-text-2);
  font-size: var(--wc-fs-14);
  padding: 6px 12px;
  border-radius: var(--wc-radius-md);
  margin: 0 2px;
}
.wc-wb-main .fixed-table-pagination .pagination > li > a:hover { color: var(--wc-primary); background: var(--wc-primary-soft); }
.wc-wb-main .fixed-table-pagination .pagination > li.active > a { background: var(--wc-primary); color: #fff; }
.wc-wb-main .fixed-table-pagination .pagination-info,
.wc-wb-main .fixed-table-pagination .page-list { color: var(--wc-text-3); font-size: var(--wc-fs-13); }
/* 分页信息里的总数：mono + 千分位（formatShowingRecords 输出，DESIGN.md 数据口径） */
.wc-wb-main .wc-wb-num { font-family: var(--wc-font-mono); color: var(--wc-text-2); }

/* ---------- 空态（06 §3.2：暂未收录 + 跳检测） ---------- */
.wc-wb-empty { padding: 48px 0 40px; text-align: center; color: var(--wc-text-2); }
.wc-wb-empty i { font-size: 22px; color: var(--wc-text-3); }
.wc-wb-empty p { margin: var(--wc-sp-2) 0 var(--wc-sp-4); }

/* ---------- 词详情弹层（layer type:1 页内层） ---------- */
.wc-wb-detail { padding: var(--wc-sp-6); overflow-wrap: anywhere; } /* 弹层内长词/长 URL 统一断行兜底，杜绝横向滚动 */

.wc-wb-detail__word {
  display: flex;
  align-items: center;
  gap: var(--wc-sp-2);
  margin: 0 0 var(--wc-sp-3);
  font-family: var(--wc-font-display);
  font-size: var(--wc-fs-24);
  font-weight: 700;
  color: var(--wc-text-hi);
}

.wc-wb-detail__suggestion {
  margin: 0 0 var(--wc-sp-4);
  padding: var(--wc-sp-3) var(--wc-sp-4);
  background: var(--wc-primary-soft);
  border-radius: var(--wc-radius-md);
  color: var(--wc-text-1);
  font-size: var(--wc-fs-14);
}

.wc-wb-detail__sources { margin: 0 0 var(--wc-sp-4); }
.wc-wb-detail__sources dt { color: var(--wc-text-3); font-size: var(--wc-fs-13); margin-bottom: var(--wc-sp-2); }
.wc-wb-detail__sources dd {
  display: flex;
  align-items: flex-start; /* ref 换行成多行时徽章顶对齐，不再垂直悬中 */
  gap: var(--wc-sp-2);
  flex-wrap: wrap;
  margin: 0 0 var(--wc-sp-2);
  color: var(--wc-text-1);
  font-size: var(--wc-fs-14);
}
.wc-wb-detail__nosource { color: var(--wc-text-3); font-size: var(--wc-fs-14); }
/* 词源出处是法规引文：宋体（DESIGN.md 排版角色，FINDING-006；详情页同规则在 wc-news.css） */
/* 出处常含药监局公告长 URL（无空格连续 ASCII 不可自然断行）：
   ref 在 flex 里需 min-width:0 可收缩 + overflow-wrap:anywhere 断 URL，否则撑破弹层出横向滚动条（2026-11-01 修复） */
.wc-wb-detail__ref { font-family: var(--wc-font-serif); min-width: 0; overflow-wrap: anywhere; }

.wc-wb-detail__detect {
  display: block;
  padding: var(--wc-sp-3);
  border-top: 1px dashed var(--wc-border);
  color: var(--wc-text-2);
  font-size: var(--wc-fs-14);
  text-align: center;
  text-decoration: none;
}
.wc-wb-detail__detect strong { color: var(--wc-primary); }
.wc-wb-detail__detect:hover { color: var(--wc-text-hi); text-decoration: none; }

/* ---------- 响应式（§十：<768px 单列可用） ---------- */
@media (max-width: 767px) {
  /* 词表窄屏保可读：容器横滚 + 表格最小可读宽（第 5 步 H5：不压缩列致换行挤压） */
  .wc-wb-main .fixed-table-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .wc-wb-main .wc-wb-table { min-width: 640px; }
  /* 加载遮罩与表格共用 classes 会被 min-width 命中：遮罩在 .fixed-table-body 外，
     640px 直接撑破视口 → 整页横溢 281px（2026-10-31 走查 FINDING-001），此处收回 */
  .wc-wb-main .fixed-table-loading { min-width: 0; max-width: 100%; }
  /* 类目 tab 触控 ≥44px */
  .wc-wb-tabs__link { min-height: 44px; display: inline-flex; align-items: center; }
  /* 触控目标 ≥44px（FINDING-004）：须写在本文件尾部才能压过上方同特异性的
     .wc-btn--sm 基础 30px 与分页 6px 纵向内边距（前者曾放文件中部被后写规则覆盖） */
  .wc-btn--sm { height: 44px; line-height: 42px; padding: 0 14px; }
  .wc-wb-main .fixed-table-pagination .pagination > li > a { padding: 12px 14px; }
}
@media (max-width: 575.98px) {
  .wc-wb-head { padding: var(--wc-sp-6) 0 var(--wc-sp-4); }
  .wc-wb-toolbar { flex-direction: column; align-items: stretch; }
  .wc-wb-detail { padding: var(--wc-sp-4); }
}
