/**
 * 职责：响应式断点层（覆盖 style.css 红金设计系统在平板/手机下的布局）
 * 设计基为弹性（全宽容器 + flex/grid），本文件处理：汉堡导航、卡片堆叠、表格转卡片
 */

/* ---------- 平板及窄屏 <=1024 ---------- */
@media (max-width: 1024px) {
  /* 顶部搜索两栏合一 */
  .top_select{grid-template-columns:1fr}
  .top_select_down{grid-column:auto}
  /* 首页左右栏收窄 */
  .index_content_01_left{width:100%;flex-basis:100%}
  .index_content_01_right{width:100%;flex-basis:100%}
  /* 优势条 2 列 */
  .adv_bar{grid-template-columns:repeat(2,1fr)}
  /* cms 三栏收为两栏 */
  .cms{grid-template-columns:1fr 1fr}
}

/* ---------- 手机 <=768 ---------- */
@media (max-width: 768px) {
  body{font-size:13px}

  /* 顶部头 */
  .top_inside{flex-wrap:wrap;justify-content:center}
  .top_title{text-align:center}
  .top_logo{z-index:60}

  /* 导航：横版可滑动按钮条 */
  .nav-toggle{display:none}
  .nav_right{display:none}
  .nav_inner{overflow:hidden}
  .top_list{flex:1 1 auto;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .top_list::-webkit-scrollbar{display:none}
  .top_list ul{flex-direction:row;gap:8px;padding:10px 2px}
  .top_list ul li{flex:0 0 auto}
  .top_list ul li a,.top_list ul li a:link{display:block;white-space:nowrap;line-height:34px;height:34px;padding:0 16px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--ink)}
  .top_list ul li a.on,.top_list ul li a:active.on{border-color:var(--red);background:linear-gradient(135deg,var(--red),var(--red-deep));color:#fff}

  /* 搜索区堆叠 */
  .top_select_top form{width:100%}
  .top_select_top{padding:10px}
  .ts-input{width:110px}.ts-input-s{width:70px}

  /* 首页分区全宽堆叠 */
  .index_content_01,.index_content_02,.index_content_03{margin-top:12px;gap:12px}
  .index_content_01_mid,.index_content_01_right{flex-basis:100%}
  .adv_bar{grid-template-columns:1fr 1fr;gap:10px}
  .adv_item{padding:12px 10px}
  .adv_item .adv_icon{width:38px;height:38px;font-size:17px}

  /* 特号、列表、二栏全宽 */
  .tj_shop{flex-basis:100%}
  .tj_shop_right{width:100%}
  /* 手机端精选特号专区：2 列大卡片，号码完整可读 */
  .tj_shop_content_show_all{grid-template-columns:repeat(2,1fr);gap:10px}
  .tj_shop_content_show .shop_title a{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .tj_shop_content_show .shop_hf{font-size:12px;line-height:1.7}
  .tj_shop_content_show .shop_hf .red{font-size:13px}
  .show_left,.show_right{flex-basis:100%;min-width:0}
  .cms{grid-template-columns:1fr;gap:12px}
  .shop_left,.shop_right,.shop_right{flex-basis:100%;width:100%}
  .news_left,.news_right{max-width:100%}
  .news_left + .news_right,.news_right{flex-basis:100%;width:100%}

  /* 表格转卡片（既有 row 转卡片机制） */
  .resp-table thead{display:none}
  .resp-table tr{display:block;background:#fff;border:1px solid var(--line);margin:8px 2px;border-radius:8px;padding:6px}
  .resp-table td{display:block;border:0;text-align:left;padding:4px 8px}
  .resp-table td:before{content:attr(data-label) "：";color:#7a5a12;font-weight:700;margin-right:6px}
  .resp-table td.tbl-none:before{content:""}
  /* 首页最新/推荐：2排卡片，订购居右、价格紧跟号码 */
  .show_content .resp-table tr{display:grid;grid-template-columns:max-content auto auto;grid-template-areas:"num price ord" "brand fee ord";column-gap:8px;row-gap:2px;align-items:center;background:#fff;border:1px solid var(--line);margin:8px 2px;border-radius:8px;padding:8px 10px}
  .show_content .resp-table td:before{content:""}
  .show_content .resp-table td[data-label="号码"]{grid-area:num;font-size:15px;white-space:nowrap}
  .show_content .resp-table td[data-label="价格"]{grid-area:price;color:var(--red);font-weight:700;white-space:nowrap}
  .show_content .resp-table td[data-label="品牌"]{grid-area:brand;font-size:12px;color:var(--gray);white-space:nowrap}
  .show_content .resp-table td[data-label="话费"]{grid-area:fee;font-size:12px;color:var(--gray)}
  .show_content .resp-table td[data-label="话费"]:before{content:"话费：\A";white-space:pre;font-weight:700;color:#7a5a12}
  .show_content .resp-table td[data-label="话费"]:after{content:""}
  .show_content .resp-table td.tbl-none{grid-area:ord;grid-row:1/3;text-align:center}
  /* shop.php 列表：三排紧凑卡片，取消编号，订购按钮在话费后/状态下 */
  .shop-list tr{display:grid;grid-template-columns:max-content auto auto;grid-template-areas:"num price status" "brand fee ord";column-gap:10px;row-gap:4px;align-items:center;padding:7px 9px}
  .shop-list td:before{content:""}
  .shop-list td[data-label="编号"]{display:none}
  .shop-list td[data-label="号码"]{grid-area:num;font-size:15px;white-space:nowrap}
  .shop-list td[data-label="价格"]{grid-area:price;color:var(--red);font-weight:700;white-space:nowrap}
  .shop-list td[data-label="状态"]{grid-area:status;font-size:12px;white-space:nowrap}
  .shop-list td[data-label="品牌"]{grid-area:brand;font-size:12px;color:var(--gray);white-space:nowrap}
  .shop-list td[data-label="话费"]{grid-area:fee;font-size:12px;color:var(--gray);white-space:nowrap}
  .shop-list td.tbl-none{grid-area:ord;text-align:left;padding-left:2px}

  /* 表单 */
  .form-tbl .ipt,.form-tbl textarea.ipt{width:100%;box-sizing:border-box}
  .captcha-img{height:34px;width:auto}

  /* 选号面板：左侧标签顶置 */
  .findcondcont .list{flex-wrap:wrap;gap:4px}
  .findcondcont .list .left{flex-basis:100%}

  /* 轮播圆点居中 */
  .slider .dots{bottom:8px}
}

/* ===== 手机端底部悬浮菜单（<768px）：圆形渐变图标徽章，品牌区分配色 ===== */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:1300;display:none;background:rgba(255,255,255,.97);backdrop-filter:blur(6px);border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(0,0,0,.12);grid-template-columns:repeat(5,1fr)}
.mobile-bar .mb-i{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:7px 0 6px;color:#5a5a5a;font-size:11px;text-decoration:none;position:relative}
.mobile-bar .mb-i .mb-ic{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.14);transition:transform .15s}
.mobile-bar .mb-i .mb-ic svg{width:20px;height:20px;color:#fff}
.mobile-bar .mb-i:active .mb-ic{transform:translateY(-2px) scale(1.08)}
/* 首页：金/红渐变 */
.mobile-bar .mb-home .mb-ic{background:linear-gradient(135deg,var(--gold,#d8a220),var(--red-deep))}
.mobile-bar .mb-home em{color:var(--red-deep);font-weight:700}
/* 电信有线：红 */
.mobile-bar .mb-tel .mb-ic{background:linear-gradient(135deg,#f26b5a,#e02a1c)}
/* 联通无线：橙 */
.mobile-bar .mb-net .mb-ic{background:linear-gradient(135deg,#ffb74d,#f57c00)}
/* 移动无线：绿 */
.mobile-bar .mb-wifi .mb-ic{background:linear-gradient(135deg,#7ccf5b,#3f9c2f)}
/* 联系我们：蓝紫主按钮，隔离定位 */
.mobile-bar .mb-contact{color:#fff}
.mobile-bar .mb-contact .mb-ic{width:42px;height:42px;background:linear-gradient(135deg,#5b7cfa,#3b56e0);box-shadow:0 4px 12px rgba(59,86,224,.4)}
.mobile-bar .mb-contact em{color:#3b56e0;font-weight:700}
.mobile-bar .mb-i:hover{background:var(--gold-soft)}

@media (max-width:767px){
  .mobile-bar{display:grid;padding-bottom:env(safe-area-inset-bottom)}
  body{padding-bottom:66px}
  .side-float{display:none}
  .top_contact{display:none}
  /* 弹窗底部抽屉化 */
  .contact-modal{padding:0;align-items:flex-end;justify-content:center}
  .cm-dialog{max-width:100%;border-radius:14px 14px 0 0;padding-bottom:calc(20px + env(safe-area-inset-bottom))}
  /* 号码信息：二维码与价格/尾型/订购同排，其余信息在上方 */
  .num-info{display:grid;grid-template-columns:104px 1fr;grid-template-areas:"num num" "stat stat" "brand brand" "cost cost" "qr price" "qr tail" "qr actions";gap:6px 10px;align-items:center}
  .num-qr{grid-area:qr;justify-self:stretch}
  .num-fields{display:contents}
  .f-num{grid-area:num}
  .f-stat{grid-area:stat}
  .f-brand{grid-area:brand}
  .f-cost{grid-area:cost}
  .f-price{grid-area:price}
  .f-tail{grid-area:tail}
  .f-actions{grid-area:actions}
  .num-qr img{max-width:104px;max-height:104px}
  .num-actions{white-space:normal;line-height:30px}
}
@media (min-width:768px){
  .mobile-bar{display:none}
}

/* ===== 顶部：手机端纵向堆叠 ===== */
@media (max-width:767px){
  .top_meta{display:none}
  .topm_in{flex-direction:column;align-items:stretch;gap:8px;padding:8px 12px}
  .topm_logo{text-align:center}
  .topm_logo img{max-height:90px;margin:0 auto}
  .topm_form{max-width:100%}
  .topm_contact{display:none}
}

/* ===== 首页首屏三栏断点 ===== */
@media (max-width:1024px) and (min-width:768px){
  .hh_side{flex-basis:200px}
  .hh_main .slider{height:280px}
}
@media (max-width:767px){
  .home_hero{flex-direction:column;padding:0}
  .hh_side,.hh_main{flex:1 1 auto;width:100%}
  .hh_main .slider{height:auto;aspect-ratio:640/340}
  .hh_main .slider .slides{height:100%}
  .hh_main .slider .slides li{height:100%}
  .hh_main .slider .slides img{width:100%;height:100%;object-fit:cover}
  /* 手机端隐藏首页附加模块 */
  .adv_bar{display:none}
  .hh_left,.hh_right{display:none}
  .index_content_01 > .tj_shop_right{display:none}
  .cms{display:none}
  /* shop.php：手机端隐藏订单查询模块 */
  .shop_right .order_box{display:none}
  /* 选号面板：四周紧缩、控件同排、减少上下留白 */
  .findcondbox{padding:8px 10px}
  .findcondcont .list{padding:3px 0;line-height:1.5;gap:6px}
  .findcondcont .list .right{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
  .findcondcont .list .right > div{float:none !important;margin:2px 0 !important;width:auto !important}
  .findcondcont .list .right .numbox1{display:none}
  .findcondcont .list .right .numbox input{width:30px;padding:4px 2px;font-size:13px}
  #txtend{width:30px}
  .findcondcont .list .right > div:last-child{margin-left:auto !important}
}

/* ---------- 手机 <=420（小屏微调） ---------- */
@media (max-width: 420px) {
  .adv_bar{grid-template-columns:1fr}
  .ts-input{width:92px}.ts-input-s{width:56px}
  .top_select_top{flex-direction:column;align-items:stretch}
  .findcondcont .list .right .numbox input,.findcondcont .list .right .numbox1 input{width:22px}
}