.gm-bar { display: none; }

/**
 * 快速指南页 —— 手机端版式（对齐原站 H5 QuickGuide）
 * 只在窄屏生效，PC 端不受影响。
 */

@media (max-width: 820px) {

  /* ---------- 页面底色（原站手机端为白，避免页脚上方出现灰色块） ---------- */
  /* ---------- 外壳宽度 ---------- */
  .gtpow-pc .container,
  .gtpow-pc .gtpow-frame-main {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* ---------- 二级导航：App 名 + 下载按钮 ---------- */
  .down_nav .detail-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
    padding: 0 14px;
    background: #fff;
  }
  .down_nav .detail-nav .left,
  .down_nav .detail-nav h1 { font-size: 22px !important; font-weight: 700; margin: 0 !important; }
  .down_nav .detail-nav .right { display: flex; align-items: center; gap: 10px; }
  .down_nav .detail-nav .rightLists { display: none !important; }
  .down_nav .detail-nav .btn-link a { display: inline-block; padding: 10px 18px; border-radius: 6px; }

  /* ---------- 两级下拉筛选条 ---------- */
  .gm-bar {
    display: flex;
    align-items: stretch;
    background: #f4f4f4;
    border-bottom: 1px solid #e6e6e6;
  }
  .gm-cell { position: relative; flex: 1 1 0; min-width: 0; border-right: 1px solid #e6e6e6; }
  .gm-cell:last-child { border-right: 0; }
  .gm-cell select {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    padding: 20px 40px 20px 16px;
    font-size: 17px;
    color: #111;
    background: transparent;
    border: 0;
    outline: 0;
    font-family: inherit;
  }
  .gm-chev {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #111;
    pointer-events: none;
  }

  /* ---------- 左侧目录隐藏，内容铺满 ---------- */
  .SupportLeftMenu_supportLeftMenu__VOMP_ { display: none !important; }
  .QuickGuide_quickGuide__YStb4 { padding: 0 !important; background: #fff; }
  .quick-guide { display: block !important; }
  .content-box {
    width: 100% !important;
    max-width: 100% !important;
    padding: 26px 16px 40px !important;
    box-sizing: border-box;
  }
  .content-box .g-sec[hidden] { display: none !important; }
  /* 原站手机端顺序：Tab 条 → 大标题 → 说明 → 图 */
  .content-box .g-sec { display: flex; flex-direction: column; }
  .content-box .g-sec#sec1 .child-box { display: contents; }
  .content-box .g-sec#sec1 .IotComp_iotComp__YE1fm { display: contents; }
  .content-box .g-sec#sec1 .iot-comp { display: contents; }
  .content-box .g-sec#sec1 .title { order: 2; }
  .content-box .g-sec#sec1 .tab-box { order: 1; margin-top: 0; }
  .content-box .g-sec#sec1 .box { order: 3; }

  /* ---------- 标题 ---------- */
  .content-box .title {
    text-align: left !important;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.35;
    color: #111;
    margin: 0 0 18px;
  }

  /* ---------- 1. 三种连接方式 Tab ---------- */
  .content-box .iot-comp .tab-box {
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 22px;
  }
  .content-box .iot-comp .item-box {
    flex: 1 1 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 4px 14px;
    border-bottom: 2px solid transparent;
  }
  .content-box .iot-comp .item-box.active { border-bottom-color: #111; }
  .content-box .iot-comp .item-box .tab-item { font-size: 16px; font-weight: 600; white-space: nowrap; }
  .content-box .iot-comp .item-box .tab-icon { width: 22px; height: 22px; }
  .content-box .iot-comp .desc { font-size: 17px; line-height: 1.75; color: #333; }
  .content-box .iot-comp .video-box { margin-top: 22px; }
  .content-box .iot-comp .video-box video,
  .content-box .iot-comp .video-box img {
    width: 100% !important;
    height: auto !important;
    border-radius: 14px;
    display: block;
  }

  /* ---------- 2. 兼容表 ---------- */
  .content-box .table-box { margin: 0 !important; overflow-x: auto; }
  .content-box table { width: 100% !important; table-layout: auto !important; border-collapse: collapse; }
  .content-box colgroup { display: none; }
  .content-box th,
  .content-box td {
    padding: 16px 8px !important;
    font-size: 16px !important;
    line-height: 1.4;
    white-space: normal !important;
    text-align: left;
    border: 1px solid #ececec;
  }
  .content-box th:not(:first-child),
  .content-box td:not(:first-child) { text-align: center !important; width: 22%; }
  .content-box .circle {
    width: 14px; height: 14px; border-radius: 50%;
    background: #4cc16a; display: inline-block;
  }

  /* ---------- 3. 如何连接 ---------- */
  .content-box .bluetooth-title { font-size: 20px; font-weight: 700; margin: 0 0 14px; }
  .content-box .common-desc { font-size: 17px; line-height: 1.75; color: #333; margin-bottom: 14px; }
  .content-box .step-box { display: block !important; }
  .content-box .step-item { margin-bottom: 24px; width: 100% !important; }
  .content-box .step-img {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 14px;
    overflow: hidden;
    background: #0b0b0b;
  }
  .content-box .step-img img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  .content-box .step-desc { margin-top: 12px; font-size: 16px; line-height: 1.7; color: #333; }
  .content-box .note-box { margin-top: 12px; font-size: 16px; line-height: 1.7; color: #333; }
  .content-box .note { font-weight: 700; }
}

  /* ---------- 顶栏右侧「主页」按钮（原站为汉堡菜单，改为返回主页） ---------- */
  .gm-home {
    display: none;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    padding: 0;
    margin-left: auto;
  }
  .gm-home svg { display: block; color: #fff; }

  @media (max-width: 820px) {
    .gm-home { display: inline-flex; }
    /* 该容器在窄屏被整体隐藏，这里只放行「主页」按钮 */
    .gtpow-frame-header .ef-header-v2-content { position: relative; }
    .ef-header-v2-bar-list {
      display: flex !important;
      align-items: center;
      justify-content: flex-end;
      position: absolute;
      top: 0;
      right: 16px;
      height: 100%;
      font-size: 0;
      line-height: 0;
    }
    .ef-header-v2-bar-search,
    .ef-header-v2-nav-toggle-icon { display: none !important; }
  }

/* ================= 手机端页脚（与首页手机版同一套尺寸） ================= */
.gm-foot { display: none; }

@media (max-width: 820px) {
  .global-footer { display: none !important; }

  .gm-foot {
    display: block;
    margin-top: 46px;
    padding: 0 0 40px;
    background: #141416;
    color: rgba(255, 255, 255, .45);
  }
  .gm-foot .m-foot-brand { display: flex; padding: 28px 20px 14px; }
  .gm-foot .m-foot-brand { height: 72px; box-sizing: border-box; line-height: 30px; }
  .gm-foot .m-foot-brand .site-logo-text {
    color: #fff !important; font-size: 18px !important; font-weight: 700 !important;
    letter-spacing: .6px; line-height: 30px !important; display: inline-block;
  }
  .gm-foot .m-foot-brand img { height: 20px; width: auto; }
  .gm-foot .m-foot-links {
    display: flex; flex-wrap: wrap; align-items: center;
    padding: 0 20px 4px; font-size: 12.5px; line-height: 1.9;
  }
  .gm-foot .m-foot-links a { color: rgba(255, 255, 255, .78); font-weight: 400; }
  .gm-foot .m-foot-links a:not(:last-child)::after {
    content: "|"; margin: 0 8px; color: rgba(255, 255, 255, .42);
  }
  .gm-foot .m-foot-copy {
    margin: 14px 0 0; padding: 0 20px; font-size: 12px; line-height: 1.9;
    color: rgba(255, 255, 255, .32);
  }
}

/* 指南页手机端：留言浮窗贴右下角（本页没有回到顶部按钮） */
@media (max-width: 820px) {
  .WidgetsBottomRight-app-msg {
    position: fixed;
    right: 14px !important;
    bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 30;
  }
  .widgets-app-msg {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
    background: rgba(240, 240, 242, .95) !important;
    color: #111 !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .16) !important;
  }
  .widgets-app-msg-tips { display: none !important; }
}
/* 版权行右侧留出浮窗按钮的位置，避免文字被按钮压住 */
.m-foot-copy { padding-right: 60px; }

/* 素材保护：图片视频不可拖拽、不可长按弹出「存储图像」 */
img, video {
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  user-select: none;
}

/* ================= 指南页语言切换 ================= */
/* PC 用 nav 里自带的 .lang-switch，窄屏改用手写小按钮 */
.gm-lang { display: none; }
@media (max-width: 820px) {
  .gm-lang {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    padding: 0 8px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.32);
    color: #fff;
    font-size: 12px;
    line-height: 1;
    text-decoration: none;
  }
  /* 窄屏隐藏 nav 自带的语言开关，避免和 gm-lang 重复 */
  .lang-switch { display: none !important; }
  .ef-header-v2-bar-list { gap: 12px !important; }
}

/* 英文三标签较长：窄屏缩小字号与间距，保证三个都完整显示 */
@media (max-width: 820px) {
  .content-box .iot-comp .tab-box { gap: 6px; padding: 0 2px; justify-content: space-between; }
  .content-box .iot-comp .item-box { min-width: 0; gap: 5px; padding: 10px 2px 14px; }
  .content-box .iot-comp .item-box .tab-item { font-size: 12px; letter-spacing: 0; }
  .content-box .iot-comp .item-box .tab-icon { width: 18px; height: 18px; flex: 0 0 auto; }
}
