/* ============ 爱望优选·淘宝客导购站公共样式（淘宝橙·手机优先·桌面增强） ============ */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{background:#f4f4f4;}
body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","微软雅黑",sans-serif;
    color:#222;font-size:14px;
}
a{text-decoration:none;color:inherit;}
img{display:block;}

/* ===== 顶部橙色搜索头 ===== */
.tb-header{
    background:linear-gradient(135deg,#ff7a00,#ff5000);
    padding:12px 12px 14px;position:sticky;top:0;z-index:100;
}
.tb-header-inner{display:flex;align-items:center;gap:10px;max-width:600px;margin:0 auto;}
.tb-logo{color:#fff;font-size:19px;font-weight:800;letter-spacing:1px;white-space:nowrap;
    text-shadow:0 1px 2px rgba(0,0,0,.12);}
.tb-logo small{font-size:11px;font-weight:400;opacity:.92;display:block;letter-spacing:0;}
.tb-search{
    flex:1;height:36px;background:#fff;border-radius:18px;
    display:flex;align-items:center;padding:0 14px;gap:7px;
}
.tb-search .s-icon{color:#999;font-size:15px;}
.tb-search input{
    flex:1;border:none;outline:none;font-size:14px;background:transparent;color:#333;
}
.tb-search .s-btn{
    background:linear-gradient(135deg,#ff7a00,#ff5000);color:#fff;border:none;
    font-size:13px;padding:5px 14px;border-radius:14px;cursor:pointer;flex-shrink:0;
}

/* ===== 分类图标条 ===== */
.cat-strip{background:#fff;padding:14px 6px 10px;}
.cat-strip .track{display:flex;overflow-x:auto;gap:4px;scrollbar-width:none;max-width:600px;margin:0 auto;}
.cat-strip .track::-webkit-scrollbar{display:none;}
.cat-item{flex:0 0 auto;width:64px;text-align:center;cursor:pointer;}
.cat-icon{
    width:46px;height:46px;border-radius:50%;margin:0 auto 6px;
    display:flex;align-items:center;justify-content:center;
    font-size:22px;background:#fff3ec;
}
.cat-name{font-size:12px;color:#444;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ===== 频道 tabs ===== */
.ch-tabs{
    display:flex;background:#fff;padding:0 8px;
    border-bottom:1px solid #f0f0f0;
}
.ch-tabs .inner{display:flex;max-width:600px;margin:0 auto;width:100%;}
.ch-tabs .tab{
    padding:11px 16px;font-size:15px;color:#666;cursor:pointer;position:relative;white-space:nowrap;
}
.ch-tabs .tab.on{color:#ff5000;font-weight:700;}
.ch-tabs .tab.on::after{
    content:'';position:absolute;left:50%;bottom:4px;transform:translateX(-50%);
    width:22px;height:3px;border-radius:2px;background:#ff5000;
}

/* ===== 区块标题 ===== */
.section-hd{
    display:flex;align-items:center;gap:8px;padding:14px 12px 10px;
    font-size:16px;font-weight:700;max-width:600px;margin:0 auto;
}
.section-hd::before{
    content:'';width:4px;height:16px;border-radius:2px;background:#ff5000;
}
.section-hd .more{margin-left:auto;font-size:12px;color:#999;font-weight:400;}

/* ===== 商品两列网格 ===== */
.goods-grid{
    display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:0 8px 20px;
    max-width:600px;margin:0 auto;
}
.g-card{
    background:#fff;border-radius:10px;overflow:hidden;
    box-shadow:0 1px 4px rgba(0,0,0,.05);cursor:pointer;
    display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s;
}
.g-card:active{transform:scale(.98);}
.g-img{position:relative;width:100%;padding-top:100%;background:#f7f7f7;}
.g-img img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}
.g-img img.img-bad{opacity:0;}
.g-img .g-coup{
    position:absolute;left:0;bottom:0;
    background:linear-gradient(90deg,#ff5000,#ff8a3d);color:#fff;
    font-size:11px;padding:2px 8px 3px;border-radius:0 10px 0 0;
}
.g-img .g-tmall{
    position:absolute;left:6px;top:6px;background:rgba(0,0,0,.55);color:#fff;
    font-size:10px;padding:1px 5px;border-radius:3px;
}
.g-body{padding:8px 9px 10px;display:flex;flex-direction:column;flex:1;}
.g-name{
    font-size:14px;line-height:1.35;color:#222;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    min-height:38px;
}
.g-tags{margin-top:5px;display:flex;gap:4px;flex-wrap:wrap;min-height:17px;}
.g-tags span{
    font-size:10px;color:#ff5000;border:1px solid #ffd8c2;border-radius:3px;padding:0 3px;line-height:16px;
}
.g-price-row{margin-top:6px;display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;}
.g-after{color:#ff5000;font-size:19px;font-weight:800;}
.g-after i{font-size:12px;font-style:normal;font-weight:700;}
.g-group{font-size:11px;color:#999;}
.g-old{font-size:11px;color:#bbb;text-decoration:line-through;}
.g-foot{margin-top:auto;padding-top:7px;display:flex;align-items:center;justify-content:space-between;}
.g-sales{font-size:11px;color:#999;}
.g-buy{
    background:linear-gradient(135deg,#ff7a00,#ff5000);color:#fff;font-size:11px;
    padding:3px 10px;border-radius:11px;
}

/* ===== 加载状态 / 空状态 / 提示条 ===== */
.load-more{text-align:center;padding:14px;color:#999;font-size:13px;}
.load-more .spin{
    display:inline-block;width:15px;height:15px;border:2px solid #eee;border-top-color:#ff5000;
    border-radius:50%;vertical-align:-3px;margin-right:6px;animation:sp .8s linear infinite;
}
@keyframes sp{to{transform:rotate(360deg);}}
.empty-box{text-align:center;padding:70px 30px;color:#999;font-size:14px;line-height:2;max-width:600px;margin:0 auto;}
.empty-box .big{font-size:48px;}
.notice-box{
    margin:14px 12px;padding:14px;background:#fff7e6;border:1px solid #ffe0a3;
    border-radius:10px;color:#8a6d3b;font-size:13px;line-height:1.8;max-width:600px;margin-left:auto;margin-right:auto;
}
.notice-box b{color:#ff5000;}

/* ===== 排序条 + 筛选 chips（搜索页/分类页） ===== */
.sort-bar{
    display:flex;background:#fff;border-bottom:1px solid #f0f0f0;
    position:sticky;top:62px;z-index:90;
}
.sort-bar .inner{display:flex;width:100%;max-width:600px;margin:0 auto;}
.sort-bar .s{
    flex:1;text-align:center;padding:11px 0;font-size:14px;color:#555;cursor:pointer;
}
.sort-bar .s.on{color:#ff5000;font-weight:700;}
.filter-chips{
    display:flex;gap:8px;padding:10px 12px;overflow-x:auto;background:#fff;
    border-bottom:1px solid #f0f0f0;scrollbar-width:none;
}
.filter-chips::-webkit-scrollbar{display:none;}
.filter-chips a{
    flex:0 0 auto;padding:5px 14px;border-radius:15px;background:#f4f4f4;
    font-size:13px;color:#555;cursor:pointer;
}
.filter-chips a.on{background:#ff5000;color:#fff;font-weight:700;}

/* ===== 分类大全页 ===== */
.cat-group{margin:10px;background:#fff;border-radius:10px;overflow:hidden;max-width:600px;margin-left:auto;margin-right:auto;}
.cat-group .cg-hd{
    padding:11px 14px;font-size:15px;font-weight:700;background:#fafafa;
    border-bottom:1px solid #f3f3f3;display:flex;align-items:center;gap:7px;
}
.cat-group .cg-hd::before{content:'';width:4px;height:14px;background:#ff5000;border-radius:2px;}
.cat-group .cg-bd{display:grid;grid-template-columns:repeat(4,1fr);}
.cat-group .cg-bd a{
    text-align:center;padding:16px 4px;font-size:13px;color:#444;
    border-right:1px solid #f7f7f7;border-bottom:1px solid #f7f7f7;
}
.cat-group .cg-bd a .ci{font-size:20px;display:block;margin-bottom:5px;}
.cat-group .cg-bd a:nth-child(4n){border-right:none;}
.cat-page{max-width:600px;margin:0 auto;padding-bottom:20px;}

/* ===== 详情页 ===== */
.topbar{
    position:sticky;top:0;z-index:50;height:46px;background:#ff5000;color:#fff;
    display:flex;align-items:center;padding:0 12px;gap:10px;
}
.topbar a{color:#fff;font-size:24px;line-height:1;text-decoration:none;}
.topbar b{font-size:17px;}
.gallery{position:relative;background:#fff;width:100%;padding-top:100%;}
.gallery .big{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;background:#f7f7f7;}
.gallery .dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);
    background:rgba(0,0,0,.35);color:#fff;font-size:12px;padding:2px 10px;border-radius:11px;}
.thumbs{display:flex;gap:6px;padding:8px;background:#fff;overflow-x:auto;scrollbar-width:none;}
.thumbs::-webkit-scrollbar{display:none;}
.thumbs img{width:54px;height:54px;object-fit:cover;border-radius:6px;border:2px solid transparent;flex-shrink:0;cursor:pointer;}
.thumbs img.on{border-color:#ff5000;}
.info{background:#fff;padding:12px 14px 14px;margin-bottom:8px;}
.price-box{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.after{color:#ff5000;font-size:30px;font-weight:800;line-height:1.1;}
.after small{font-size:15px;font-weight:700;}
.coup-tag{background:linear-gradient(90deg,#ff5000,#ff8a3d);color:#fff;font-size:12px;
    padding:3px 9px;border-radius:4px;font-weight:700;}
.gp{font-size:13px;color:#666;}
.op{font-size:12px;color:#aaa;text-decoration:line-through;}
.g-title{font-size:16px;line-height:1.5;margin-top:10px;font-weight:600;}
.g-meta{margin-top:10px;font-size:12px;color:#999;display:flex;gap:14px;flex-wrap:wrap;}
.block{background:#fff;margin-bottom:8px;padding:13px 14px;font-size:13px;color:#555;line-height:1.9;}
.block h3{font-size:15px;color:#222;margin-bottom:8px;display:flex;align-items:center;gap:7px;}
.block h3::before{content:'';width:4px;height:15px;background:#ff5000;border-radius:2px;}
.shop-row{display:flex;align-items:center;gap:10px;}
.shop-row .nm{flex:1;font-size:14px;color:#222;font-weight:600;}
.shop-row .tip{font-size:11px;color:#999;}
.detail-imgs img{width:100%;margin-bottom:6px;border-radius:6px;}
.bottom-bar{
    position:fixed;left:0;right:0;bottom:0;height:60px;background:#fff;
    border-top:1px solid #eee;display:flex;align-items:center;padding:0 12px;gap:10px;z-index:60;
}
.bottom-bar .home{width:52px;text-align:center;font-size:11px;color:#777;text-decoration:none;}
.buy-btn{
    flex:1;height:42px;border:none;border-radius:21px;color:#fff;font-size:16px;font-weight:700;
    background:linear-gradient(90deg,#ff8a3d,#ff5000);cursor:pointer;
    display:block;text-align:center;line-height:42px;text-decoration:none;
}
.pwd-btn{
    width:108px;height:42px;border:1px solid #ff5000;border-radius:21px;color:#ff5000;
    font-size:14px;font-weight:700;background:#fff;cursor:pointer;
}
.empty{text-align:center;padding:90px 30px;color:#999;}
.empty a{display:inline-block;margin-top:16px;background:#ff5000;color:#fff;padding:10px 26px;border-radius:20px;text-decoration:none;}
/* 详情页在电脑上适当收窄，方便阅读；底部购买栏与内容对齐 */
@media(min-width:768px){
    body.pg-detail{max-width:960px;margin:0 auto;background:#f4f4f4;}
    body.pg-detail .bottom-bar{max-width:960px;left:50%;transform:translateX(-50%);}
}

/* ===== 微信内淘口令中间页 ===== */
.wx-mask{min-height:100vh;background:#f4f4f4;padding-bottom:30px;}
.wx-card{background:#fff;margin:14px;border-radius:12px;padding:18px 16px;text-align:center;}
.wx-card img{width:150px;height:150px;object-fit:cover;border-radius:10px;margin:0 auto 12px;}
.wx-card .t{font-size:15px;line-height:1.5;color:#222;margin-bottom:10px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.wx-card .p{color:#ff5000;font-size:24px;font-weight:800;}
.wx-card .p small{font-size:13px;}
.wx-card .o{font-size:12px;color:#aaa;text-decoration:line-through;margin-top:2px;}
.pwd-box{margin:14px;background:#fff7e6;border:1px dashed #ff5000;border-radius:10px;
    padding:16px;text-align:center;}
.pwd-box .pwd{font-size:22px;font-weight:800;letter-spacing:2px;color:#ff5000;
    user-select:all;margin:8px 0 4px;word-break:break-all;}
.pwd-box .tip{font-size:12px;color:#999;}
.wx-btn{display:block;margin:14px;background:linear-gradient(90deg,#ff8a3d,#ff5000);color:#fff;
    text-align:center;line-height:48px;height:48px;border-radius:24px;font-size:17px;font-weight:700;}
.wx-steps{margin:18px 24px;font-size:13px;color:#777;line-height:2;}
.wx-steps b{color:#ff5000;}

/* ===== 复制提示 ===== */
.copy-tip{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
    background:rgba(0,0,0,.75);color:#fff;padding:12px 24px;border-radius:8px;
    font-size:14px;display:none;z-index:2000;}
.copy-tip.show{display:block;}

/* ===== 微信内"浏览器打开"引导遮罩 ===== */
.browser-mask{position:fixed;inset:0;background:rgba(0,0,0,.86);z-index:1500;
    display:none;color:#fff;text-align:center;padding:0 26px;}
.browser-mask.show{display:block;}
.bm-arrow{position:fixed;top:8px;right:18px;font-size:54px;line-height:1;
    animation:bmFloat 1.1s ease-in-out infinite;}
@keyframes bmFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(12px);}}
.bm-step1{margin-top:96px;font-size:21px;font-weight:700;}
.bm-step2{margin-top:22px;font-size:16px;line-height:1.9;color:#f2f2f2;}
.bm-step2 b{color:#ffd200;}
.bm-continue{display:inline-block;margin-top:34px;border:1px solid #fff;color:#fff;
    padding:11px 28px;border-radius:24px;font-size:15px;text-decoration:none;}
.bm-sub{margin-top:16px;font-size:12px;color:#aaa;}
.buy-actions{padding:6px 14px 0;display:flex;flex-direction:column;gap:10px;}
.buy-actions .wx-btn{margin:0;position:relative;}
.buy-actions .pwd-line{height:42px;line-height:42px;text-align:center;border-radius:21px;
    border:1px solid #ff5000;color:#ff5000;font-size:15px;font-weight:700;background:#fff;cursor:pointer;}
.pwd-box.collapsed{display:none;}
.tap-hint{text-align:center;font-size:12px;color:#999;padding:10px 14px 0;line-height:1.7;}

/* ============ 平板 / 电脑端：全屏自适应（列数随屏宽自动增加） ============ */
@media(min-width:640px){
    /* 顶栏、分类、tabs、排序条、标题等全部铺满，仅留两侧安全边距 */
    .tb-header-inner,.ch-tabs .inner,.section-hd,.sort-bar .inner{
        max-width:none;margin:0;
    }
    .tb-header{padding:14px 22px 16px;}
    .sort-bar{top:66px;}
    .ch-tabs{padding:0 14px;}
    .section-hd{padding:16px 22px 10px;}

    /* 分类条：电脑上居中平铺可换行，不再横向滚动 */
    .cat-strip{padding:16px 0 12px;}
    .cat-strip .track{
        max-width:none;margin:0;padding:0 22px;gap:10px;
        flex-wrap:wrap;justify-content:center;overflow:visible;
    }
    .cat-item{width:74px;}

    /* 商品网格：按屏宽自动排列，宽屏一屏能放很多列 */
    .goods-grid{
        max-width:none;margin:0;
        grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
        gap:12px;padding:0 22px 26px;
    }
    .filter-chips{max-width:none;margin:0;padding:12px 22px;}
    .empty-box,.notice-box{max-width:none;margin:14px 22px;}

    /* 分类大全页：全屏 + 自动列数 */
    .cat-page{max-width:none;}
    .cat-group{max-width:none;margin:14px 22px;}
    .cat-group .cg-bd{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));}
    .cat-group .cg-bd a{border-right:1px solid #f7f7f7;}
    .cat-group .cg-bd a:last-child{border-right:none;}
}
@media(min-width:1100px){
    .goods-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:0 28px 30px;}
    .tb-header-inner,.section-hd{padding-left:6px;padding-right:6px;}
    .tb-header{padding:16px 28px 18px;}
    .cat-strip .track,.ch-tabs,.section-hd,.filter-chips{padding-left:28px;padding-right:28px;}
    .goods-grid,.filter-chips{padding-left:28px;padding-right:28px;}
    .empty-box,.notice-box,.cat-group{margin-left:28px;margin-right:28px;}
    .g-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.08);}
    .g-name{font-size:15px;min-height:40px;}
    .g-after{font-size:21px;}
}
@media(min-width:1600px){
    .goods-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;}
}

