/* ==========================================================================
   1024yun 移动端公共样式（官网 / 购物车 / 客户中心 PC 共用）
   内容：顶栏品牌名 + 底部 tab bar
   宽度规范：跟随首页 —— 断点 640px，底部 tab 全宽（left:0 right:0）
   ========================================================================== */

/* ---- 顶栏品牌名：跟在汉堡(☰)右侧 ---- */
.el-header .header-left {
  display: flex !important;
  align-items: center;
  gap: 10px;
}
/* 客户中心移动页品牌名（无 JS 注入，用伪元素；购物车由 :has 抑制避免重复） */
.el-header .header-left::after {
  content: "紫橙云";
  font-size: 17px;
  font-weight: 700;
  letter-spacing: normal;
  background: linear-gradient(120deg, #a78bfa, #fb923c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  white-space: nowrap;
}
.el-header .header-left:has(.st-logo)::after { content: none; }
.el-header .st-logo {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: normal;        /* 与首页 .logo 一致 */
  color: #fff !important;        /* 覆盖 theme.css 的 .el-header span */
  white-space: nowrap;
}
.el-header .st-logo i {
  font-style: normal;
  background: linear-gradient(120deg, #a78bfa, #fb923c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;              /* 0,2,1 > theme.css 的 .el-header i */
  -webkit-text-fill-color: transparent !important;
}

/* ---- 底部 tab bar ---- */
.site-tabbar { display: none; }
@media (max-width: 640px) {
  body { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
  .site-tabbar {
    display: flex;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 300;
    height: 56px;
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(10px);
    border-top: 1px solid #ece9f5;
    box-shadow: 0 -2px 14px rgba(27, 18, 56, .06);
  }
  .site-tabbar a {
    flex: 1;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; min-height: 52px;
    text-decoration: none; color: #8a93a5; font-size: 11px;
  }
  .site-tabbar a svg { width: 22px; height: 22px; }
  .site-tabbar a.on { color: #7c3aed; }
  .site-tabbar a:active { color: #f97316; }
}

/* ==========================================================================
   统一顶栏：☰ + 紫橙云 + 64px 深紫渐变
   （官网 nav / 购物车 el-header / 客户中心 auth-bar 三处共用）
   断点 ≤640（手机）；桌面端各自保留原样
   ========================================================================== */
@media (max-width: 640px) {
  /* 顶栏容器 */
  .nav,
  .el-header,
  .m-auth-bar {
    height: 64px !important;
    background: linear-gradient(120deg, #1b1238 0%, #2a1a56 100%) !important;
    box-shadow: 0 2px 12px rgba(27, 18, 56, .22) !important;
    border-bottom: none !important;
    backdrop-filter: none !important;
    /* 子元素垂直居中（否则 44px 的 .header-left 会贴顶，logo 偏高 6px） */
    align-items: center !important;
  }
  .nav-in { height: 64px !important; padding-left: 16px !important; padding-right: 16px !important; }
  .el-header, .m-auth-bar { padding-left: 16px !important; padding-right: 16px !important; }

  /* ☰ 菜单按钮：44px 热区（首页/客户中心是纯按钮） */
  .nav-toggle,
  .m-ab-menu {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .nav-toggle svg,
  .m-ab-menu svg { width: 24px; height: 24px; }

  /* 购物车 .header-left：不限宽，改成 flex 行（☰ + 品牌名），与首页同布局 */
  .el-header .header-left {
    width: auto !important;
    height: 44px !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  /* 购物车三横图标：44px 热区 + 24px 图标 */
  .el-header .header-left .menu-img {
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    flex: 0 0 auto;
    /* 原图是灰色 PNG，刷成白色（与首页/客户中心的白色三横一致） */
    filter: brightness(0) invert(1) !important;
  }
  /* 购物车三横：JS 注入的 SVG（纯白清晰，替代灰色 PNG） */
  .el-header .st-hamburger {
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    color: #fff !important;
    flex: 0 0 auto;
    cursor: pointer;
  }
  /* 客户中心：☰ 与品牌间距 6px（与首页一致） */
  .m-auth-bar { gap: 6px !important; }

  /* 品牌名：17px，右侧自动留白 */
  .nav .logo,
  .el-header .st-logo,
  .m-ab-logo {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #fff;
    min-height: 44px;
    display: flex;
    align-items: center;
    margin-right: auto;
    padding: 0 6px;
  }
  /* 购物车的「紫橙云」伪元素同步字号 */
  .el-header .st-logo { font-size: 19px !important; }

  /* 内容让位（64px 顶栏） */
  .el-main { margin-top: 64px !important; }          /* 购物车 */
  .hero { padding-top: 64px !important; }            /* 官网首屏 */
  body.m-auth { padding-top: 64px !important; }      /* 客户中心 */
  body.m-auth .login-container { height: calc(100vh - 64px) !important; }

  /* 覆盖 idc-brand.css 的白底（它加载更晚，用更高权重压回渐变） */
  body .el-header {
    background: linear-gradient(120deg, #1b1238 0%, #2a1a56 100%) !important;
  }
}

/* ==========================================================================
   客户中心 PC 模板页面（工单/我的等）：手机端隐藏 yun-topbar 注入的品牌条，
   只保留 .el-header 一条（与购物车一致）
   ========================================================================== */
@media (max-width: 960px) {
  /* 隐藏注入的品牌条 */
  .yun-topbar { display: none !important; }
  /* 顶栏压回最顶部（idc-brand.css 里是 top:58px，权重相同但加载更晚，
     所以这里用 body 前缀抬权重） */
  body .el-header { top: 0 !important; }
  /* 内容区让出 64px 顶栏高度 */
  body .el-main { margin-top: 64px !important; }
  /* 侧边栏同步回到顶部 */
  body .el-aside { top: 0 !important; }
}

/* 品牌名字间距与首页一致（默认 normal） */
.m-ab-logo { letter-spacing: normal !important; }

/* ==========================================================================
   顶栏底色：≤960 全部统一成同一个深紫渐变（首页/选购/客户中心）
   避免 641-960 时首页纯色、选购白底、客户中心半透明各用各的
   ========================================================================== */
@media (max-width: 960px) {
  .nav,
  .nav.scrolled,
  body .el-header,
  body .m-auth-bar {
    background: linear-gradient(120deg, #1b1238 0%, #2a1a56 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    /* 高度统一成首页的 64px（原选购40 / 客户中心53） */
    height: 64px !important;
    box-sizing: border-box !important;
    border-bottom: none !important;
  }
  .nav-in { height: 64px !important; }
  /* 内边距只给 el-header / m-auth-bar（.nav 由 .nav-in 的 16px 提供，避免双倍） */
  body .el-header, body .m-auth-bar {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ==========================================================================
   支付弹窗移动端宽度（原 12rem = 624px，远超手机屏宽）
   ========================================================================== */
@media (max-width: 750px) {
  .pay-dialog {
    width: 90vw !important;
    max-width: 90vw !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .pay-dialog .dia-content { margin-bottom: 0.8rem !important; }
}

/* ==========================================================================
   支付弹窗移动版重排（.mobile-pay 现成结构，断点提到 960 覆盖平板/宽屏）
   ========================================================================== */
@media (max-width: 960px) {
  .pay-dialog {
    width: 92vw !important;
    max-width: 92vw !important;
    margin-top: 5vh !important;
    border-radius: 14px !important;
    overflow: hidden !important;
  }
  .pay-dialog .pc-pay { display: none !important; }
  .pay-dialog .mobile-pay { display: block !important; }

  /* 标题栏 */
  .pay-dialog .dia-title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: auto !important;
    padding: 13px 16px !important;
    background: #faf9fe !important;
    border-bottom: 1px solid #f0eef7 !important;
  }
  .pay-dialog .dia-title .title-text { font-size: 13px !important; color: #5a6478 !important; }
  .pay-dialog .pay-money { font-size: 20px !important; font-weight: 800 !important; color: #f97316 !important; }
  /* 内部 .font-26 数字继承父级字号，避免被 rem 缩小 */
  .pay-dialog .pay-money .font-26 { font-size: inherit !important; font-weight: inherit !important; }

  .pay-dialog .dia-content { padding: 0 16px 16px !important; margin-bottom: 0 !important; }

  .pay-dialog .order-id { font-size: 12px !important; color: #8692b0 !important; padding: 12px 0 4px !important; }

  /* 支付方式：两列网格 */
  .pay-dialog .pay-type {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 10px 0 !important;
  }
  .pay-dialog .pay-type .type-item {
    flex: 0 0 calc(50% - 5px) !important;
    height: 54px !important;
    border: 1px solid #e9e5f7 !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px !important;
    background: #fff !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .pay-dialog .pay-type .type-item img { max-width: 100% !important; max-height: 100% !important; object-fit: contain !important; }
  .pay-dialog .pay-type .type-item.active {
    border-color: #7c3aed !important;
    box-shadow: 0 0 0 2px rgba(124, 58, 237, .12) !important;
  }

  /* 余额支付 */
  .pay-dialog .use-blance {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 10px 0 !important;
  }
  .pay-dialog .use-blance .blance-text { font-size: 13px !important; color: #26282c !important; }
  .pay-dialog .use-blance .blance-tip { font-size: 12px !important; color: #8692b0 !important; }

  .pay-dialog .qr-money { font-size: 13px !important; color: #5a6478 !important; padding: 6px 0 !important; }
  .pay-dialog .qr-money .pay-money { font-size: 16px !important; }

  /* 二维码 */
  .pay-dialog .QR-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 0 !important;
  }
  .pay-dialog .QR-box .qr-text { display: none !important; }
  .pay-dialog .QR-box .qr-content {
    width: 180px !important;
    height: 180px !important;
    min-height: 0 !important;
  }
  .pay-dialog .QR-box .qr-content img { width: 100% !important; height: 100% !important; }

  /* 按钮 */
  .pay-dialog .dia-fotter {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding-top: 6px !important;
  }
  .pay-dialog .dia-fotter .el-button {
    width: 100% !important;
    height: 44px !important;
    border-radius: 22px !important;
    font-size: 15px !important;
    margin: 0 !important;
  }
  .pay-dialog .dia-fotter .confirm-btn {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600 !important;
  }
  .pay-dialog .dia-fotter .cancel-btn,
  .pay-dialog .dia-fotter .def-btn {
    background: #f4f2fb !important;
    border: none !important;
    color: #5a6478 !important;
  }
}

/* ==========================================================================
   客户中心首页（/home.htm）移动端重排 —— 纯样式，不改任何事件绑定
   ========================================================================== */
@media (max-width: 960px) {
  .home-main { padding: 12px !important; background: #f6f5fb !important; }
  .main-card, .main-content { display: block !important; }
  .left-box, .right-box { width: 100% !important; display: flex !important; flex-direction: column !important; gap: 10px !important; }
  .right-box { margin-top: 0 !important; }

  /* ---------- 用户卡 ---------- */
  .info-box {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    background: #fff !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important;
    gap: 0 8px !important;
  }
  .info-box .divider-box { display: none !important; }
  .info-first { display: flex !important; align-items: center !important; gap: 10px !important; width: 100% !important; padding: 0 !important; cursor: pointer; }
  .name-first {
    width: 42px !important; height: 42px !important; min-width: 42px !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #fb923c, #f97316) !important;
    color: #fff !important; font-size: 18px !important; font-weight: 700 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    margin: 0 !important;
  }
  .name-box { flex: 1 1 auto !important; min-width: 0 !important; }
  .name-box .hello { font-size: 15.5px !important; font-weight: 700 !important; color: #1e2736 !important; margin: 0 !important; line-height: 1.35 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .name-box .name { font-size: 11.5px !important; color: #8692b0 !important; margin: 3px 0 0 !important; }
  .name-box .id-text { color: #1e2736 !important; font-weight: 600; }
  .level-badge { font-size: 10.5px !important; }

  .info-second { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 4px 10px !important; width: 100% !important; margin: 8px 0 0 52px !important; }
  .info-second .email-box, .info-second .phone-box { display: flex !important; align-items: center !important; gap: 4px !important; font-size: 11.5px !important; color: #8692b0 !important; }
  .info-second img { width: 12px !important; height: 12px !important; opacity: .55; }
  .info-second .phone-number { color: #5a6478 !important; font-size: 11.5px !important; }

  .info-three { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; width: 100% !important; margin: 8px 0 0 52px !important; }
  .info-three .compny-box, .info-three .person-box { display: flex !important; align-items: center !important; gap: 4px !important; background: #f7f5fd !important; border-radius: 8px !important; padding: 3px 8px !important; }
  .info-three .left-icon img { display: none !important; }
  .info-three .left-type { font-size: 10.5px !important; color: #8692b0 !important; }
  .info-three .right-title .company-name { font-size: 10.5px !important; color: #7c3aed !important; font-weight: 600; }
  /* 认证编号保留（内含 v-copy 复制按钮），只压缩字号 */
  .info-three .certify-id { font-size: 10.5px !important; align-items: center !important; gap: 3px !important; }
  .info-three .certify-id .right-type { font-size: 10.5px !important; color: #8692b0 !important; }
  .info-three .certify-id .certify-text { font-size: 10.5px !important; color: #5a6478 !important; }
  .info-three .certify-id .cpoy-btn { width: 11px !important; height: 11px !important; }

  /* ---------- 余额 + 统计 ---------- */
  .statistics-box { background: transparent !important; padding: 0 !important; }
  .statistics-content { display: block !important; }
  .money-box { background: #fff !important; border-radius: 14px !important; padding: 12px 14px !important; box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important; }
  .money-top { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 10px !important; }
  .money-credit { flex: 1 1 auto !important; min-width: 0 !important; }
  .credit-title { display: flex !important; align-items: center !important; gap: 6px !important; }
  .credit-name { font-size: 11.5px !important; color: #8692b0 !important; }
  /* 余额提醒开关：保留可点，压缩尺寸 */
  .create-notice { display: inline-flex !important; align-items: center !important; gap: 4px !important; margin-left: 2px !important; }
  .notice-status { width: 14px !important; height: 8px !important; border-radius: 4px !important; background: #e5e8f0 !important; position: relative !important; flex: 0 0 auto; }
  .notice-status.active { background: #7c3aed !important; }
  .notice-btn { font-size: 10.5px !important; color: #7c3aed !important; cursor: pointer !important; white-space: nowrap; }
  .credit-money { margin-top: 4px !important; }
  .credit-num { font-size: 26px !important; font-weight: 800 !important; color: #1e2736 !important; line-height: 1.2 !important; }
  .credit-num .s-24 { font-size: 15px !important; font-weight: 600 !important; }
  .recharge-text { font-size: 11px !important; color: #7c3aed !important; }
  .credit-btn {
    flex: 0 0 auto !important;
    height: 34px !important; line-height: 34px !important;
    padding: 0 18px !important;
    border-radius: 17px !important;
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    color: #fff !important; font-size: 13px !important; font-weight: 600 !important;
    border: none !important; box-shadow: 0 3px 10px rgba(249, 115, 22, .3) !important;
    text-align: center !important;
  }

  .order-box { display: flex !important; gap: 10px !important; margin-top: 10px !important; }
  .order-item {
    flex: 1 !important;
    background: #fff !important;
    border-radius: 14px !important;
    padding: 12px 6px !important;
    text-align: center !important;
    box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important;
    background-image: none !important;
    cursor: pointer;
  }
  .order-type-img { display: none !important; }
  .order-item .order-title { font-size: 11px !important; color: #8692b0 !important; font-weight: 400 !important; margin: 0 !important; }
  .order-item .order-nums { font-size: 21px !important; font-weight: 800 !important; margin-top: 4px !important; line-height: 1.2 !important; }
  .order-box-1 .order-nums { color: #7c3aed !important; }
  .order-box-2 .order-nums { color: #3b82f6 !important; }
  .order-box-3 .order-nums { color: #f97316 !important; }

  .statistics-bottom { display: flex !important; gap: 10px !important; margin-top: 10px !important; }
  .statistics-item { flex: 1 !important; background: #fff !important; border-radius: 14px !important; padding: 12px 14px !important; box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important; }
  .statistics-item-divider { display: none !important; }
  .statistics-item-name { font-size: 11px !important; color: #8692b0 !important; display: flex !important; justify-content: space-between !important; gap: 6px !important; }
  .statistics-item-value { font-size: 16px !important; font-weight: 700 !important; color: #1e2736 !important; margin-top: 4px !important; }
  .statistics-item-value .s-12 { font-size: 12px !important; }

  /* ---------- 产品列表（el-table → 卡片） ---------- */
  .product-list-box { background: transparent !important; padding: 0 !important; box-shadow: none !important; }
  .product-list-box .title-text { font-size: 14px !important; font-weight: 600 !important; margin: 4px 2px 0 !important; }
  .product-list-box .el-table,
  .product-list-box .el-table__body-wrapper,
  .product-list-box .el-table__body,
  .product-list-box .el-table__body table,
  .product-list-box .el-table__body tbody { display: block !important; width: 100% !important; background: transparent !important; }
  .product-list-box .el-table__header-wrapper { display: none !important; }
  .product-list-box .el-table::before { display: none !important; }
  .product-list-box .el-table__body tr {
    display: grid !important;
    grid-template-columns: 1fr auto;
    grid-template-areas: "n d" "c c";
    gap: 6px 10px;
    background: #fff !important;
    border-radius: 14px !important;
    padding: 14px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important;
  }
  .product-list-box .el-table__body td { display: block !important; padding: 0 !important; border: none !important; background: transparent !important; }
  .product-list-box .el-table__body td .cell { padding: 0 !important; }
  .product-list-box .el-table__body td:nth-child(1) { grid-area: n; font-size: 15px !important; font-weight: 700 !important; color: #1e2736 !important; }
  .product-list-box .el-table__body td:nth-child(1) .product-name { font-size: 15px !important; font-weight: 700 !important; color: #1e2736 !important; text-decoration: none !important; }
  .product-list-box .el-table__body td:nth-child(2) { grid-area: c; font-size: 11.5px !important; color: #8692b0 !important; }
  .product-list-box .el-table__body td:nth-child(3) { grid-area: d; text-align: right !important; font-size: 11.5px !important; color: #8692b0 !important; }
  .product-list-box .el-table__body td:nth-child(3)::before { content: "到期 "; color: #8692b0; }
  .product-list-box .el-table__body td:nth-child(3) .red-time { color: #ef4444 !important; font-weight: 600; }
  .product-list-box .el-table__body td:nth-child(4) { display: none !important; }

  /* ---------- 右栏：工单 / 公告 / 推广 ---------- */
  .right-box > div { background: #fff !important; border-radius: 14px !important; padding: 12px 14px !important; box-shadow: 0 1px 6px rgba(27, 18, 56, .05) !important; }
  .right-box .title-text { font-size: 14px !important; font-weight: 600 !important; }
  .right-box .more { font-size: 15px !important; color: #c2c7d1 !important; }

  .WorkOrder-item { display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 0 !important; border-bottom: 1px solid #f3f1fa !important; }
  .WorkOrder-item:last-child { border-bottom: none !important; }
  .replay-div { flex: 0 0 auto !important; font-size: 11px !important; padding: 3px 9px !important; border-radius: 8px !important; color: #fff !important; }
  .replay-title { font-size: 13.5px !important; font-weight: 600 !important; color: #1e2736 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .replay-name { font-size: 12px !important; color: #8692b0 !important; margin-top: 3px !important; }

  .notice-item { display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 0 !important; }
  .notice-item-left { flex: 1 1 auto !important; min-width: 0 !important; }
  .notice-time { font-size: 11.5px !important; color: #7c3aed !important; font-weight: 600 !important; margin: 0 !important; }
  .notice-title { font-size: 13.5px !important; font-weight: 600 !important; color: #1e2736 !important; margin: 3px 0 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .notice-type { font-size: 12px !important; color: #8692b0 !important; font-weight: 400 !important; margin: 3px 0 0 !important; }

  /* 推广计划排到最后 */
  .right-box .recommend-box-open,
  .right-box .recommend-box { order: 99 !important; }
  .right-box .WorkOrder-box { order: 1 !important; }
  .right-box .notice-box { order: 2 !important; }
}

/* 客户中心首页：认证徽章（个人/企业） */
.info-box .auth-badge {
  display: inline-block;
  font-size: 10.5px;
  line-height: 1.6;
  padding: 1px 7px;
  border-radius: 7px;
  background: #e8f7ee;
  color: #16a34a;
  font-weight: 600;
  margin-left: 6px;
  vertical-align: 1px;
}

/* ===== 首页修复 20261028b ===== */
@media (max-width: 960px) {
  /* 1. 问候语不再截断，让认证徽章显示出来 */
  .info-box .name-box .hello {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 3px 6px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    max-width: 100% !important;
  }
  .info-box .auth-badge { flex: 0 0 auto !important; }

  /* 2. 认证标签左对齐，跟邮箱同一缩进 */
  .info-box .info-three {
    justify-content: flex-start !important;
    align-items: flex-start !important;
    margin-left: 52px !important;
    width: calc(100% - 52px) !important;
  }
  .info-box .info-three .compny-box,
  .info-box .info-three .person-box {
    flex: 0 0 auto !important;
    max-width: 100% !important;
  }
  .info-box .info-three .right-text { min-width: 0 !important; }
  .info-box .info-three .right-title { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }

  /* 3. 邮箱/电话左对齐 */
  .info-box .info-second { justify-content: flex-start !important; }

  /* 4. 消费卡片：百分比不挤 */
  .statistics-item { min-width: 0 !important; }
  .statistics-item .statistics-item-name { flex-wrap: wrap !important; line-height: 1.5 !important; }
  .statistics-item .statistics-item-name > span:first-child { white-space: nowrap !important; }
  .statistics-item .statistics-item-name .green-text,
  .statistics-item .statistics-item-name .red-text { font-size: 10.5px !important; white-space: nowrap !important; }
  .statistics-item .statistics-item-value { white-space: nowrap !important; }

  /* 5. el-table 高度自适应，避免行被裁切/重叠 */
  .product-list-box .el-table,
  .product-list-box .el-table__body-wrapper,
  .product-list-box .el-table__body,
  .product-list-box .el-table__body table,
  .product-list-box .el-table__body tbody { height: auto !important; max-height: none !important; }
  .product-list-box .el-table__body tr { height: auto !important; min-height: 0 !important; }
  .product-list-box .el-table__body td { height: auto !important; line-height: 1.5 !important; }
  .product-list-box .el-table__body td:nth-child(2) { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
}

/* ===== 首页修复 20261028c：去掉余额区块的灰底/背景图 ===== */
@media (max-width: 960px) {
  .statistics-box .money-box,
  .statistics-box .money-top,
  .statistics-box .money-credit,
  .statistics-box .credit-title,
  .statistics-box .credit-money {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
  }
  .statistics-box .order-box { background: transparent !important; background-image: none !important; }
  .statistics-box .order-item { background: #fff !important; background-image: none !important; }

  /* 消费卡：百分比与标题同行，金额单独一行且不被挤压 */
  .statistics-bottom .statistics-item { display: flex !important; flex-direction: column !important; justify-content: space-between !important; gap: 6px !important; }
  .statistics-bottom .statistics-item-name { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 6px !important; flex-wrap: nowrap !important; }
  .statistics-bottom .statistics-item-name > span:first-child { font-size: 10.5px !important; }
  .statistics-bottom .statistics-item-value { font-size: 17px !important; margin-top: 0 !important; }
}

/* ===== 首页修复 20261028d ===== */
@media (max-width: 960px) {
  /* 消费区去掉云朵背景图与右侧留白 */
  .statistics-bottom {
    background: transparent !important;
    background-image: none !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin-top: 10px !important;
  }
  /* 到期时间不换行 */
  .product-list-box .el-table__body td:nth-child(3) {
    white-space: nowrap !important;
  }
  .product-list-box .el-table__body td:nth-child(3)::before {
    content: "到期 " !important;
    white-space: nowrap !important;
  }
}

/* ===== 首页修复 20261028e：到期标签与日期同行 ===== */
@media (max-width: 960px) {
  .product-list-box .el-table__body td:nth-child(3)::before { content: none !important; }
  .product-list-box .el-table__body td:nth-child(3) .cell { display: inline-block !important; white-space: nowrap !important; }
  .product-list-box .el-table__body td:nth-child(3) .cell::before { content: "到期 " !important; color: #8692b0 !important; font-size: 11.5px !important; }
}

/* ===== 首页修复 20261028f：产品卡改为 C 方案布局 ===== */
@media (max-width: 960px) {
  .product-list-box .el-table__body tr {
    grid-template-columns: 1fr auto !important;
    grid-template-areas: "n n" "c d" !important;
    row-gap: 8px !important;
    column-gap: 10px !important;
    padding: 13px 14px !important;
  }
  .product-list-box .el-table__body td:nth-child(1) {
    padding-left: 12px !important;
    position: relative !important;
  }
  .product-list-box .el-table__body td:nth-child(1)::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    bottom: 2px !important;
    width: 3px !important;
    border-radius: 2px !important;
    background: linear-gradient(180deg, #7c3aed, #a78bfa) !important;
  }
  .product-list-box .el-table__body td:nth-child(2) {
    grid-area: c !important;
    padding-left: 12px !important;
    font-size: 11.5px !important;
    color: #8692b0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .product-list-box .el-table__body td:nth-child(3) {
    padding-right: 0 !important;
  }
}

/* ===== 首页修复 20261028g：用户卡合并余额/消费（模板已重构） ===== */
@media (max-width: 960px) {
  .home-main .info-box {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding: 12px 14px !important;
    gap: 0 !important;
  }
  .home-main .info-box .divider-box,
  .home-main .info-box .info-second,
  .home-main .info-box .info-three { display: none !important; }

  .home-main .info-first { display: flex !important; align-items: center !important; width: 100% !important; gap: 10px !important; }
  .home-main .name-box { flex: 1 1 auto !important; min-width: 0 !important; }
  .home-main .name-box .u-sub {
    display: flex !important; flex-wrap: wrap !important; gap: 4px 6px !important;
    margin: 3px 0 0 !important; font-size: 11.5px !important; color: #8692b0 !important;
  }
  .home-main .name-box .u-sub i { font-style: normal !important; color: #d3d8e2 !important; }

  .home-main .info-first .credit-btn {
    flex: 0 0 auto !important;
    height: 34px !important; line-height: 34px !important;
    padding: 0 18px !important; margin: 0 !important;
    border-radius: 17px !important;
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    color: #fff !important; font-size: 13px !important; font-weight: 600 !important;
    border: none !important; text-align: center !important;
    box-shadow: 0 3px 10px rgba(249, 115, 22, .3) !important;
    cursor: pointer !important;
  }

  .home-main .u-metrics {
    display: flex !important; width: 100% !important;
    margin-top: 12px !important; padding-top: 12px !important;
    border-top: 1px solid #f3f1fa !important;
  }
  .home-main .u-metrics .m { flex: 1 !important; min-width: 0 !important; text-align: center !important; }
  .home-main .u-metrics .m + .m { border-left: 1px solid #f3f1fa !important; }
  .home-main .u-metrics .k { font-size: 10.5px !important; color: #8692b0 !important; white-space: nowrap !important; line-height: 1.4 !important; }
  .home-main .u-metrics .v { font-size: 15px !important; font-weight: 700 !important; color: #1e2736 !important; margin-top: 4px !important; white-space: nowrap !important; }
  .home-main .u-metrics .v.hl { color: #f97316 !important; }
  .home-main .u-metrics .v .s-12 { font-size: 11px !important; font-weight: 600 !important; }
  .home-main .u-metrics .create-notice { display: inline-flex !important; margin-left: 3px !important; vertical-align: middle !important; }
  .home-main .u-metrics .notice-btn { font-size: 9.5px !important; color: #7c3aed !important; cursor: pointer !important; }

  /* 数据已合并进用户卡，隐藏原来的余额卡与消费卡 */
  .home-main .statistics-box .money-box { display: none !important; }
  .home-main .statistics-bottom { display: none !important; }
}

/* ===== 首页修复 20261028h：对齐预览 ===== */
@media (max-width: 960px) {
  /* 1. 用户卡隐藏 ID 行（预览中无此行，减少高度） */
  .home-main .name-box .name { display: none !important; }

  /* 2. 右栏去掉表格边框，改卡片内分隔线 */
  .right-box .WorkOrder-content,
  .right-box .notice-content {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }
  .right-box .WorkOrder-item {
    border-bottom: 1px solid #f3f1fa !important;
    padding: 10px 0 !important;
  }
  .right-box .WorkOrder-item:last-child { border-bottom: none !important; }
  .right-box .notice-item { border: none !important; padding: 4px 0 !important; }
  .right-box .notice-item-right i { color: #c2c7d1 !important; font-size: 16px !important; }

  /* 3. 推广区：宽度铺满 + 「未开启」改浅紫标签（原来白字白底看不见） */
  .right-box .recommend-box,
  .right-box .recommend-box-open {
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
  }
  .right-box .no-recommend {
    display: inline-block !important;
    color: #7c3aed !important;
    background: #f4f2fb !important;
    height: auto !important;
    line-height: 1.5 !important;
    padding: 7px 14px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    margin: 8px 0 0 !important;
    border: none !important;
  }
  .right-box .recommend-text { font-size: 12px !important; color: #8692b0 !important; }
}

/* ===== 首页修复 20261028i：产品卡配置 + 状态标签 ===== */
@media (max-width: 960px) {
  .product-list-box .el-table__body td:nth-child(1) .cell {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    word-break: normal !important;
  }
  .product-list-box .el-table__body td:nth-child(1) .product-name {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .product-list-box .el-table__body td:nth-child(1) .prod-spec {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    color: #8692b0 !important;
    font-weight: 400 !important;
    white-space: nowrap !important;
  }
  .product-list-box .el-table__body td:nth-child(1) .prod-tag {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    font-size: 10.5px !important;
    padding: 2px 8px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
    font-weight: 600 !important;
  }
  .product-list-box .el-table__body td:nth-child(1) .prod-tag.on { background: #e8f7ee !important; color: #16a34a !important; }
  .product-list-box .el-table__body td:nth-child(1) .prod-tag.off { background: #f2f3f6 !important; color: #8692b0 !important; }
}

/* ===== 首页修复 20261028j：顶部间隙 + 去掉产品列表上方空白 ===== */
@media (max-width: 960px) {
  .home-main {
    padding: 12px !important;
    padding-top: 12px !important;
  }
  .home-main .main-card,
  .home-main .main-content { margin: 0 !important; padding: 0 !important; background: transparent !important; }
  .home-main .left-box { row-gap: 10px !important; }

  /* 用户卡距顶 12px */
  .home-main .info-box { margin: 0 !important; }

  /* 统计容器不再产生额外留白 */
  .home-main .statistics-box,
  .home-main .statistics-content { margin: 0 !important; padding: 0 !important; background: transparent !important; }
  .home-main .order-box { margin-top: 0 !important; }

  /* 隐藏掉的余额/消费卡彻底不占位 */
  .home-main .statistics-box .money-box,
  .home-main .statistics-bottom { margin: 0 !important; padding: 0 !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; }

  /* 产品列表上方空白清零 */
  .home-main .product-list-box {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    flex: none !important;
  }
  .home-main .product-list-box .title-text {
    margin: 2px 2px 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
  }
}

/* ===== 首页修复 20261028k：去掉产品列表上方 38px 空白 + 顶部间隙 ===== */
@media (max-width: 960px) {
  /* 根因：home.css 里 .statistics-content 有 min-height: 2.4rem（≈125px），
     内容只有 86px，多出的 38px 就是产品列表上方的空白 */
  .home-main .statistics-content,
  .home-main .statistics-box { min-height: 0 !important; height: auto !important; }

  /* 顶部间隙：统一由 info-box 的上外边距控制 */
  .home-main { padding-top: 0 !important; }
  .home-main .info-box { margin-top: 12px !important; }
}

/* ===== 20261028l：移动端统一页面左右留白 12px（原 .el-main 是 1.02rem≈53px） ===== */
@media (max-width: 960px) {
  body .el-main {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* ===== 1024yun: 批量续费弹窗移动端适配 20261028 ===== */
@media (max-width: 960px) {
  /* 弹窗本体：92vw + 圆角 */
  .el-dialog.branch-rennew-dialog {
    width: 92vw !important;
    max-width: 92vw !important;
    margin-top: 6vh !important;
    border-radius: 14px !important;
    overflow: hidden !important;
  }
  .branch-rennew-dialog .el-dialog__header { padding: 16px 16px 0 !important; }
  .branch-rennew-dialog .el-dialog__title { font-size: 16px !important; font-weight: 700 !important; }
  .branch-rennew-dialog .el-dialog__body { padding: 12px 16px 4px !important; }
  .branch-rennew-dialog .el-dialog__footer { padding: 0 16px 16px !important; }

  .branch-rennew-dialog .dialag-content .tips-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    margin: 0 0 10px !important;
    text-align: left !important;
  }

  /* 表格 → 卡片 */
  .branch-rennew-dialog .el-table { background: transparent !important; width: 100% !important; }
  .branch-rennew-dialog .el-table::before { display: none !important; }
  .branch-rennew-dialog .el-table__header-wrapper { display: none !important; }
  .branch-rennew-dialog .el-table__body-wrapper { overflow: visible !important; height: auto !important; max-height: none !important; }
  .branch-rennew-dialog .el-table__body,
  .branch-rennew-dialog .el-table__body table,
  .branch-rennew-dialog .el-table__body tbody { display: block !important; width: 100% !important; }

  .branch-rennew-dialog .el-table__body tr,
  .branch-rennew-dialog .el-table__body tr.el-table__row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 12px 12px 10px !important;
    margin-bottom: 10px !important;
    background: #faf9fe !important;
    border: 1px solid #f0eef7 !important;
    border-radius: 12px !important;
  }
  .branch-rennew-dialog .el-table__body td {
    display: block !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    height: auto !important;
    box-sizing: border-box !important;
  }
  .branch-rennew-dialog .el-table__body td .cell { padding: 0 !important; overflow: visible !important; }

  /* 第 1 列：ID */
  .branch-rennew-dialog .el-table__body td:nth-child(1) {
    flex: 0 0 auto !important;
    font-size: 11.5px !important;
    color: #8692b0 !important;
    margin-right: 8px !important;
  }
  /* 第 2 列：产品名 */
  .branch-rennew-dialog .el-table__body td:nth-child(2) {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1e2736 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  /* 第 3 列：周期选择 */
  .branch-rennew-dialog .el-table__body td:nth-child(3) {
    flex: 0 0 100% !important;
    margin-top: 10px !important;
  }
  .branch-rennew-dialog .el-table__body td:nth-child(3) .el-select { width: 100% !important; }
  .branch-rennew-dialog .el-table__body td:nth-child(3) .el-input__inner {
    height: 38px !important;
    line-height: 38px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    background: #fff !important;
    border: 1px solid #e9e5f7 !important;
  }
  /* 第 4 列：单价 */
  .branch-rennew-dialog .el-table__body td:nth-child(4) {
    flex: 0 0 100% !important;
    margin-top: 6px !important;
    text-align: right !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #f97316 !important;
  }

  /* 合计 */
  .branch-rennew-dialog .dialag-content .total-price {
    display: flex !important;
    align-items: baseline !important;
    justify-content: space-between !important;
    font-size: 13px !important;
    color: #5a6478 !important;
    padding: 10px 2px 4px !important;
    margin: 0 !important;
  }
  .branch-rennew-dialog .dialag-content .total-price .pay-money { font-size: 20px !important; font-weight: 800 !important; color: #f97316 !important; }

  /* 底部按钮整行 */
  .branch-rennew-dialog .dialog-footer { display: flex !important; flex-direction: column !important; gap: 8px !important; }
  .branch-rennew-dialog .dialog-footer .el-button {
    width: 100% !important;
    height: 42px !important;
    line-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 21px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
  }
  .branch-rennew-dialog .dialog-footer .el-button--primary {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(249, 115, 22, .28) !important;
  }
  .branch-rennew-dialog .dialog-footer .el-button:not(.el-button--primary) {
    background: #f4f2fb !important;
    border: none !important;
    color: #5a6478 !important;
  }

  /* 二次确认弹窗也适配宽度 */
  .el-dialog.branch-confirm-dialog {
    width: 84vw !important;
    max-width: 84vw !important;
    border-radius: 14px !important;
  }
  .branch-confirm-dialog .dialog-footer { display: flex !important; gap: 8px !important; }
  .branch-confirm-dialog .dialog-footer .el-button { flex: 1 !important; height: 40px !important; border-radius: 20px !important; margin: 0 !important; }
}

/* ===== 1024yun 修复：批量续费弹窗内表格列宽撑破 ===== */
@media (max-width: 960px) {
  .branch-rennew-dialog .el-dialog__body { overflow-x: hidden !important; }
  .branch-rennew-dialog .el-table { overflow: hidden !important; width: 100% !important; }
  /* 干掉 colgroup 的固定列宽 */
  .branch-rennew-dialog .el-table colgroup,
  .branch-rennew-dialog .el-table__body colgroup { display: none !important; }
  .branch-rennew-dialog .el-table__body table {
    table-layout: auto !important;
    width: 100% !important;
    display: block !important;
  }
  .branch-rennew-dialog .el-table__body td {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-basis: auto !important;
  }
  /* 重新声明各列弹性 */
  .branch-rennew-dialog .el-table__body td:nth-child(1) { flex: 0 0 auto !important; }
  .branch-rennew-dialog .el-table__body td:nth-child(2) { flex: 1 1 0 !important; min-width: 0 !important; }
  .branch-rennew-dialog .el-table__body td:nth-child(3) { flex: 0 0 100% !important; max-width: 100% !important; }
  .branch-rennew-dialog .el-table__body td:nth-child(4) { flex: 0 0 100% !important; max-width: 100% !important; }
  /* 底部按钮不被撑出 */
  .branch-rennew-dialog .el-dialog__footer { width: 100% !important; box-sizing: border-box !important; }
  .branch-rennew-dialog .dialog-footer { width: 100% !important; box-sizing: border-box !important; }
  .branch-rennew-dialog .dialog-footer .el-button { box-sizing: border-box !important; max-width: 100% !important; }
  /* 合计行 */
  .branch-rennew-dialog .dialag-content .total-price { width: 100% !important; box-sizing: border-box !important; flex-wrap: wrap !important; }
}

/* ===== 1024yun 修复：弹窗 class 实际在 wrapper 上，宽度选择器要改 ===== */
@media (max-width: 960px) {
  /* 真正生效：wrapper 内的 .el-dialog */
  .branch-rennew-dialog .el-dialog {
    width: 92vw !important;
    max-width: 92vw !important;
    margin-top: 6vh !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 14px !important;
    overflow: hidden !important;
  }
  .branch-rennew-dialog .el-dialog__body { padding: 12px 16px 4px !important; box-sizing: border-box !important; width: 100% !important; }
  .branch-rennew-dialog .el-dialog__header { padding: 16px 16px 0 !important; }
  .branch-rennew-dialog .el-dialog__footer { padding: 0 16px 16px !important; box-sizing: border-box !important; width: 100% !important; }

  .branch-confirm-dialog .el-dialog {
    width: 84vw !important;
    max-width: 84vw !important;
    border-radius: 14px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ===== 1024yun: 批量续费弹窗移动端列表 20261028 ===== */
.m-renew-list { display: none; }

@media (max-width: 960px) {
  /* 隐藏原表格，显示移动列表 */
  .branch-rennew-dialog .pc-renew-table { display: none !important; }
  .branch-rennew-dialog .m-renew-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }
  .branch-rennew-dialog .m-renew-item {
    background: #faf9fe !important;
    border: 1px solid #f0eef7 !important;
    border-radius: 12px !important;
    padding: 11px 12px !important;
    box-sizing: border-box !important;
  }
  .branch-rennew-dialog .m-r-top {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
  }
  .branch-rennew-dialog .m-r-id {
    flex: 0 0 auto !important;
    font-size: 11.5px !important;
    color: #8692b0 !important;
  }
  .branch-rennew-dialog .m-r-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1e2736 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .branch-rennew-dialog .m-r-mid {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 9px !important;
  }
  .branch-rennew-dialog .m-r-sel { flex: 1 1 auto !important; min-width: 0 !important; }
  .branch-rennew-dialog .m-r-sel .el-input__inner {
    height: 36px !important;
    line-height: 36px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    background: #fff !important;
    border: 1px solid #e9e5f7 !important;
  }
  .branch-rennew-dialog .m-r-price {
    flex: 0 0 auto !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #f97316 !important;
    white-space: nowrap !important;
  }
}

/* ===== 1024yun 修复：批量续费弹窗按钮主次样式被 :not() 抢掉 ===== */
@media (max-width: 960px) {
  /* 主按钮：橙色（含 disabled / loading 态） */
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary,
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary:hover,
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary:focus,
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary.is-disabled,
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary.is-disabled:hover,
  .branch-rennew-dialog .dialog-footer .el-button.el-button--primary.is-loading {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    border: none !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 3px 10px rgba(249, 115, 22, .28) !important;
  }
  /* 次按钮：浅灰紫 */
  .branch-rennew-dialog .dialog-footer .el-button:not(.el-button--primary),
  .branch-rennew-dialog .dialog-footer .el-button:not(.el-button--primary):hover {
    background: #f4f2fb !important;
    border: none !important;
    color: #5a6478 !important;
  }
  /* 二次确认弹窗同样处理 */
  .branch-confirm-dialog .dialog-footer .el-button.el-button--primary {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    border: none !important;
    color: #fff !important;
  }
}

/* ===== 1024yun: 批量续费弹窗按钮改用专属类，规避 Element 状态类干扰 ===== */
@media (max-width: 960px) {
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok:hover,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok:focus,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok.is-disabled,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok.is-disabled:hover,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-ok.is-loading {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    border: none !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 3px 10px rgba(249, 115, 22, .28) !important;
  }
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-cancel,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-cancel:hover,
  .branch-rennew-dialog .dialog-footer .el-button.m-renew-cancel:focus {
    background: #f4f2fb !important;
    border: none !important;
    color: #5a6478 !important;
    opacity: 1 !important;
  }
}

/* ===== 1024yun: 弹窗按钮用位置定位，不依赖新增类名（防止组件 JS 被缓存） ===== */
@media (max-width: 960px) {
  .branch-rennew-dialog .dialog-footer > .el-button:first-child,
  .branch-rennew-dialog .dialog-footer > .el-button:first-child:hover,
  .branch-rennew-dialog .dialog-footer > .el-button:first-child:focus,
  .branch-rennew-dialog .dialog-footer > .el-button:first-child.is-disabled,
  .branch-rennew-dialog .dialog-footer > .el-button:first-child.is-loading,
  .branch-rennew-dialog .dialog-footer > .el-button:first-child.el-button--primary {
    background: linear-gradient(120deg, #f97316, #fb923c) !important;
    background-color: #f97316 !important;
    border: none !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 3px 10px rgba(249, 115, 22, .28) !important;
  }
  .branch-rennew-dialog .dialog-footer > .el-button:first-child span { color: #fff !important; }

  .branch-rennew-dialog .dialog-footer > .el-button:last-child,
  .branch-rennew-dialog .dialog-footer > .el-button:last-child:hover,
  .branch-rennew-dialog .dialog-footer > .el-button:last-child:focus {
    background: #f4f2fb !important;
    background-color: #f4f2fb !important;
    border: none !important;
    color: #5a6478 !important;
    opacity: 1 !important;
  }
  .branch-rennew-dialog .dialog-footer > .el-button:last-child span { color: #5a6478 !important; }
}

/* ===== 1024yun: 首页产品卡片整卡可点 + 反馈 ===== */
@media (max-width: 960px) {
  .home-main .product-list-box .el-table__body tr {
    cursor: pointer !important;
    transition: transform .12s ease, box-shadow .12s ease !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  .home-main .product-list-box .el-table__body tr:active {
    transform: scale(.985) !important;
    box-shadow: 0 1px 4px rgba(27, 18, 56, .1) !important;
  }
  .home-main .product-list-box .el-table__body td,
  .home-main .product-list-box .el-table__body td .cell,
  .home-main .product-list-box .product-name { cursor: pointer !important; }
}

/* ===== 1024yun: 移动端禁止横向滚动（只能上下滑） ===== */
@media (max-width: 960px) {
  html {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
    position: relative !important;
  }
  /* Element 容器也锁横向 */
  .el-container,
  .el-main,
  .el-aside,
  .home-main,
  .main-card {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }
  /* 图片/表格不撑破 */
  img, table, video, iframe, pre {
    max-width: 100% !important;
  }
  /* 常见溢出源 */
  .el-row, .el-col, .el-card, .el-table {
    max-width: 100% !important;
  }
}

/* ===== 1024yun: 修正 —— 用 clip 代替 hidden，恢复原生滚动流畅度 ===== */
@media (max-width: 960px) {
  html {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }
  body {
    overflow-x: clip !important;
    overflow-y: visible !important;
    position: static !important;
    -webkit-overflow-scrolling: touch;
  }
  /* 恢复容器的正常溢出行为（不拦截滚动） */
  .el-container, .el-main, .el-aside,
  .home-main, .main-card {
    overflow-x: visible !important;
    overflow-y: visible !important;
  }
}

/* ===== 2026-10-28 修复：idc-brand.css 加了 :not(:has(.home-main)) 后
   优先级升到 (0,2,1)，压过了本文件原来的 (0,1,1) 移动端覆盖。
   这里用同等权重重新声明，让移动端顶栏/侧栏回到正确状态。 ===== */
@media (max-width: 960px) {
  /* 顶栏：压回顶部 + 深紫渐变（原被 idc-brand.css 的 top:58px + 白底压住） */
  body:not(:has(.home-main)) .el-header {
    top: 0 !important;
    background: linear-gradient(120deg, #1b1238 0%, #2a1a56 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
  }
  /* 侧边栏：同样压回顶部 */
  body:not(:has(.home-main)) .el-aside {
    top: 0 !important;
    height: auto !important;
  }
  /* 内容区：让出 64px 顶栏 */
  body:not(:has(.home-main)) .el-main {
    margin-top: 64px !important;
  }
}

/* ===== 2026-10-28 修复2：idc-brand.css 在 header 中后加载，
   同权重时后者胜。这里用 html 前缀把权重抬到 (0,2,2) 压过它。 ===== */
@media (max-width: 960px) {
  html body:not(:has(.home-main)) .el-header {
    top: 0 !important;
    background: linear-gradient(120deg, #1b1238 0%, #2a1a56 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
  }
  html body:not(:has(.home-main)) .el-aside {
    top: 0 !important;
    height: auto !important;
  }
  html body:not(:has(.home-main)) .el-main {
    margin-top: 64px !important;
  }
}