@charset "utf-8";
/* ============================================================
   列表类页面 · 手机端适配层（唯一可改文件）
   ------------------------------------------------------------
   覆盖页面与皮肤（均为原站 1120px 定宽体系，见各自皮肤文件）：
     1. 优惠列表 /youhui           channel_yh.css
     2. 分类页   /fenlei/x/youhui  list.css
     3. 搜索页   /search           list.css
     4. 发现页   /faxian           found.css
     5. 找券页   /coupon           create_at.css + list.css
   规则同 responsive.css：只写媒体查询覆盖原站类名，
   不动模板、不动皮肤。加载顺序在本文件之前者均会被这里覆盖。
   断点：<=767px 手机；768-1023px 平板（收窄不重排）。
   ============================================================ */

/* ===================== 1. 优惠列表 /youhui（channel_yh.css） ===================== */
@media (max-width: 767px) {
  /* 主容器 1120 定宽改流式（doc/wraper 已由 responsive.css 兜底） */
  .m-main {
    width: auto !important;
    max-width: 100%;
    padding-top: 12px;
  }

  /* --- 热销总榜：定高 224px + 142px 浮动块 → 两列网格 --- */
  .rank-list {
    height: auto !important;
    padding: 12px 0 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 14px;
  }
  .rank-list a {
    float: none !important;
    width: auto !important;
    display: block;
  }
  .rank-list a + a {
    margin-left: 0;
  }
  .rank-list li img {
    width: 100%;
    height: auto;
  }
  /* 轮播箭头绝对定位在容器外侧，手机上溢出，直接隐藏 */
  .slide-pic .prev,
  .slide-pic .next {
    display: none;
  }

  /* --- 筛选条：dt 定宽 90 + dd 定高 41 只露一行 → 全部展开可换行 --- */
  .category .item {
    padding-right: 0;
  }
  .category .item dt {
    float: none;
    width: auto;
    padding-left: 30px;
    line-height: 40px;
    font-size: 15px;
  }
  .category .item dt::before {
    top: 9px;
  }
  .category .item dd {
    height: auto !important;
    padding: 2px 0 8px;
  }
  .category .item .itemWrap {
    margin-top: 0;
  }
  .category .item dd a {
    float: none;
    display: inline-block;
    margin: 3px 8px 3px 0;
    padding: 0 10px;
    font-size: 13px;
    line-height: 30px;
  }
  /* 手机上标签全部平铺，不再需要「更多」展开按钮 */
  .category .btn-more {
    display: none !important;
  }

  /* --- 排序 Tab：定高横排 → 横向滚动条 --- */
  .proList .hotNav {
    height: auto;
    padding-top: 10px;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .proList .hotNav::-webkit-scrollbar {
    display: none;
  }
  .proList .hotNav a,
  .proList .hotNav span {
    font-size: 15px;
    padding: 0 12px;
    margin-right: 10px;
    line-height: 32px;
  }

  /* --- 商品卡：192px 定宽浮动 5 列 → 两列网格 --- */
  .proList .proWrap ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-left: none;
  }
  .proList .proWrap li {
    width: auto !important;
    float: none !important;
    height: auto !important;
    padding: 10px;
    box-sizing: border-box;
  }
  .proList .proWrap li:nth-child(5n) {
    margin-left: 0;
  }
  .proList .proWrap .picWrap {
    width: 100%;
    height: auto;
  }
  .proList .proWrap .picWrap img {
    width: 100%;
    height: auto;
  }
  .proList .proWrap em {
    font-size: 14px;
    line-height: 20px;
    height: 40px;
  }
  .proList .proWrap .brief {
    -webkit-line-clamp: 2;
    max-height: 44px;
    line-height: 22px;
    margin-bottom: 10px;
  }
  .proList .proWrap .info {
    padding-right: 0;
  }
  /* 购买按钮从绝对定位改为通栏，保证 32px 以上触摸目标 */
  .proList .proWrap .btn-buy {
    position: static;
    display: block;
    width: 100%;
    height: 32px;
    line-height: 32px;
    margin-top: 6px;
  }
  .proList .proWrap .mall-tag {
    top: 10px;
    left: 10px;
  }
}

