/* ===== 商城模板样式 ===== */
*{box-sizing:border-box;}
body{background:#f5f6f8;color:#333;font-family:"Microsoft YaHei","微软雅黑",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;}

a{text-decoration:none;color:#333;}
a:hover{text-decoration:none;color:#e4393c;}

/* 顶部导航 */
.mall-header{background:#fff;border-bottom:1px solid #eee;box-shadow:0 1px 4px rgba(0,0,0,.04);}
.mall-header .container{padding-top:12px;padding-bottom:12px;}
.mall-logo a{font-size:24px;font-weight:700;color:#e4393c;line-height:42px;display:inline-block;}
.mall-logo a i{margin-right:6px;}
.mall-nav{list-style:none;margin:0;padding:0;float:right;line-height:42px;}
.mall-nav li{display:inline-block;margin-left:26px;}
.mall-nav li a{font-size:15px;color:#333;}
.mall-nav li a:hover{color:#e4393c;}

/* 公告 */
.mall-notice{background:#fff7e6;border:1px solid #ffe1a8;color:#ad6800;border-radius:6px;padding:10px 14px;margin-top:12px;font-size:13px;}

/* 首页横幅 */
.mall-hero{background:linear-gradient(135deg,#e4393c 0%,#ff6a6e 100%);color:#fff;text-align:center;padding:52px 0 46px;}
.mall-hero h1{font-size:34px;font-weight:700;margin:0 0 10px;}
.mall-hero p{font-size:15px;opacity:.92;margin:0 0 22px;}
.mall-search{max-width:460px;margin:0 auto;position:relative;}
.mall-search input[type=text]{width:100%;height:46px;border:none;border-radius:23px;padding:0 56px 0 22px;font-size:15px;outline:none;}
.mall-search button{position:absolute;right:5px;top:5px;width:36px;height:36px;border:none;border-radius:50%;background:#e4393c;color:#fff;font-size:16px;cursor:pointer;}

/* 主体 */
.mall-main{padding:20px 15px 40px;min-height:420px;}

/* 分类导航 */
.mall-cats{list-style:none;margin:0 0 18px;padding:0;background:#fff;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.05);white-space:nowrap;overflow-x:auto;}
.mall-cats li{display:inline-block;}
.mall-cats li a{display:block;padding:12px 20px;font-size:14px;color:#555;border-bottom:2px solid transparent;}
.mall-cats li a:hover{color:#e4393c;}
.mall-cats li.active a{color:#e4393c;border-bottom-color:#e4393c;font-weight:600;}

/* 商品卡片 */
.mall-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.06);margin-bottom:18px;transition:all .2s;}
.mall-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.12);transform:translateY(-3px);}
.mall-card-img{display:block;width:100%;height:180px;overflow:hidden;background:#f7f7f7;}
.mall-card-img img{width:100%;height:100%;object-fit:cover;}
.mall-card-body{padding:12px 14px 14px;}
.mall-card-name{display:block;font-size:14px;color:#333;height:40px;line-height:20px;overflow:hidden;margin-bottom:8px;}
.mall-card-meta{margin-bottom:10px;}
.mall-price{color:#e4393c;font-size:18px;font-weight:700;}
.mall-sales{float:right;color:#999;font-size:12px;line-height:24px;}
.mall-buy-btn{display:inline-block;background:#e4393c;color:#fff;border:none;border-radius:4px;padding:7px 16px;font-size:13px;cursor:pointer;text-align:center;}
.mall-buy-btn:hover{background:#d73235;color:#fff;}
.mall-buy-btn-plain{background:#fff;color:#e4393c;border:1px solid #e4393c;margin-left:8px;}
.mall-buy-btn-plain:hover{background:#fdf0f0;color:#e4393c;}
.mall-buy-btn-lg{font-size:16px;padding:11px 32px;}
.mall-buy-btn-block{display:block;width:100%;}

/* 空状态 */
.mall-empty{text-align:center;padding:80px 0;color:#bbb;}
.mall-empty i{font-size:64px;display:block;margin-bottom:16px;}

/* 商品详情 */
.mall-detail{background:#fff;border-radius:8px;padding:24px;box-shadow:0 1px 4px rgba(0,0,0,.06);}
.mall-detail-img{background:#f7f7f7;border-radius:8px;overflow:hidden;min-height:300px;display:flex;align-items:center;justify-content:center;}
.mall-detail-img img{max-width:100%;max-height:420px;}
.mall-detail-name{font-size:22px;font-weight:700;margin:0 0 16px;}
.mall-detail-price-box{background:#fff5f5;border-radius:6px;padding:14px 18px;margin-bottom:16px;}
.mall-detail-price{color:#e4393c;font-size:30px;font-weight:700;}
.mall-detail-meta p{color:#777;font-size:14px;margin-bottom:8px;}
.mall-buy-form{margin-top:8px;}
.mall-buy-form .form-group{margin-bottom:16px;}
.mall-buy-form .form-group>label{display:block;font-size:14px;font-weight:600;margin-bottom:8px;color:#333;}
.mall-buy-form .form-control{display:block;width:100%;height:42px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background:#fff;border:1px solid #ddd;border-radius:4px;outline:none;}
.mall-buy-form .form-control:focus{border-color:#e4393c;}
/* 支付方式选择 */
.mall-paytypes{display:flex;flex-wrap:wrap;gap:10px;}
.mall-paytype-item{display:flex;align-items:center;border:1px solid #ddd;border-radius:6px;padding:8px 16px;cursor:pointer;transition:all .15s;background:#fff;margin:0;}
.mall-paytype-item:hover{border-color:#e4393c;}
.mall-paytype-item input{display:none;}
.mall-paytype-item img{width:22px;height:22px;margin-right:8px;}
.mall-paytype-item span{font-size:14px;color:#333;}
.mall-paytype-item.active{border-color:#e4393c;background:#fff5f5;box-shadow:0 0 0 1px #e4393c inset;}
.mall-paytype-item.active span{color:#e4393c;font-weight:600;}
.mall-qty{display:inline-flex;align-items:center;border:1px solid #ddd;border-radius:4px;overflow:hidden;margin-left:10px;}
.mall-qty button{width:34px;height:34px;border:none;background:#f5f5f5;cursor:pointer;font-size:16px;}
.mall-qty input{width:56px;height:34px;border:none;text-align:center;font-size:15px;outline:none;}
.mall-detail-desc{margin-top:28px;border-top:1px solid #f0f0f0;padding-top:20px;}
.mall-detail-desc h3{font-size:18px;font-weight:700;margin-bottom:12px;}
.mall-desc-content{color:#555;font-size:14px;line-height:1.8;}

/* 结算页 */
.mall-checkout{background:#fff;border-radius:8px;padding:26px;box-shadow:0 1px 4px rgba(0,0,0,.06);}
.mall-checkout h2{font-size:20px;font-weight:700;margin:0 0 20px;color:#333;}
.mall-checkout-product{display:flex;background:#fafafa;border-radius:6px;padding:14px;margin-bottom:20px;}
.mall-checkout-img{width:80px;height:80px;border-radius:6px;overflow:hidden;background:#fff;flex-shrink:0;}
.mall-checkout-img img{width:100%;height:100%;object-fit:cover;}
.mall-checkout-info{flex:1;margin-left:14px;}
.mall-checkout-info .name{font-size:15px;font-weight:600;margin-bottom:6px;}
.mall-checkout-info .price,.mall-checkout-info .qty{font-size:13px;color:#777;margin-bottom:4px;}
.mall-checkout .form-group label{font-size:14px;color:#333;font-weight:600;margin-bottom:6px;}
.mall-checkout .form-control{height:42px;border-radius:4px;}
.mall-checkout textarea.form-control{height:auto;}
.mall-checkout-total{text-align:right;font-size:15px;color:#333;margin:16px 0;padding-top:16px;border-top:1px dashed #eee;}
.mall-checkout-total span{color:#e4393c;font-size:24px;font-weight:700;}

/* 结果页 */
.mall-result{background:#fff;border-radius:8px;padding:44px 30px;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.06);}
.mall-result i{font-size:72px;display:block;margin-bottom:16px;}
.mall-result h2{font-size:22px;font-weight:700;margin:0 0 10px;}
.mall-result p{color:#777;font-size:14px;}
.mall-result-ok i{color:#52c41a;}
.mall-result-wait i{color:#faad14;}
.mall-result-fail i{color:#e4393c;}
.mall-result-info{display:inline-block;text-align:left;margin:18px auto;background:#fafafa;border-radius:6px;padding:18px 24px;min-width:320px;}
.mall-result-info p{color:#555;margin:6px 0;font-size:14px;}
.mall-result .mall-buy-btn{margin-top:8px;}

/* 订单查询 */
.mall-order-query{background:#fff;border-radius:8px;padding:26px;box-shadow:0 1px 4px rgba(0,0,0,.06);}
.mall-order-query h2{font-size:20px;font-weight:700;margin:0 0 18px;}
.mall-query-form .form-control{height:42px;border-radius:4px;min-width:280px;}
.mall-order-result{margin-top:20px;}
.mall-order-result h3{font-size:16px;font-weight:700;margin:0 0 12px;}
.mall-order-result .table th{background:#fafafa;color:#555;font-weight:600;}

/* 页脚 */
.mall-footer{background:#2b2b2b;color:#bbb;text-align:center;padding:28px 0;margin-top:30px;}
.mall-footer p{margin:4px 0;font-size:13px;}

/* 响应式 */
@media (max-width: 767px){
  .mall-hero h1{font-size:26px;}
  .mall-nav{float:none;text-align:center;}
  .mall-nav li{margin:0 12px;}
  .mall-logo{text-align:center;}
  .mall-detail-img{min-height:220px;}
}
