/* 小保统一站 · V14 视觉替换（2026-10-29）
 *
 * John：「起码这个要替换吧」「六宫格你也要替换」
 *   → 顶部品牌区换成素材包 01 的品牌图；
 *   → 首页六宫格改用素材包 02~07 的卡片图（国语/粤语各一套）。
 *
 * 为什么用图不用重画：素材包给的是成稿 PNG，文字已烘焙在图里，
 * 所以每个语言各一套图，切语言就是换图，不需要二次排版。
 *
 * 布局影响（已核算）：
 *   六宫格按钮原来是 flex 纵向排列（图标 24px + 标题 + 副标题 + 小标签），
 *   现在文字用 clip 藏起来（仍进无障碍树），按钮按卡片图 303:226 定比例，
 *   手机端高度由 ~70px 变 ~88px（宽 118px 时），其余网格参数不动。
 *
 * 回滚：删掉 index.html 里加载本文件与 xb-v14-visual.js 的两行即可。
 */

/* ---------------- 顶部品牌区 ---------------- */
/* 盾牌 + 旧字标二合一到新品牌图里，旧的盾牌图不再显示，避免出现两个吉祥物
   注意：brand-header-v6-title-align.js 会在运行时往 head 追加 <style>，
   位置排在本文件之后，所以这里必须用 html body 抬高优先级才压得住。 */
html body .brand-logo.xb-brand-shield {
  display: none !important;
}

.brand-title.xb-brand-wordmark {
  width: auto !important;
  max-width: 92vw !important;
  margin: 0 auto 10px !important;
}

html body .brand-title.xb-brand-wordmark img {
  display: block !important;
  width: min(74vw, 280px) !important;
  height: auto !important;
  max-width: 92vw !important;
  visibility: visible !important;
  opacity: 1 !important;
}

@media (max-width: 360px) {
  html body .brand-title.xb-brand-wordmark img { width: 78vw !important; }
}

/* ---------------- 首页六宫格 ---------------- */
.life-btn {
  --xb-card: none;
  position: relative;
  background-image: var(--xb-card) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 文字藏起来但仍读得到（无障碍名保留），不参与布局 */
.life-btn > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

/* 按下时保留卡片图（原 :active 的 background 简写会把图冲掉） */
.life-btn:active {
  background-image: var(--xb-card) !important;
  background-color: transparent !important;
  transform: scale(0.97);
}

/* 手机端按卡片图比例定高，避免图被拉扁 */
@media (max-width: 767px) {
  .life-btn {
    aspect-ratio: 303 / 226;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    gap: 0 !important;
  }
}

/* ---- 国语卡片图 ---- */
.life-btn[data-route="workspace"]    { --xb-card: url("./brand/v14/zh/workspace.png"); }
.life-btn[data-route="war-room"]     { --xb-card: url("./brand/v14/zh/war-room.png"); }
.life-btn[data-route="objection"]    { --xb-card: url("./brand/v14/zh/objection.png"); }
.life-btn[data-route="underwriting"] { --xb-card: url("./brand/v14/zh/underwriting.png"); }
.life-btn[data-route="policy-review"]{ --xb-card: url("./brand/v14/zh/policy-review.png"); }
.life-btn[data-route="practice"]     { --xb-card: url("./brand/v14/zh/practice.png"); }

/* ---- 粤语卡片图 ---- */
body[data-xb-lang="yue"] .life-btn[data-route="workspace"]     { --xb-card: url("./brand/v14/yue/workspace.png"); }
body[data-xb-lang="yue"] .life-btn[data-route="war-room"]      { --xb-card: url("./brand/v14/yue/war-room.png"); }
body[data-xb-lang="yue"] .life-btn[data-route="objection"]     { --xb-card: url("./brand/v14/yue/objection.png"); }
body[data-xb-lang="yue"] .life-btn[data-route="underwriting"]  { --xb-card: url("./brand/v14/yue/underwriting.png"); }
body[data-xb-lang="yue"] .life-btn[data-route="policy-review"] { --xb-card: url("./brand/v14/yue/policy-review.png"); }
body[data-xb-lang="yue"] .life-btn[data-route="practice"]      { --xb-card: url("./brand/v14/yue/practice.png"); }

/* 桌面上卡片图四周留白由 contain 处理，白底上看不出来 */
@media (min-width: 768px) {
  .life-btn { border-radius: 16px !important; }
}

/* ---------------- 首页：先摘掉「生活有道」入口 ---------------- */
/* 这张卡是 V14 包自带 life-entry.js 插到首页 Today 卡下面的，
   John 2026-10-29：「怎么生活有道卡片出现在首页了」→ 隐藏。
   抽屉里本来就有「生活有道」入口，功能没少。
   要恢复：删掉下面这一条即可。 */
#xbLifeEntry {
  display: none !important;
}

/* ---------------- 抽屉四宫格（历史消息 / 工具箱 / 备忘录 / 我的） ---------------- */
/* 抽屉样式是 xb-drawer.js 运行时注入 <style> 的，排在本文之后，
   所以这里用 .xbd-cards > .xbd-card 抬一档优先级。 */
.xbd-cards > .xbd-card {
  --xb-drawer: none;
  position: relative;
  display: block;
  aspect-ratio: 1.74;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background-image: var(--xb-drawer) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  background-color: transparent !important;
}

/* 卡片上的文字藏起来但仍读得到，不参与布局 */
.xbd-cards > .xbd-card > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.xbd-cards > .xbd-card:active {
  background-image: var(--xb-drawer) !important;
  background-color: transparent !important;
  transform: scale(0.98);
}

/* 当前所在面板给一圈绿框（原来靠改背景色，现在背景是图，改成描边） */
.xbd-cards > .xbd-card.on {
  box-shadow: 0 0 0 2px #2f6b52 !important;
  border-radius: 14px;
}

/* ---- 国语 ---- */
.xbd-cards > .xbd-card[data-xbdpanel="history"] { --xb-drawer: url("./brand/v14/zh/history.png"); }
.xbd-cards > .xbd-card[data-xbdpanel="toolbox"] { --xb-drawer: url("./brand/v14/zh/toolbox.png"); }
.xbd-cards > .xbd-card[data-xbdpanel="memo"]    { --xb-drawer: url("./brand/v14/zh/memo.png"); }
.xbd-cards > .xbd-card[data-xbdgo="me"]         { --xb-drawer: url("./brand/v14/zh/me.png"); }

/* ---- 粤语 ---- */
body[data-xb-lang="yue"] .xbd-cards > .xbd-card[data-xbdpanel="history"] { --xb-drawer: url("./brand/v14/yue/history.png"); }
body[data-xb-lang="yue"] .xbd-cards > .xbd-card[data-xbdpanel="toolbox"] { --xb-drawer: url("./brand/v14/yue/toolbox.png"); }
body[data-xb-lang="yue"] .xbd-cards > .xbd-card[data-xbdpanel="memo"]    { --xb-drawer: url("./brand/v14/yue/memo.png"); }
body[data-xb-lang="yue"] .xbd-cards > .xbd-card[data-xbdgo="me"]         { --xb-drawer: url("./brand/v14/yue/me.png"); }
