/* =========================================================
   桌面端适配：全屏自适应
   - ≥768px  ：商品区流式网格铺满屏幕，内容条/详情页限宽居中
   - ≥1280px ：显示顶部导航（隐藏底栏），网格列数随宽度自适应
   - ≥1656px ：超宽屏下全部内容收敛到 1600px 居中，蓝头保持全宽
   手机端（<768px）不受本文件影响
   ========================================================= */

/* 桌面端页面底色改回白色，内容直接铺满，不再是居中面板 */
html, body { background: #fff; }

/* 底部悬浮条居中锚点 */
.tabbar, .pay-bar {
  left: 0; right: 0;
  margin-left: auto; margin-right: auto;
}

/* 顶部导航：手机/平板默认隐藏，仅 >=1280px 显示 */
.desktop-nav { display: none; }

/* ---------- 平板 / 小屏电脑（>=768px）：流式铺满 ---------- */
@media (min-width: 768px) {

  /* 解除手机端 body 限宽，全屏自适应铺满 */
  body { max-width: 100%; }

  /* 商品网格：列数随宽度自动适应，铺满全屏 */
  .goods-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
    padding: 16px 20px 90px;
  }
  /* 商品列表：宽卡片流式两列/三列 */
  .goods-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 14px;
    padding: 16px 20px 90px;
  }

  /* 首页各内容条：全宽通栏，仅加左右留白 */
  .home-head, .notice-bar, .cat-bar, .sort-bar {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* 内容型页面限宽居中，阅读舒适 */
  .detail-wrap, .mine-wrap, .order-wrap, .container {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
  }
  .chat-page {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
  }
  .pay-bar { max-width: 900px; }

  /* 桌面端：显示轮播左右切换按钮（鼠标无法滑动） */
  .g-nav {
    display: flex; align-items: center; justify-content: center;
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.88); color: #1f2733; cursor: pointer;
    box-shadow: 0 2px 12px rgba(15,23,42,.18); z-index: 5; padding: 0;
    transition: background .15s, transform .15s;
  }
  .g-nav:hover { background: #fff; transform: translateY(-50%) scale(1.06); }
  .g-nav.prev { left: 16px; }
  .g-nav.next { right: 16px; }

  .float-service { right: 22px; bottom: 26px; }
  .modal-mask .modal, .dlg { max-width: 600px; }
  #mGuest .mbox { max-width: 600px; }
}

/* ---------- 标准桌面（>=1280px）：顶部导航 + 更宽网格 ---------- */
@media (min-width: 1280px) {

  .tabbar { display: none; }        /* 桌面端改用顶部导航 */
  .navbar { display: none; }        /* 隐藏移动端返回栏 */
  .float-service { right: 30px; bottom: 30px; }

  /* 顶部导航：全宽通栏 */
  .desktop-nav {
    display: block;
    position: sticky; top: 0; z-index: 80;
    background: #fff;
    box-shadow: 0 1px 0 rgba(20,30,60,.06), 0 6px 20px rgba(20,30,60,.05);
  }
  .dn-inner {
    max-width: 1600px; margin: 0 auto; height: 60px;
    display: flex; align-items: center; gap: 18px; padding: 0 28px;
  }
  .dn-brand { display: flex; align-items: center; gap: 10px; flex: none; }
  .dn-logo {
    width: 34px; height: 34px; border-radius: 9px;
    background: linear-gradient(135deg,#3b6ef6,#5b8cff); color: #fff;
    font-weight: 800; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
  }
  .dn-name { font-size: 16px; font-weight: 700; color: #1f2733; }
  .dn-tabs { display: flex; align-items: center; gap: 6px; margin-left: 8px; flex: 1; }
  .dn-tabs a {
    position: relative; padding: 8px 14px; border-radius: 10px;
    font-size: 14px; color: #4b5563; text-decoration: none; font-weight: 500;
  }
  .dn-tabs a:hover { background: #f3f6fc; color: #3b6ef6; }
  .dn-tabs a.active { background: #eaf0ff; color: #3b6ef6; font-weight: 700; }
  .dn-tabs a .dn-dot {
    position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px;
    padding: 0 4px; border-radius: 9px; background: #e8352e; color: #fff;
    font-size: 10px; font-weight: 700; line-height: 16px; text-align: center;
  }
  .dn-help {
    flex: none; padding: 8px 14px; border-radius: 20px; background: #f3f6fc;
    color: #3b6ef6; font-size: 13px; font-weight: 600; text-decoration: none;
  }
  .dn-help:hover { background: #eaf0ff; }

  /* 商品区：网格铺满，列数随宽度自适应 */
  .goods-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 18px;
    padding: 20px 28px 60px;
  }
  .goods-list {
    grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
    gap: 16px;
    padding: 20px 28px 60px;
  }
  .home-head, .notice-bar, .cat-bar, .sort-bar {
    padding-left: 28px;
    padding-right: 28px;
  }

  /* 详情页：限宽居中，轮播图定高，避免超大图 */
  .detail-wrap, .container { max-width: 1040px; }
  .pay-bar { max-width: 1040px; }
  .gallery .swiper img { aspect-ratio: auto; height: auto; max-height: 520px; object-fit: contain; }
}

/* ---------- 超宽屏（>=1656px）：内容收敛 1600px 居中 ---------- */
@media (min-width: 1656px) {
  .goods-grid, .goods-list {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
  }
  .notice-bar, .cat-bar, .sort-bar {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
  }
  /* 蓝色头部保持全宽通栏，内容居中 */
  .home-head {
    padding-left: calc((100% - 1600px) / 2 + 28px);
    padding-right: calc((100% - 1600px) / 2 + 28px);
  }
}
