/* 云届 · 微信式移动端基线（XY_WX_V1）
 * 只学排版格式，不搬内容：顶栏居中标题、分组卡片列表、底部 TabBar、纯净阅读区。
 * 仅在窄屏生效，不影响桌面版。
 */

@media (max-width: 820px) {

  :root {
    --wx-bg: #EDEDED;          /* 微信式页面底色 */
    --wx-card: #FFFFFF;        /* 分组卡片白 */
    --wx-line: #E5E5E5;        /* 行分隔细线 */
    --wx-text: #191919;        /* 主文字 */
    --wx-sub: #888888;         /* 次文字 */
    --wx-link: #576B95;        /* 微信式链接蓝 */
    --wx-bar: #F7F7F7;         /* 顶栏/底栏底色 */
    --yj-blue: #002FA7;        /* 云届克莱因蓝 */
    --yj-gold: #C8A45C;
    --yj-ink: #01123F;
  }

  html, body {
    background: var(--wx-bg) !important;
    -webkit-text-size-adjust: 100%;
  }

  /* 中间阅读区：左右只留 16px，上下让位顶栏与底栏 */
  body { padding-top: 0 !important; }

  /* ---------- 顶栏：左汉堡 / 中标题 / 右三点 ---------- */
  .xy-wx-top {
    position: fixed; left: 0; right: 0; top: 0;
    z-index: 2147483600;
    height: calc(46px + env(safe-area-inset-top));
    padding-top: env(safe-area-inset-top);
    display: flex; align-items: center;
    background: var(--wx-bar);
    border-bottom: 1px solid var(--wx-line);
    box-shadow: none;
  }
  .xy-wx-top .t-title {
    flex: 1 1 auto; min-width: 0;
    text-align: center;
    font-size: 17px; font-weight: 600; color: var(--wx-text);
    letter-spacing: .01em;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    padding: 0 4px;
  }
  .xy-wx-top .t-btn {
    flex: 0 0 46px; width: 46px; height: 46px;
    display: flex; align-items: center; justify-content: center;
    border: 0; background: transparent; padding: 0; cursor: pointer;
    color: var(--wx-text);
  }
  .xy-wx-top .t-btn:active { opacity: .55; }
  .xy-wx-top .t-btn svg { width: 23px; height: 23px; display: block; }
  .xy-wx-top .t-btn svg path,
  .xy-wx-top .t-btn svg circle,
  .xy-wx-top .t-btn svg rect { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; }
  .xy-wx-top .t-btn .d3 circle { fill: currentColor; stroke: none; }

  /* 顶栏占位，避免内容被盖住 */
  .xy-wx-spacer { height: calc(46px + env(safe-area-inset-top)); }

  /* 旧的圆形返回键与汉堡同位置，统一由顶栏接管，避免两个按钮叠在一起 */
  #xy-back-btn { display: none !important; }
  /* 分类页自建的 yjBack 圆形返回钮同样压掉，返回走顶栏汉堡菜单 */
  #yjBack { display: none !important; }

  /* 整屏固定高度的页面（分类页 .cat-page 用 100vh）要给自己让出 46px 顶栏，
     否则页面自带的搜索框会被顶栏压住 */
  .cat-page {
    margin-top: calc(46px + env(safe-area-inset-top)) !important;
    height: calc(100vh - 46px - env(safe-area-inset-top)) !important;
  }

  /* 页面自带的 Vant TabBar 与注入的 TabBar 会叠成两排，统一隐藏自带那条 */
  .van-tabbar, .van-tabbar--fixed { display: none !important; }
  /* Vant 顶栏同理，避免与注入顶栏叠两条 */
  .van-nav-bar, .van-nav-bar--fixed { display: none !important; }

  /* ---------- 分组卡片列表 ---------- */
  .xy-wx-group {
    background: var(--wx-card);
    margin: 8px 0 0;
  }
  .xy-wx-group + .xy-wx-group { margin-top: 8px; }

  .xy-wx-row {
    display: flex; align-items: center; gap: 12px;
    min-height: 54px;
    padding: 9px 16px;
    background: var(--wx-card);
    border-bottom: 1px solid var(--wx-line);
    text-decoration: none; color: var(--wx-text);
    position: relative;
    -webkit-tap-highlight-color: transparent;
  }
  .xy-wx-row:last-child { border-bottom: 0; }
  .xy-wx-row:active { background: #F2F2F2; }

  /* 左侧 44×44 圆角彩色图标 */
  .xy-wx-ico {
    flex: 0 0 40px; width: 40px; height: 40px;
    border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    background: var(--yj-blue);
    color: #fff;
    overflow: hidden;
  }
  .xy-wx-ico svg { width: 22px; height: 22px; }
  .xy-wx-ico svg path, .xy-wx-ico svg circle, .xy-wx-ico svg rect {
    fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  }
  .xy-wx-ico.gold { background: linear-gradient(160deg, #C8A45C, #A8823C); }
  .xy-wx-ico.green { background: #12A150; }
  .xy-wx-ico.orange { background: #F57C20; }
  .xy-wx-ico.cyan { background: #1793D1; }
  .xy-wx-ico.ink { background: #01123F; }

  .xy-wx-main { flex: 1 1 auto; min-width: 0; }
  .xy-wx-name {
    font-size: 16px; line-height: 1.35; color: var(--wx-text);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .xy-wx-desc {
    margin-top: 3px; font-size: 12.5px; color: var(--wx-sub);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .xy-wx-val {
    flex: 0 0 auto; font-size: 13px; color: var(--wx-sub);
    max-width: 42%; text-align: right;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  /* 右侧灰箭头 */
  .xy-wx-arrow {
    flex: 0 0 14px; width: 14px; height: 14px;
    border-right: 1.8px solid #C7C7C7;
    border-top: 1.8px solid #C7C7C7;
    transform: rotate(45deg);
    margin-left: 2px;
  }

  /* 分组标题（微信式：小字灰，14px，左侧 16px） */
  .xy-wx-cap {
    padding: 18px 16px 7px;
    font-size: 13px; color: var(--wx-sub); letter-spacing: .02em;
  }

  /* 搜索框：圆角浅灰，居中占位 */
  .xy-wx-search {
    margin: 8px 0 0;
    background: var(--wx-card);
    padding: 8px 16px;
  }
  .xy-wx-search input {
    width: 100%; height: 36px;
    border: 0; border-radius: 8px;
    background: #F2F2F2;
    font-size: 15px; color: var(--wx-text);
    text-align: center;
    padding: 0 12px;
    font-family: inherit;
    -webkit-appearance: none;
  }
  .xy-wx-search input::placeholder { color: #ABABAB; }
  .xy-wx-search input:focus { outline: none; background: #EDEDED; text-align: left; }

  /* ---------- 底部 TabBar ---------- */
  .xy-wx-tabbar {
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 1000;
    background: var(--wx-bar);
    border-top: 1px solid var(--wx-line);
    padding-bottom: env(safe-area-inset-bottom);
    display: flex; align-items: stretch;
    height: calc(52px + env(safe-area-inset-bottom));
  }
  .xy-wx-tab {
    flex: 1 1 0; min-width: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px;
    border: 0; background: transparent; padding: 0;
    color: #6B6B6B; font-family: inherit;
    text-decoration: none; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    position: relative;
  }
  .xy-wx-tab svg { width: 25px; height: 25px; display: block; }
  .xy-wx-tab svg path, .xy-wx-tab svg circle, .xy-wx-tab svg rect, .xy-wx-tab svg line {
    fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  }
  .xy-wx-tab span { font-size: 10.5px; line-height: 1.2; }
  .xy-wx-tab.on { color: var(--yj-blue); }
  .xy-wx-tab.on svg { filter: none; }
  .xy-wx-tab:active { opacity: .6; }

  /* 中央"管家"凸起圆钮（承自"我的"版式，金边） */
  .xy-wx-tab.mid { flex: 0 0 68px; }
  .xy-wx-tab.mid .ring {
    width: 46px; height: 46px; margin-top: -14px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--yj-gold);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 8px rgba(1,18,63,.14);
    overflow: hidden;
  }
  .xy-wx-tab.mid .ring img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .xy-wx-tab.mid span { margin-top: -1px; }

  /* 未读红点 */
  .xy-wx-tab .badge {
    position: absolute; top: 6px; left: 50%; margin-left: 6px;
    min-width: 16px; height: 16px; padding: 0 4px;
    border-radius: 8px; background: #FA5151; color: #fff;
    font-size: 10px; line-height: 16px; text-align: center;
    box-shadow: 0 0 0 1.5px var(--wx-bar);
  }

  /* 底栏占位，内容不被遮挡 */
  body.xy-wx-tabed { padding-bottom: calc(58px + env(safe-area-inset-bottom)) !important; }

  /* 商品详情页的 van-goods-action 也固定在底部，会被注入的 TabBar 整条盖住，
     把它抬到 TabBar 之上，并给正文再补一层占位，避免"按钮看不见" */
  .van-goods-action {
    bottom: calc(52px + env(safe-area-inset-bottom)) !important;
    z-index: 999 !important;
  }
  body:has(.van-goods-action) { padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important; }
  /* 注入的操作栏同理，正文底部再多留一条按钮的高度 */
  body:has(#xyGbar) { padding-bottom: calc(118px + env(safe-area-inset-bottom)) !important; }
  /* 操作栏紧贴 TabBar 上沿，中央"管家"圆钮不能再向上凸出压住按钮 */
  body:has(#xyGbar) .xy-wx-tab.mid .ring {
    margin-top: 0 !important; width: 42px !important; height: 42px !important;
  }

  /* ---------- 浮标：自动隐藏 + 可拖动（JS 接管位置） ---------- */
  .fabx, .faba { transition: opacity .18s ease, transform .18s ease; }
  .xy-fab-hidden { opacity: 0 !important; pointer-events: none !important; transform: scale(.86) !important; }
  /* 两个浮标上下错开靠右，避免互相叠压，也避开底部主按钮 */
  .fabx { left: auto !important; right: 14px !important; bottom: calc(78px + env(safe-area-inset-bottom)) !important; z-index: 900 !important; }
  .faba { left: auto !important; right: 14px !important; bottom: calc(146px + env(safe-area-inset-bottom)) !important; z-index: 900 !important; }
  .faba .lbl { right: auto !important; left: 8px !important; bottom: calc(148px + env(safe-area-inset-bottom)) !important; }
  .fabx .lbl { bottom: calc(80px + env(safe-area-inset-bottom)) !important; }

  /* 浮标对话面板：贴底、不压主按钮、低于顶栏 */
  .panel, .panel.mx {
    z-index: 950 !important;
    bottom: calc(64px + env(safe-area-inset-bottom)) !important;
    height: calc(100vh - 150px) !important;
    max-height: calc(100vh - 150px) !important;
  }

  /* 统一禁掉残留的粗阴影/毛玻璃叠层，避免"多层叠加"观感 */
  .xy-wx-top, .xy-wx-tabbar { backdrop-filter: none; -webkit-backdrop-filter: none; }
}

/* 桌面端：不注入任何移动端样式，保持原样 */
@media (min-width: 821px) {
  .xy-wx-top, .xy-wx-spacer, .xy-wx-tabbar, .xy-wx-search, .xy-wx-group { display: none !important; }
}

/* ==== APP 门户页（/app/*.html）统一为小程序 H5 版式（XY_APP_UNIFY） ==== */
@media (max-width: 820px) {
  /* 原生静态 TabBar / 页脚：让位给 XY TabBar，消除双层叠加与遮挡 */
  .wrap > .tab { display: none !important; }
  .wrap { padding-bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
  .sfoot, .foot { display: none !important; }
  .crumb { padding: 10px 12px 0 !important; }

  /* 深蓝大块 hero → 白底简洁标题；写死的假数字看板直接不显示 */
  .hero {
    background: #fff !important;
    color: #111 !important;
    padding: 12px 14px !important;
    border-bottom: 1px solid #EFEFEF;
  }
  .hero h1 { font-size: 17px !important; line-height: 1.4 !important; color: #111 !important; }
  .hero p { color: #8A8A8A !important; font-size: 12px !important; margin-top: 4px !important; }
  .statrow { display: none !important; }

  /* 顶栏搜索条：白底 + 浅灰输入框 */
  .top { background: #fff !important; color: #111 !important; border-bottom: 1px solid #EFEFEF; }
  .top .brand { color: #111 !important; }
  .top .sbox { background: #F2F2F2 !important; }
  .top .sbox input { color: #111 !important; }
  .top .sbox input::placeholder { color: #9A9A9A !important; }
  .top .sbox b { color: #002FA7 !important; }

  /* 分类格：汉字色块 → 统一浅蓝圆形图标位 */
  .cats { gap: 8px !important; }
  .cats a { border-radius: 12px !important; box-shadow: 0 1px 2px rgba(16,24,40,.05) !important; padding: 11px 6px !important; }
  .cats a b {
    width: 36px !important; height: 36px !important; border-radius: 50% !important;
    background: #EAF0FB !important; color: #002FA7 !important;
    font-size: 12px !important; line-height: 36px !important; letter-spacing: 0 !important;
  }

  /* 商品卡图片位：由 xy-wx.js 补真实主图 */
  .card .im {
    height: auto !important;
    aspect-ratio: 1 / 1;
    background: #F5F5F5 !important;
    color: transparent !important;
    overflow: hidden;
    display: block !important;
  }
  .card .im img { width: 100%; height: 100%; object-fit: cover; display: block; }

  /* 主色统一克莱因蓝 */
  .btn { background: #002FA7 !important; border-radius: 10px !important; }
  .btn.gold { background: #C8A45C !important; }
  .btn.line { background: #fff !important; color: #002FA7 !important; border-color: #002FA7 !important; }
  .tagline a.on { background: #002FA7 !important; border-color: #002FA7 !important; }
  .sec h2 { font-size: 15px !important; }
}
/* ==== 移动端浮标去重：只保留小芸一个，开发者平台悬浮条与重复快捷钮隐藏 ==== */
@media (max-width: 820px) {
  #xyq-fab, #xyq-dev, #xyq-panel, #xyq-mask { display: none !important; }
  .xy-wx-tabbar { z-index: 1300; }
  #xyToast, body .xy-toast { bottom: calc(120px + env(safe-area-inset-bottom)) !important; }
}
/* ==== 气泡浮标去重：中央已有管家钮，右下重复气泡与角标收掉 ==== */
@media (max-width: 820px) {
  #xyb-host, .fabx, .faba, #xyq-fab, #xyq-dev { display: none !important; }
}

/* /app/ 页内面包屑与顶栏标题、页内大标题重复，移动端隐藏 */
@media (max-width:820px){
  .crumb, .breadcrumb, .xy-crumb{display:none !important}
}

/* ===== XY_TOP_FIX_V1 (2026-11-14)：顶栏让位 · 重复返回键去重 · 小程序胶囊避让 ===== */
@media (max-width: 820px) {
  /* 顶栏是 fixed，正文却从 top:0 开始，首屏 46px 一直被压住；统一给 #app 让位 */
  #app { padding-top: calc(46px + env(safe-area-inset-top)) !important; }
  /* 旧的让位块被插到页尾，反而在底部多出一段空白 */
  .xy-wx-spacer, #xyWxSpacer { display: none !important; }
  /* 页面自建返回箭头「‹」与顶栏汉堡同处左上角，两者叠在一起看不清点不到 */
  .yj-back, #yjBack, #xy-back-btn { display: none !important; }
  /* 只有标题、没有 tab 切换的页面头部，由顶栏标题取代；带 .yj-tabs 的保留 */
  .yj-head:not(:has(.yj-tabs)) { display: none !important; }
  /* 小程序 web-view 内右上胶囊压在顶栏右侧时，给三点让位 */
  html.xy-mp-cap .xy-wx-top { padding-right: 100px !important; }
  html.xy-mp-cap #xyWxMore { display: none !important; }
}