/* ===================== 2. 分类页 / 搜索页（list.css 横卡列表） ===================== */
@media (max-width: 767px) {
  /* 面包屑条 1120 定宽 */
  .tips-wrap {
    width: auto !important;
    box-sizing: border-box;
  }
  /* 分类下拉 480 定宽，窄屏收住防溢出 */
  .sort-sel .opts {
    width: auto;
    max-width: 86vw;
    box-sizing: border-box;
  }
  .sort-sel-block label {
    width: auto;
    min-width: 0;
    margin: 5px 0 0 10px;
    float: none;
    display: inline-block;
  }

  /* --- 横卡：图 190 定宽 + 文字 600 定宽 → 图缩小、文字流式 --- */
  .art {
    padding: 14px 0;
  }
  .art-pic {
    width: 110px !important;
    margin-right: 10px;
  }
  .art-pic img {
    width: 110px;
    height: 110px;
  }
  .art-txt {
    float: none !important;
    display: block !important; /* 原皮肤 display:inline，必须先块化才能收窄 */
    width: auto !important;
    overflow: hidden; /* BFC：文字区贴着左浮动图排布 */
  }
  .art-wrap {
    min-height: 0;
  }
  .art-hd {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 6px;
  }
  .art-hd .title {
    font-size: 16px;
    line-height: 24px;
  }
  .art .art-pre {
    height: auto;
  }
  /* 查看详情原样式 margin-left:530px 会顶出屏幕 */
  .art .art-btn {
    float: right;
    margin-left: 0;
  }
  /* 底部工具条：赞踩收藏 + 去购买 */
  .art-stat {
    width: auto !important;
    max-width: 65%;
  }
  .art-stat .btn {
    margin-right: 12px;
    padding-left: 19px;
  }
  .art-link {
    float: right !important;
  }
  .art-link .btn {
    width: 83px;
    padding-left: 10px;
    text-align: center;
  }

  /* --- 找券页表单（create_at.css）：748 定宽文本域 → 通栏 --- */
  .form-group textarea {
    width: 100% !important;
    height: 120px;
    padding: 10px;
    box-sizing: border-box;
  }
  .form-group .txts-input {
    width: 100% !important;
  }
  .form-group-submit {
    width: auto !important;
    margin-top: 0;
    text-align: center;
  }
  .form-group .btn-submit {
    width: 100%;
    height: 40px;
    line-height: 40px;
    margin: 0;
    font-size: 15px;
  }
  /* 空态提示 */
  .empty {
    height: auto;
    padding: 40px 0;
    font-size: 14px;
  }
  /* 分页按钮换行，不挤压 */
  .pager {
    height: auto;
    white-space: normal;
  }
  .pager a, .pager i, .pager span {
    margin-bottom: 6px;
  }
}

/* ===================== 3. 发现页 /faxian（found.css） ===================== */
@media (max-width: 767px) {
  /* --- 顶部运营位：4 个 220 方块 + 200 侧块 → 2 列网格 --- */
  .top-coupon-box {
    height: auto;
    padding: 10px 0;
  }
  .top-coupon-box .wraper {
    height: auto !important;
    position: static;
    background: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .top-coupon-box .coupon-block {
    float: none !important;
    min-width: 0;
    width: auto !important;
    height: 110px;
    margin: 0 !important;
    overflow: hidden;
  }
  /* found.css 里 .coupon-block img 定宽 220px 特异性高于全局 img 兜底，
     会把网格单元格撑爆 → 必须在此按同特异性压回 */
  .top-coupon-box .coupon-block img {
    width: 100%;
    height: 110px;
    object-fit: cover;
  }
  /* display:contents 让右栏两个小块直接并入上方网格 */
  .top-coupon-box .right-ad {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    display: contents;
  }

  /* --- 发现好物列表：220 定宽浮动 → 两列网格 --- */
  .box-found-page {
    margin-top: 20px;
  }
  .box-found-page .bd {
    width: auto !important;
    min-height: 0;
  }
  .found-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .found-list .item {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 12px;
    border: 1px solid #ececec !important; /* 网格带间隙，补全四边框 */
    box-sizing: border-box;
  }
  .found-list .item img {
    width: 100%;
    height: auto;
    margin-bottom: 8px;
  }
  .found-list .item .mall-tag {
    top: 12px;
    left: 12px;
  }
  .found-list .item .title {
    font-size: 14px;
    line-height: 20px;
    height: 40px;
  }
  .found-list .item .price {
    width: auto;
    max-width: calc(100% - 95px); /* 给右侧「去看看」留位 */
    font-size: 15px;
  }
  /* 筛选头：排序 + 电商下拉收窄间距 */
  .box-found-page .hd .mark-sub a {
    margin-left: 10px;
  }
  .box-found-page .mail-drop {
    margin-right: 12px;
    margin-left: 5px;
  }
}

/* ===================== 4. 平板收窄（768-1023，不重排） ===================== */
@media (min-width: 768px) and (max-width: 1023px) {
  .m-main,
  .tips-wrap,
  .box-found-page .bd {
    width: auto !important;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* 优惠列表：5 列改 4 列等比收窄 */
  .proList .proWrap ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-left: none;
  }
  .proList .proWrap li {
    width: auto !important;
    float: none !important;
    height: auto !important;
    padding: 12px;
    box-sizing: border-box;
  }
  .proList .proWrap li:nth-child(5n) {
    margin-left: 0;
  }
  .proList .proWrap .picWrap {
    width: 100%;
    height: auto;
  }
  .proList .proWrap .picWrap img {
    width: 100%;
    height: auto;
  }

  /* 运营位：4 方块一行 + 侧块并排 */
  .top-coupon-box {
    height: auto;
    padding-bottom: 10px;
  }
  .top-coupon-box .wraper {
    height: auto !important;
    position: static;
    background: none;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .top-coupon-box .coupon-block {
    float: none !important;
    width: calc(25% - 8px) !important;
    height: 150px;
    margin: 0 !important;
  }
  .top-coupon-box .right-ad {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    display: flex;
    gap: 10px;
  }
  .top-coupon-box .right-ad a {
    flex: 1;
  }

  /* 发现好物：4 列 */
  .found-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
  }
  .found-list .item {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 15px;
    border: 1px solid #ececec !important;
    box-sizing: border-box;
  }
  .found-list .item img {
    width: 100%;
    height: auto;
  }

  /* 横卡文字区流式，图稍大 */
  .art-pic {
    width: 150px !important;
  }
  .art-pic img {
    width: 150px;
    height: 150px;
  }
  .art-txt {
    width: auto !important;
    overflow: hidden;
  }
  .art .art-btn {
    float: right;
    margin-left: 0;
  }

  /* 找券表单通栏 */
  .form-group textarea {
    width: 100% !important;
    box-sizing: border-box;
  }
  .form-group-submit {
    width: auto !important;
  }
}