/* ================================================================
   mf101 官网 — 手机端兼容补丁（仅 @media，不影响 PC）
   加载顺序：放在 redesign.css / redesign-bridge.css 之后
   ================================================================ */

@media (max-width: 768px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100vw;
  }

  body.rd .container,
  .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
  }

  /* 表格横向滚动，避免撑破视口（云产品套餐表走卡片布局，排除） */
  table:not(.pkg-table),
  .table-responsive,
  .goods-table,
  .config-table,
  .price-table,
  .el-table,
  .order-table {
    display: block;
    width: 100% !important;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .cloud-packages-section .pkg-table-wrap,
  .cloud-packages-section .pkg-table {
    overflow-x: visible !important;
    max-width: 100%;
  }

  img,
  video,
  iframe,
  svg {
    max-width: 100%;
    height: auto;
  }

  /* Hero / banner */
  body.rd .hero,
  body.rd .hero-inner,
  .banner-box,
  .banner-content {
    min-height: 0 !important;
  }

  body.rd .hero h1,
  .banner-box .banner-title,
  .banner-title h1 {
    font-size: 1.65rem !important;
    line-height: 1.25 !important;
    word-break: break-word;
  }

  body.rd .hero p,
  .banner-box .banner-des {
    font-size: 0.95rem !important;
    max-width: 100% !important;
  }

  /* 网格改单列 */
  body.rd .promo-grid,
  body.rd .feature-grid,
  body.rd .card-grid,
  .section-list,
  .index-block {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
  }

  /* Footer 菜单堆叠 */
  .footer-box .section .mid-menu,
  .footer-box .mid-menu-list,
  body.rd .site-footer .cols,
  body.rd .footer-cols {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: column !important;
    gap: 16px !important;
  }

  /* 订购页：配置区与侧栏纵向 */
  .buy-layout,
  .goods-layout,
  .config-wrap,
  .order-main,
  .cloud-buy-main,
  .dcim-buy-main,
  body.rd .buy-shell,
  .f-main,
  .mf-cloud,
  .mf-dcim {
    display: flex !important;
    flex-direction: column !important;
  }

  .buy-aside,
  .order-aside,
  .price-box,
  .config-right,
  .order-right {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    margin-top: 16px;
  }

  /* 固定底栏占满屏宽 */
  .el-footer,
  .footer-bar,
  .buy-footer,
  .sticky-bar,
  .order-footer {
    left: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* 按钮可点区域 */
  .btn,
  .el-button,
  a.btn {
    max-width: 100%;
  }

  /* 隐藏仅 PC 的装饰宽图溢出 */
  .hide-sm {
    display: none !important;
  }
}

@media (max-width: 768px) {
  /* 订购页：侧栏与配置区纵向（覆盖页面级 redesign） */
  body.buy-page .buy-section,
  body.buy-page .order-layout,
  body.cloud-buy .buy-section .f-left,
  body.cloud-buy .buy-section,
  body.dcim-buy .buy-section {
    display: block !important;
  }

  body.buy-page .order-aside,
  body.buy-page .f-right,
  body.buy-page .order-right,
  body.cloud-buy .f-right,
  body.dcim-buy .f-right {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    margin-top: 16px !important;
  }

  body.buy-page .order-cate-chips,
  body.buy-page .order-cate-row {
    flex-wrap: wrap !important;
  }

  body.buy-page .order-cate-chip {
    margin-bottom: 6px;
  }

  body.buy-page table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 640px) {
  body.rd .hero h1,
  .banner-box .banner-title {
    font-size: 1.4rem !important;
  }

  .common-section,
  .section-main {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .package-item,
  .flash-item,
  .promo-card,
  .plan-card {
    width: 100% !important;
    max-width: 100% !important;
  }

  .el-input-number {
    max-width: 100%;
  }
}