/* ===== 伊拉苏酒庄会员系统 · 移动端样式 ===== */
:root{
  --red:#8c1f28;
  --red-deep:#6d1218;
  --red-light:#a3271f;
  --gold:#c9a063;
  --gold-light:#e6c990;
  --bg:#f7f3ec;
  --text:#3a2f2b;
  --muted:#9a8f88;
  --line:#ece3d6;
  --radius:12px;
  --shadow:0 4px 16px rgba(140,31,40,.08);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{font-size:16px;}
body{
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
  background:var(--bg);color:var(--text);max-width:640px;margin:0 auto;
  padding-bottom:66px;font-size:14px;line-height:1.6;
}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
button{font-family:inherit;}

/* ===== 顶部栏 ===== */
.topbar{
  position:sticky;top:0;z-index:99;background:linear-gradient(135deg,#8c1f28,#6d1218);
  color:#fff;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;
  box-shadow:0 2px 10px rgba(109,18,24,.3);
}
.topbar .t-title{font-size:17px;font-weight:700;letter-spacing:2px;}
.topbar .t-sub{font-size:11px;opacity:.85;letter-spacing:1px;}
.topbar .t-left{display:flex;align-items:center;gap:8px;min-width:0;flex:1;}
.topbar .t-back{font-size:20px;padding:0 6px 0 0;color:#fff;}
.topbar .t-right{display:flex;align-items:center;gap:12px;font-size:13px;}

/* ===== 底部导航 ===== */
.bottom-nav{
  position:fixed;bottom:0;left:0;right:0;max-width:640px;margin:0 auto;z-index:100;
  background:#fff;border-top:1px solid var(--line);
  display:flex;box-shadow:0 -2px 12px rgba(0,0,0,.05);padding-bottom:env(safe-area-inset-bottom);
}
.bottom-nav a{
  flex:1;text-align:center;padding:7px 0 5px;color:#8a7f78;font-size:11px;
}
.bottom-nav a .ic{font-size:21px;line-height:1.3;display:block;}
.bottom-nav a.on{color:var(--red-light);}
.bottom-nav a .badge{
  position:absolute;min-width:16px;height:16px;line-height:16px;border-radius:8px;
  background:var(--red-light);color:#fff;font-size:10px;padding:0 4px;margin-left:14px;margin-top:-4px;
}
.bottom-nav a{position:relative;}

/* ===== 通用组件 ===== */
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;}
.section{margin:14px 12px;}
.section-title{
  display:flex;align-items:center;justify-content:space-between;margin:16px 14px 10px;
}
.section-title h2{font-size:16px;color:var(--red-deep);font-weight:700;display:flex;align-items:center;gap:8px;}
.section-title h2::before{content:"";width:4px;height:16px;background:linear-gradient(180deg,var(--gold),var(--red));border-radius:2px;}
.section-title .more{font-size:12px;color:var(--muted);}

.btn{
  display:inline-block;border:none;border-radius:8px;padding:10px 22px;font-size:14px;cursor:pointer;
  background:linear-gradient(135deg,#a3271f,#8c1f28);color:#fff;text-align:center;
}
.btn.block{display:block;width:100%;}
.btn.gold{background:linear-gradient(135deg,#d9b26b,#c9a063);color:#5a3a12;}
.btn.gray{background:#e8e2d8;color:#6b6159;}
.btn.sm{padding:6px 14px;font-size:12px;border-radius:6px;}
.btn:active{opacity:.85;}

.price{color:var(--red-light);font-weight:700;}
.price small{font-size:11px;font-weight:400;}
.price-old{color:#b9aea5;text-decoration:line-through;font-size:12px;margin-left:6px;}

.tag{
  display:inline-block;font-size:10px;padding:1px 6px;border-radius:3px;margin-right:4px;vertical-align:1px;
}
.tag.gold{background:linear-gradient(135deg,#e9d3a5,#c9a063);color:#5a3a12;}
.tag.red{background:#8c1f28;color:#fff;}

.empty{padding:60px 0;text-align:center;color:var(--muted);font-size:13px;}
.empty .ic{font-size:46px;display:block;margin-bottom:10px;opacity:.4;}

/* ===== 轮播 ===== */
.swiper{position:relative;overflow:hidden;border-radius:0 0 16px 16px;}
.swiper-track{display:flex;transition:transform .4s ease;}
.swiper-slide{min-width:100%;height:240px;}
.swiper-slide img{width:100%;height:100%;object-fit:cover;}
.swiper-dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px;}
.swiper-dots i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.6);}
.swiper-dots i.on{width:16px;background:#fff;}

/* ===== 首页 ===== */
.hero-card{
  margin:14px 12px 0;position:relative;z-index:5;background:linear-gradient(135deg,#8c1f28,#5e0f16);
  border-radius:16px;color:#fff;padding:16px;box-shadow:0 10px 26px rgba(92,15,22,.35);overflow:hidden;
}
.hero-card::after{
  content:"";position:absolute;right:-30px;top:-30px;width:130px;height:130px;border-radius:50%;
  border:2px solid rgba(230,201,144,.35);
}
.hero-card::before{
  content:"";position:absolute;right:-8px;top:-8px;width:90px;height:90px;border-radius:50%;
  border:1px solid rgba(230,201,144,.25);
}
.hero-card .hc-name{font-size:22px;font-weight:700;letter-spacing:4px;}
.hero-card .hc-sub{font-size:11px;color:var(--gold-light);letter-spacing:2px;margin-top:2px;}
.hero-card .hc-row{display:flex;justify-content:space-between;align-items:flex-end;margin-top:12px;position:relative;z-index:2;}
.hero-card .hc-level{font-size:13px;}
.hero-card .hc-level b{font-size:22px;color:var(--gold-light);margin-right:4px;}
.hero-card .hc-points{font-size:12px;text-align:right;}
.hero-card .hc-points b{display:block;font-size:20px;color:var(--gold-light);}

.level-cards{display:flex;gap:8px;margin:14px 12px 0;}
.level-card{
  flex:1;border-radius:12px;padding:12px 8px;text-align:center;color:#fff;
  position:relative;overflow:hidden;box-shadow:var(--shadow);
}
.level-card::before{content:"";position:absolute;left:-14px;top:-14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);}
.level-card h3{font-size:15px;letter-spacing:3px;}
.level-card .lc-price{font-size:11px;margin:4px 0 2px;opacity:.9;}
.level-card .lc-price b{font-size:16px;}
.level-card .lc-disc{display:inline-block;background:rgba(255,255,255,.22);border-radius:10px;padding:1px 8px;font-size:11px;margin-top:4px;}
.lc-yaxi{background:linear-gradient(160deg,#b98a5a,#8a5a2e);}
.lc-zunxi{background:linear-gradient(160deg,#7d8799,#4d586b);}
.lc-yuxi{background:linear-gradient(160deg,#b8a05c,#8a7a2e);}

.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 12px;}
.cat-item{text-align:center;background:#fff;border-radius:12px;padding:12px 4px;box-shadow:var(--shadow);}
.cat-item .ci-ic{width:46px;height:46px;margin:0 auto 6px;border-radius:50%;background:linear-gradient(135deg,#f3e3c4,#e6c990);display:flex;align-items:center;justify-content:center;font-size:22px;}
.cat-item span{font-size:12px;color:#5c4f46;}

/* 商品卡片 */
.goods-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:0 12px;}
.goods-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);}
.goods-card .gc-img{width:100%;height:150px;object-fit:cover;}
.goods-card .gc-body{padding:9px 10px 11px;}
.goods-card .gc-name{font-size:13px;font-weight:600;line-height:1.4;height:36px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.goods-card .gc-sub{font-size:11px;color:var(--muted);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.goods-card .gc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:7px;}
.goods-card .gc-buy{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#a3271f,#8c1f28);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;border:none;cursor:pointer;}

/* 会员权益列表 */
.benefit-list{margin:0 12px;}
.benefit-item{display:flex;gap:10px;background:#fff;border-radius:12px;padding:12px;margin-bottom:10px;box-shadow:var(--shadow);align-items:center;}
.benefit-item .bi-ic{width:40px;height:40px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;}
.benefit-item .bi-tx{flex:1;min-width:0;}
.benefit-item .bi-tx b{font-size:14px;display:block;}
.benefit-item .bi-tx span{font-size:12px;color:var(--muted);}

/* ===== 商城 ===== */
.cat-tabs{
  position:sticky;top:0;z-index:90;display:flex;background:#fff;border-bottom:1px solid var(--line);
  padding:10px 12px;gap:8px;overflow-x:auto;
}
.cat-tabs a{
  flex-shrink:0;font-size:13px;padding:6px 16px;border-radius:16px;background:#f3efe7;color:#6b6159;
}
.cat-tabs a.on{background:linear-gradient(135deg,#a3271f,#8c1f28);color:#fff;font-weight:600;}

/* ===== 商品详情 ===== */
.detail-img{width:100%;height:300px;object-fit:cover;}
.detail-body{padding:14px 16px;background:#fff;border-radius:16px 16px 0 0;margin-top:-14px;position:relative;}
.detail-price-row{display:flex;align-items:baseline;gap:8px;}
.detail-name{font-size:17px;font-weight:700;margin-top:4px;}
.detail-sub{font-size:12px;color:var(--muted);margin-top:4px;}
.detail-spec{margin-top:10px;font-size:13px;color:#6b6159;background:#f7f3ec;border-radius:8px;padding:8px 10px;}
.detail-intro{margin:14px 0;padding:14px;background:#fff;border-radius:12px;box-shadow:var(--shadow);}
.detail-intro h4{color:var(--red-deep);margin-bottom:8px;display:flex;align-items:center;gap:6px;font-size:14px;}
.detail-intro p{font-size:13px;color:#6b6159;line-height:1.9;text-align:justify;}

/* 图文详情 */
.detail-gallery{background:#fff;margin-top:14px;}
.detail-gallery .dg-head{
  display:flex;align-items:center;gap:12px;padding:16px 16px 12px;
  color:var(--red-deep);font-size:15px;font-weight:700;letter-spacing:4px;
}
.detail-gallery .dg-head::before,.detail-gallery .dg-head::after{content:"";flex:1;height:1px;background:var(--line);}
.detail-gallery .dg-text{padding:2px 16px 14px;font-size:13px;color:#6b6159;line-height:2;text-align:justify;}
.detail-gallery img{width:100%;display:block;}
.footer-bar{
  position:fixed;bottom:calc(58px + env(safe-area-inset-bottom));left:0;right:0;max-width:640px;margin:0 auto;z-index:95;
  display:flex;background:#fff;border-top:1px solid var(--line);padding:9px 12px;
  gap:10px;align-items:center;box-shadow:0 -4px 16px rgba(0,0,0,.08);
}
.footer-bar .fb-price{flex:0 0 auto;min-width:0;}
.footer-bar form{flex:1;min-width:0;display:flex;gap:6px;align-items:center;}
.footer-bar .btn{flex:1;min-width:0;padding:8px 2px;font-size:12px;}
.footer-bar .qty-ctrl{flex-shrink:0;}
.footer-bar .qty-ctrl button{width:26px;height:30px;}
.footer-bar .qty-ctrl input{width:34px;}
.qty-ctrl{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden;}
.qty-ctrl button{width:30px;height:30px;background:#f7f3ec;border:none;font-size:16px;color:#6b6159;cursor:pointer;}
.qty-ctrl input{width:40px;height:30px;border:none;text-align:center;font-size:13px;outline:none;}

/* ===== 购物车 ===== */
.cart-item{display:flex;gap:10px;padding:12px;align-items:center;}
.cart-item + .cart-item{border-top:1px solid var(--line);}
.cart-item .ci-img{width:74px;height:74px;border-radius:10px;object-fit:cover;flex-shrink:0;}
.cart-item .ci-info{flex:1;min-width:0;}
.cart-item .ci-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cart-item .ci-sub{font-size:11px;color:var(--muted);margin:2px 0 6px;}
.cart-item .ci-row{display:flex;justify-content:space-between;align-items:center;}
.cart-bar{
  position:fixed;bottom:calc(58px + env(safe-area-inset-bottom));left:0;right:0;max-width:640px;margin:0 auto;z-index:95;
  background:#fff;border-top:1px solid var(--line);padding:10px 12px;
  display:flex;align-items:center;gap:10px;box-shadow:0 -4px 16px rgba(0,0,0,.08);
}
/* 有底部操作栏的页面：为底部操作栏+导航留出空间 */
body.has-actionbar{padding-bottom:130px;}
.cart-bar .total{flex:1;font-size:12px;color:var(--muted);}
.cart-bar .total b{font-size:18px;color:var(--red-light);}

/* ===== 表单 ===== */
.form{padding:12px;}
.form-item{display:flex;align-items:center;background:#fff;border-radius:10px;padding:12px 14px;margin-bottom:10px;box-shadow:var(--shadow);}
.form-item label{width:88px;color:#6b6159;font-size:13px;flex-shrink:0;}
.form-item input,.form-item select,.form-item textarea{
  flex:1;border:none;outline:none;font-size:14px;background:transparent;color:var(--text);
}
.form-item textarea{resize:none;min-height:60px;}
.tips{font-size:12px;color:var(--muted);padding:0 6px 12px;line-height:1.8;}
.login-banner{background:linear-gradient(135deg,#8c1f28,#5e0f16);color:#fff;padding:38px 22px 42px;text-align:center;border-radius:0 0 28px 28px;}
.login-banner h1{font-size:24px;letter-spacing:5px;font-weight:700;}
.login-banner p{font-size:12px;opacity:.8;letter-spacing:2px;margin-top:6px;}

/* ===== 订单 ===== */
.order-tabs{display:flex;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:90;}
.order-tabs a{flex:1;text-align:center;padding:11px 0;font-size:13px;color:#6b6159;position:relative;}
.order-tabs a.on{color:var(--red-light);font-weight:600;}
.order-tabs a.on::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:24px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--gold),var(--red));}
.order-card{margin:0 12px 12px;}
.order-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px dashed var(--line);font-size:12px;color:var(--muted);}
.order-head .st{color:var(--red-light);font-weight:700;}
.order-body{padding:10px 12px;}
.order-goods{display:flex;gap:10px;margin-bottom:8px;}
.order-goods img{width:56px;height:56px;border-radius:8px;object-fit:cover;}
.order-goods .og-info{flex:1;min-width:0;}
.order-goods .og-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.order-goods .og-price{font-size:12px;color:var(--muted);margin-top:2px;}
.order-foot{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:10px 12px;border-top:1px dashed var(--line);font-size:13px;}
.order-foot .of-price b{color:var(--red-light);font-size:16px;}

/* ===== 我的 ===== */
.mine-head{background:linear-gradient(135deg,#8c1f28,#5e0f16);color:#fff;padding:22px 18px 40px;border-radius:0 0 24px 24px;}
.mine-head .mh-top{display:flex;align-items:center;gap:12px;}
.mine-avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--gold-light),#b98a5a);display:flex;align-items:center;justify-content:center;font-size:26px;color:#5a3a12;font-weight:700;}
.mine-head .mh-name{font-size:18px;font-weight:700;}
.mine-head .mh-phone{font-size:12px;opacity:.8;}
.mine-head .mh-level{display:inline-block;margin-top:6px;font-size:11px;background:rgba(230,201,144,.2);border:1px solid rgba(230,201,144,.6);color:var(--gold-light);border-radius:4px;padding:1px 8px;}
.mine-stats{display:flex;background:#fff;border-radius:14px;margin:0 12px;margin-top:-20px;box-shadow:var(--shadow);position:relative;z-index:2;}
.mine-stats a{flex:1;text-align:center;padding:14px 0;position:relative;}
.mine-stats a + a::before{content:"";position:absolute;left:0;top:24%;height:52%;width:1px;background:var(--line);}
.mine-stats b{display:block;font-size:19px;color:var(--red-deep);}
.mine-stats span{font-size:11px;color:var(--muted);}
.mine-menu{background:#fff;border-radius:14px;margin:12px;box-shadow:var(--shadow);overflow:hidden;}
.mine-menu a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid #f6f1e9;}
.mine-menu a:last-child{border-bottom:none;}
.mine-menu .mm-ic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px;color:#fff;flex-shrink:0;}
.mine-menu .mm-tx{flex:1;font-size:14px;}
.mine-menu .mm-arrow{color:#c9beb4;}

/* ===== 积分明细 ===== */
.point-item{display:flex;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--line);}
.point-item:last-child{border-bottom:none;}
.point-item .pi-l{font-size:13px;}
.point-item .pi-l span{display:block;font-size:11px;color:var(--muted);margin-top:2px;}
.point-item .pi-r{font-weight:700;}
.point-item .pi-r.in{color:#2e8b57;}
.point-item .pi-r.out{color:var(--red-light);}

/* ===== 礼遇页 ===== */
.benefits-hero{background:linear-gradient(160deg,#8c1f28,#4a0c11);color:#fff;text-align:center;padding:34px 18px;border-radius:0 0 26px 26px;}
.benefits-hero h1{font-size:24px;letter-spacing:6px;}
.benefits-hero p{font-size:12px;opacity:.85;letter-spacing:2px;margin-top:8px;}
.level-detail{background:#fff;border-radius:16px;margin:14px 12px;padding:18px;box-shadow:var(--shadow);text-align:center;position:relative;overflow:hidden;}
.level-detail .ld-name{font-size:22px;font-weight:700;letter-spacing:6px;}
.level-detail .ld-price{font-size:13px;color:var(--muted);margin:6px 0 4px;}
.level-detail .ld-price b{font-size:28px;color:var(--red-light);}
.level-detail .ld-disc{display:inline-block;background:linear-gradient(135deg,#f3e3c4,#e6c990);color:#5a3a12;border-radius:14px;padding:3px 16px;font-size:13px;font-weight:600;margin:6px 0 14px;}
.level-detail .ld-list{text-align:left;padding:0 6px;}
.level-detail .ld-list li{list-style:none;display:flex;gap:8px;font-size:13px;color:#6b6159;padding:5px 0;align-items:flex-start;}
.level-detail .ld-list li::before{content:"✦";color:var(--gold);flex-shrink:0;}

/* ===== 弹窗 ===== */
.mask{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;display:none;align-items:flex-end;justify-content:center;}
.mask.show{display:flex;}
.sheet{background:#fff;width:100%;max-width:640px;border-radius:16px 16px 0 0;padding:16px;animation:up .25s ease;}
@keyframes up{from{transform:translateY(30px);opacity:0;}to{transform:none;opacity:1;}}
.sheet-title{font-size:15px;font-weight:700;text-align:center;margin-bottom:12px;color:var(--red-deep);}

.toast{position:fixed;left:50%;top:45%;transform:translate(-50%,-50%);background:rgba(0,0,0,.78);color:#fff;padding:10px 20px;border-radius:8px;font-size:13px;z-index:300;display:none;}

/* ===== 其他 ===== */
.divider{height:8px;background:transparent;}
.notice{background:linear-gradient(90deg,#fdf6e6,#f8ecd2);border:1px solid #eedaae;border-radius:10px;padding:10px 12px;font-size:12px;color:#8a6d3b;margin:10px 12px;line-height:1.8;}
.notice b{color:#a3271f;}