/* 手机端页面：确认订单、订单结果、客服与售后 */
.page{font-size:14px;padding-bottom:env(safe-area-inset-bottom)}
.page a{color:inherit}
[hidden]{display:none!important}
.m-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:6px;height:calc(48px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 6px 0;background:#fff;border-bottom:1px solid var(--line)}
.m-header{padding-right:max(6px,calc((100% - 560px) / 2));padding-left:max(6px,calc((100% - 560px) / 2))}
.m-header h1{flex:1;height:48px;margin:0;font-size:16px;font-weight:600;line-height:48px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-icon-btn,.m-text-btn{display:grid;place-items:center;min-width:44px;height:44px;padding:0 8px;border:0;border-radius:4px;background:transparent;color:#444;font-size:12px;text-decoration:none}
.m-icon-btn{font-size:26px;line-height:1;color:#555}
.m-icon-btn:active,.m-text-btn:active{background:#f5f5f5}
.page-main{max-width:560px;margin:0 auto;padding:10px 12px calc(96px + env(safe-area-inset-bottom))}
.card{margin-bottom:10px;padding:14px;border:1px solid var(--line);border-radius:4px;background:#fff}
.card-title{display:flex;align-items:center;gap:7px;margin:0 0 12px;font-size:13px;font-weight:700;color:#444}
.card-title::before{content:"";width:3px;height:13px;border-radius:1px;background:var(--red)}

/* 商品行 */
.goods-row{display:flex;gap:12px}
.goods-row img{flex:none;width:84px;height:84px;border-radius:3px;background:#f0ede6;object-fit:cover}
.goods-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}
.goods-name{margin:0;font-size:15px;font-weight:600;line-height:1.4}
.goods-meta{margin:0;font-size:11px;color:#999}
.goods-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:8px}
.goods-price{color:#df381c;font:700 18px/1.3 Arial,"Microsoft YaHei",sans-serif}

/* 数量 */
.stepper{display:flex;align-items:center;overflow:hidden;border:1px solid #e2e2e2;border-radius:3px}
.stepper button{display:grid;place-items:center;width:34px;height:34px;border:0;background:#f8f8f8;color:#555;font-size:17px}
.stepper button:active{background:#eee}
.stepper button:disabled{color:#c8c8c8}
.stepper input{width:42px;height:34px;padding:0;border:0;border-right:1px solid #eee;border-left:1px solid #eee;background:#fff;color:var(--ink);font-size:15px;text-align:center;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}

/* 表单 */
.field{display:block;margin-bottom:10px}
.field:last-child{margin-bottom:0}
.field>span{display:block;margin-bottom:5px;font-size:12px;color:#888}
.field input,.field textarea,.note{width:100%;padding:11px 12px;border:1px solid #e4e4e4;border-radius:3px;background:#fff;color:var(--ink);font:inherit;font-size:16px;line-height:1.4;outline:0}
.field textarea,.note{min-height:48px;resize:vertical}
.field input:focus,.field textarea:focus,.note:focus{border-color:var(--red);box-shadow:0 0 0 2px #d845221a}
.field.is-error input,.field.is-error textarea{border-color:#d22;background:#fff8f8}
.note{font-size:14px}

/* 支付方式 */
.pay-option{display:flex;align-items:center;gap:10px;min-height:48px;margin-bottom:8px;padding:11px 12px;border:1px solid #e4e4e4;border-radius:4px;background:#fff}
.pay-option:last-child{margin-bottom:0}
.pay-option input{flex:none;width:18px;height:18px;margin:0;accent-color:var(--red)}
.pay-badge{display:grid;flex:none;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff;font-size:14px;font-weight:700}
.pay-badge.wechat{background:#07c160}
.pay-badge.alipay{background:#1677ff}
.pay-name{flex:1;font-size:14px}
.pay-note{padding:2px 6px;border-radius:2px;background:#fff3ef;color:var(--red);font-size:11px}
.pay-option.is-selected{border-color:var(--red);background:#fff9f6}
.pay-hint{margin:10px 0 0;color:#999;font-size:11px;line-height:1.7}

/* 金额 */
.summary-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;color:#666;font-size:13px}
.summary-row.total{margin-top:5px;padding-top:12px;border-top:1px solid #f0f0f0;color:#333;font-size:14px}
.summary-row.total strong{color:#df381c;font:700 20px/1.2 Arial,"Microsoft YaHei",sans-serif}
.agree{padding:2px 4px 0;color:#999;font-size:11px;line-height:1.7;text-align:center}
.agree a{color:#666;text-decoration:underline}

/* 底部提交栏 */
.pay-bar{position:fixed;right:0;bottom:0;left:0;z-index:25;padding:9px 12px calc(9px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.pay-bar-inner{display:flex;align-items:center;gap:14px;max-width:560px;margin:0 auto}
.pay-bar-total{display:flex;flex:1;align-items:baseline;gap:6px;min-width:0}
.pay-bar-total small{font-size:11px;color:#888}
.pay-bar-total strong{color:#df381c;font:700 22px/1.2 Arial,"Microsoft YaHei",sans-serif;white-space:nowrap}
.primary-btn{min-width:140px;height:46px;padding:0 24px;border:0;border-radius:4px;background:var(--red);color:#fff;font-size:16px;font-weight:700}
.primary-btn:active{background:var(--red-dark)}
.primary-btn:disabled{opacity:.6}

/* 提示 */
.toast{position:fixed;bottom:calc(84px + env(safe-area-inset-bottom));left:50%;z-index:60;max-width:82vw;padding:9px 16px;border-radius:20px;background:#000000d9;color:#fff;font-size:13px;line-height:1.5;text-align:center;transform:translateX(-50%)}
.toast[hidden]{display:none}

/* 订单结果 */
.order-status{margin-bottom:10px;padding:26px 16px 22px;border:1px solid var(--line);border-radius:4px;background:#fff;text-align:center}
.status-icon{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 12px;border-radius:50%;background:#eaf7ef;color:#1aad19;font-size:26px}
.order-status h2{margin:0 0 6px;font-size:18px}
.order-status p{margin:0;color:#888;font-size:12px;line-height:1.7}
.info-row{display:flex;justify-content:space-between;gap:18px;padding:8px 0;border-bottom:1px solid #f5f5f5;font-size:13px}
.info-row:last-child{border-bottom:0}
.info-row dt{flex:none;color:#999}
.info-row dd{margin:0;color:#444;text-align:right;word-break:break-all}
.order-goods{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #f5f5f5;font-size:13px}
.order-goods:first-of-type{padding-top:0}
.order-goods img{flex:none;width:42px;height:42px;border-radius:2px;background:#f0ede6;object-fit:cover}
.order-goods .og-name{flex:1;min-width:0;color:#333}
.order-goods .og-meta{font-size:11px;color:#999}
.order-goods .og-price{flex:none;color:#555}
.btn-row{display:flex;gap:10px;margin-top:12px}
.btn-secondary{display:grid;flex:1;place-items:center;height:44px;border:1px solid #ddd;border-radius:4px;background:#fff;color:#555;font-size:14px;text-decoration:none}
.btn-secondary:active{background:#f7f7f7}

/* 客服与说明 */
.doc h3{margin:16px 0 6px;font-size:14px}
.doc h3:first-of-type{margin-top:0}
.doc p,.doc li{color:#555;font-size:13px;line-height:1.9}
.doc ul{margin:6px 0;padding-left:18px}
.doc .muted{color:#999;font-size:12px}
.contact-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid #f2f2f2;font-size:14px}
.contact-row:last-child{border-bottom:0}
.contact-row span{color:#999;font-size:13px}
.contact-row a,.contact-row strong{color:#333;font-weight:600;text-decoration:none}
.page-footer{max-width:560px;margin:0 auto;padding:4px 16px 28px;color:#aaa;font-size:11px;line-height:1.8;text-align:center}
.page-footer a{color:#999}

@media (max-width:350px){
  .page-main{padding-right:9px;padding-left:9px}
  .card{padding:12px}
  .primary-btn{min-width:120px;padding:0 18px}
}