/* =============================================================
 * components/detail-info-tables.css
 * 详情页信息表格统一组件
 * 适用：.info-table / .base-info-table / .building-params-table
 * 加载位置：各详情页，必须在 typography-unify.css / theme-overrides.css 之后引入
 * ============================================================= */

/* ---------- 标签列：浅灰、弱化 ----------
 * 用 body ... td.lbl 提升 specificity，覆盖 theme-overrides 中同权重的 .info-table .lbl
 */
body .info-table td.lbl,
body .base-info-table td.lbl,
body .building-params-table td.lbl,
body .building-summary-label {
  color: #B2B2B2 !important;
  font-weight: 400 !important;
  background: transparent !important;
}

/* ---------- 值列：中灰，避免纯黑/深灰过重 ---------- */
body .info-table td.val,
body .base-info-table td.val,
body .building-params-table td.val,
body .building-summary-value {
  color: #555555 !important;
  font-weight: 400 !important;
}

/* 总价/次要值保持中灰 */
body .info-table td.val.total-rent,
body .base-info-table td.val.total-rent,
body .building-params-table td.val.total-rent {
  color: #555555 !important;
}

/* 价格保持红色 */
body .info-table td.val.price-red,
body .base-info-table td.val.price-red,
body .building-params-table td.val.price-red {
  color: #CC2929 !important;
}

/* ---------- 区域内/商圈/地铁/地址等链接：不用近黑色 ---------- */
body .info-table td.val a.addr-link,
body .base-info-table td.val a.addr-link,
body .building-params-table td.val a.addr-link {
  color: #555555 !important;
  text-decoration: none !important;
}

body .info-table td.val a.addr-link:hover,
body .base-info-table td.val a.addr-link:hover,
body .building-params-table td.val a.addr-link:hover {
  color: #17A1E6 !important;
  text-decoration: underline !important;
}

/* 地铁线路/站点若单独加 metro-link 类，保持品牌蓝 */
body .info-table td.val a.addr-link.metro-link,
body .base-info-table td.val a.addr-link.metro-link,
body .building-params-table td.val a.addr-link.metro-link {
  color: #17A1E6 !important;
}

/* =============================================================
 * 布局：标签列贴合内容 + 冒号右对齐，消除「标签和值距离太远」
 *
 * 问题根因：
 *   property/coworking 模板在 @media(min-width:768px) 里写了
 *   .info-table{width:100%;table-layout:fixed}，而标签列宽度又解析为 auto
 *   （theme-overrides 的 .info-table td.lbl{width:auto} 优先级高于模板内联的
 *   .info-table .lbl{width:100px}）。fixed 布局下 auto 列会均分表格宽度，
 *   两列各占 50%，值被推到约 390px 处，短标签（区域/地铁/地址）与值之间出现大片空白。
 *   rent/64（property/index.php）另有 body.detail-page .info-table td.lbl{width:90px}
 *   兜底所以正常，coworking 缺这条兜底就暴露了。
 *
 * 方案（对所有详情页生效，且不依赖标签字数）：
 *   1) 覆盖 table-layout:fixed 为 auto，让标签列回到「按内容收缩」；
 *   2) 标签 nowrap + 右对齐 → 各行列尾冒号对齐在同一 x，值紧跟其后，间距恒定且紧凑；
 *   3) 标签不再需要 &nbsp; 手工补空格（改由 includes/info_table.php 统一渲染）。
 * ============================================================= */
body .info-table,
body .base-info-table,
body .building-params-table {
  table-layout: auto !important;
}

body .info-table td.lbl,
body .base-info-table td.lbl,
body .building-params-table td.lbl {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: nowrap !important;
  text-align: right !important;
  vertical-align: top !important;
  padding-left: 0 !important;
  padding-right: 8px !important;
}

body .info-table td.val,
body .base-info-table td.val,
body .building-params-table td.val {
  width: auto !important;
  text-align: left !important;
  vertical-align: top !important;
  padding-left: 8px !important;
  padding-right: 0 !important;
}
