/* 998雪糕网 - 完全仿京东APP风格样式
   上传到: /www/wwwroot/hf16998.com/template/mobile/skin/css/eyou.css 最末尾追加 */

/* ===== 基础重置 ===== */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:calc(100vw/3.75)}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Helvetica Neue',Helvetica,Arial,sans-serif;background:#f5f5f5;color:#333;font-size:14px;line-height:1.5}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}

/* ===== 京东红主色 ===== */
:root{--jd-red:#e2231a;--jd-red-dark:#c91623;--jd-bg:#f5f5f5;--jd-white:#fff;--jd-gray:#999;--jd-border:#eee}

/* ===== 顶部搜索栏（完全仿京东）===== */
.jd-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:linear-gradient(135deg,#e2231a 0%,#f5515d 100%);padding:0 12px;height:44px;display:flex;align-items:center;gap:10px}
.jd-header-logo{color:#fff;font-size:16px;font-weight:bold;white-space:nowrap;display:flex;align-items:center;gap:4px}
.jd-header-logo img{width:24px;height:24px;border-radius:4px}
.jd-header-search{flex:1;background:rgba(255,255,255,.95);border-radius:20px;height:32px;display:flex;align-items:center;padding:0 12px;gap:6px}
.jd-header-search input{flex:1;border:none;background:transparent;font-size:13px;color:#333;outline:none;height:100%}
.jd-header-search input::placeholder{color:#999}
.jd-header-search .search-icon{color:#e2231a;font-size:14px}
.jd-header-scan,.jd-header-msg{color:#fff;font-size:18px;padding:4px}
body{padding-top:44px}

/* ===== 首页轮播 ===== */
.jd-banner{width:100%;aspect-ratio:2.5;background:#fff}
.jd-banner img{width:100%;height:100%;object-fit:cover}
.jd-dots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:4px}
.jd-dot{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.5)}
.jd-dot.active{width:12px;background:#fff}

/* ===== 金刚区图标（首页快捷入口）===== */
.jd-icons{display:grid;grid-template-columns:repeat(5,1fr);gap:8px 0;padding:12px 8px;background:#fff}
.jd-icon-item{display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none}
.jd-icon-img{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px}
.jd-icon-name{font-size:11px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center}

/* ===== 频道横条 ===== */
.jd-channels{display:flex;background:#fff;padding:8px 12px;gap:12px;overflow-x:auto}
.jd-channels::-webkit-scrollbar{display:none}
.jd-channel{flex-shrink:0;padding:6px 14px;border-radius:16px;font-size:12px;color:#666;background:#f5f5f5;white-space:nowrap}
.jd-channel.active{background:var(--jd-red);color:#fff}

/* ===== 商品瀑布流（仿京东双列）===== */
.jd-products{padding:8px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;background:var(--jd-bg)}
.jd-card{background:#fff;border-radius:8px;overflow:hidden;position:relative}
.jd-card-img{width:100%;aspect-ratio:1;background:#f8f8f8;position:relative}
.jd-card-img img{width:100%;height:100%;object-fit:cover}
.jd-card-tag{position:absolute;top:0;left:0;background:var(--jd-red);color:#fff;font-size:10px;padding:2px 6px;border-radius:0 0 4px 0}
.jd-card-info{padding:8px}
.jd-card-title{font-size:13px;color:#333;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}
.jd-card-price{color:var(--jd-red);font-size:16px;font-weight:bold}
.jd-card-price small{font-size:11px;font-weight:normal}
.jd-card-price .original{font-size:11px;color:#999;text-decoration:line-through;margin-left:4px;font-weight:normal}
.jd-card-cart{position:absolute;right:8px;bottom:8px;width:28px;height:28px;background:var(--jd-red);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px}

/* ===== 分类页布局（左侧分类+右侧商品）===== */
.jd-category{display:flex;height:calc(100vh - 44px - 50px);background:#fff}
.jd-cate-left{width:85px;background:#f5f5f5;overflow-y:auto}
.jd-cate-item{padding:12px 8px;text-align:center;font-size:12px;color:#666;border-left:3px solid transparent}
.jd-cate-item.active{background:#fff;color:var(--jd-red);border-left-color:var(--jd-red);font-weight:bold}
.jd-cate-right{flex:1;overflow-y:auto;padding:10px}
.jd-cate-title{font-size:14px;font-weight:bold;padding:8px 0;border-bottom:1px solid #eee;margin-bottom:10px}
.jd-cate-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.jd-cate-cell{text-align:center;text-decoration:none}
.jd-cate-cell img{width:60px;height:60px;border-radius:8px;margin:0 auto 6px}
.jd-cate-cell span{font-size:11px;color:#333}

/* ===== 商品详情页 ===== */
.jd-detail-img{width:100%;background:#fff}
.jd-detail-img img{width:100%;max-height:375px;object-fit:contain}
.jd-detail-price{background:#fff;padding:12px;border-bottom:1px solid #eee}
.jd-detail-price .price{color:var(--jd-red);font-size:24px;font-weight:bold}
.jd-detail-price .price small{font-size:14px}
.jd-detail-price .original{color:#999;font-size:12px;text-decoration:line-through;margin-left:8px}
.jd-detail-title{background:#fff;padding:12px;font-size:16px;line-height:1.5}
.jd-detail-info{background:#fff;margin-top:8px;padding:12px}
.jd-detail-info h3{font-size:14px;margin-bottom:10px}
.jd-detail-content{font-size:14px;line-height:1.8;color:#555}
.jd-detail-content img{max-width:100%;margin:8px 0}

/* ===== 底部购买栏 ===== */
.jd-buy-bar{position:fixed;bottom:50px;left:0;right:0;background:#fff;border-top:1px solid #eee;display:flex;align-items:center;padding:8px 12px;gap:10px;z-index:999}
.jd-buy-btn{flex:1;height:40px;background:var(--jd-red);color:#fff;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:bold}

/* ===== 底部Tab导航（完全仿京东）===== */
.jd-tabbar{position:fixed;bottom:0;left:0;right:0;z-index:1000;background:#fff;border-top:1px solid #eee;display:flex;height:50px;padding-bottom:env(safe-area-inset-bottom)}
.jd-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none}
.jd-tab-icon{font-size:22px;line-height:1}
.jd-tab-label{font-size:10px;color:#999}
.jd-tab.active .jd-tab-label{color:var(--jd-red)}
.jd-tab-icon-badge{position:relative}
.jd-tab-badge{position:absolute;top:-4px;right:-8px;min-width:14px;height:14px;background:var(--jd-red);color:#fff;font-size:9px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 4px}
body{padding-bottom:calc(50px + env(safe-area-inset-bottom))}

/* ===== 搜索页 ===== */
.jd-search-bar{display:flex;align-items:center;background:#fff;padding:8px 12px;gap:10px}
.jd-search-input{flex:1;background:#f5f5f5;border-radius:20px;height:36px;display:flex;align-items:center;padding:0 12px}
.jd-search-input input{flex:1;border:none;background:transparent;font-size:14px;outline:none}
.jd-search-btn{padding:8px 16px;background:var(--jd-red);color:#fff;border-radius:18px;font-size:13px}

/* ===== 空状态 ===== */
.jd-empty{padding:60px 20px;text-align:center}
.jd-empty-icon{font-size:48px;margin-bottom:12px}
.jd-empty-text{color:#999;font-size:14px}

/* ===== 加载更多 ===== */
.jd-loadmore{padding:16px;text-align:center;color:#999;font-size:12px}

/* ===== 分页 ===== */
.jd-pagination{display:flex;justify-content:center;gap:8px;padding:12px}
.jd-pagination a,.jd-pagination span{padding:6px 12px;background:#fff;border:1px solid #ddd;border-radius:4px;font-size:12px;color:#333}
.jd-pagination .current{background:var(--jd-red);color:#fff;border-color:var(--jd-red)}

/* ===== 返回顶部 ===== */
.jd-backtop{position:fixed;right:12px;bottom:70px;width:40px;height:40px;background:rgba(0,0,0,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;z-index:99}

/* ===== 品牌墙 ===== */
.jd-brands{background:#fff;padding:12px;margin-bottom:8px}
.jd-brands-title{font-size:15px;font-weight:bold;margin-bottom:10px;display:flex;align-items:center;gap:4px}
.jd-brands-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px 6px}
.jd-brand-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none}
.jd-brand-logo{width:40px;height:40px;border-radius:8px;background:linear-gradient(135deg,#fff5f5,#ffe8e8);display:flex;align-items:center;justify-content:center;font-size:20px}
.jd-brand-name{font-size:10px;color:#666;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:54px}

/* JD-FIX: 加盟页客户端修复 */
@import url('/template/mobile/skin/css/jd-fix.css');
/* 加盟优势区块 */
.jd-advantages{background:#fff;margin:10px 12px;border-radius:8px;padding:14px}
.jd-adv-title{font-size:14px;font-weight:bold;margin-bottom:10px;color:#333}
.jd-wechat-float{position:fixed;bottom:80px;right:16px;z-index:999}
.jd-wechat-float a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#e1251b;border-radius:50%;box-shadow:0 2px 8px rgba(225,37,27,.35);font-size:24px;color:#fff;text-decoration:none}

/* JD-FIX: 加盟页客户端修复 */
@import url('/template/mobile/skin/css/jd-fix.css');
/* 加盟优势区块 */
.jd-advantages{background:#fff;margin:10px 12px;border-radius:8px;padding:14px}
.jd-adv-title{font-size:14px;font-weight:bold;margin-bottom:10px;color:#333}
.jd-wechat-float{position:fixed;bottom:80px;right:16px;z-index:999}
.jd-wechat-float a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#e1251b;border-radius:50%;box-shadow:0 2px 8px rgba(225,37,27,.35);font-size:24px;color:#fff;text-decoration:none}

/* JD-FIX: 加盟页客户端修复 */
@import url('/template/mobile/skin/css/jd-fix.css');
/* 加盟优势区块 */
.jd-advantages{background:#fff;margin:10px 12px;border-radius:8px;padding:14px}
.jd-adv-title{font-size:14px;font-weight:bold;margin-bottom:10px;color:#333}
.jd-wechat-float{position:fixed;bottom:80px;right:16px;z-index:999}
.jd-wechat-float a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#e1251b;border-radius:50%;box-shadow:0 2px 8px rgba(225,37,27,.35);font-size:24px;color:#fff;text-decoration:none}

/* JD-FIX: 加盟页客户端修复 */
@import url('/template/mobile/skin/css/jd-fix.css');
/* 加盟优势区块 */
.jd-advantages{background:#fff;margin:10px 12px;border-radius:8px;padding:14px}
.jd-adv-title{font-size:14px;font-weight:bold;margin-bottom:10px;color:#333}
.jd-wechat-float{position:fixed;bottom:80px;right:16px;z-index:999}
.jd-wechat-float a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#e1251b;border-radius:50%;box-shadow:0 2px 8px rgba(225,37,27,.35);font-size:24px;color:#fff;text-decoration:none}

/* JD-FIX: 加盟页客户端修复 */
@import url('/template/mobile/skin/css/jd-fix.css');
/* 加盟优势区块 */
.jd-advantages{background:#fff;margin:10px 12px;border-radius:8px;padding:14px}
.jd-adv-title{font-size:14px;font-weight:bold;margin-bottom:10px;color:#333}
.jd-wechat-float{position:fixed;bottom:80px;right:16px;z-index:999}
.jd-wechat-float a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#e1251b;border-radius:50%;box-shadow:0 2px 8px rgba(225,37,27,.35);font-size:24px;color:#fff;text-decoration:none}
