fix: 修复购物车移动端布局排序和商品图片显示问题

- 移除订单摘要的order: -1，保持正常顺序
- 移动端商品图片改为横向布局，图片大小80x80px
- 支付方式改为2列显示

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/views/user/Cart.vue

@@ -926,12 +926,15 @@ onMounted(() => {
 
   .cart-summary-panel {
     position: static;
-    order: -1;
     margin-bottom: 20px;
   }
 }
 
 @media (max-width: 768px) {
+  .cart-page {
+    padding-bottom: 20px;
+  }
+
   .cart-header {
     display: none;
   }
@@ -950,17 +953,22 @@ onMounted(() => {
   }
 
   .item-product {
-    flex-direction: column;
+    gap: 12px;
-    gap: 8px;
 
     .item-image {
-      width: 100%;
+      width: 80px;
-      height: 120px;
+      height: 80px;
+      flex-shrink: 0;
     }
   }
 
+  .item-info {
+    flex: 1;
+    min-width: 0;
+  }
+
   .payment-methods {
-    grid-template-columns: 1fr;
+    grid-template-columns: repeat(2, 1fr);
   }
 
   .cart-left {
@@ -970,5 +978,19 @@ onMounted(() => {
   .checkout-section {
     padding: 16px;
   }
+
+  .cart-summary-panel {
+    padding: 16px;
+  }
+
+  .summary-title {
+    font-size: 16px;
+    margin-bottom: 16px;
+    padding-bottom: 12px;
+  }
+
+  .summary-total .total-amount {
+    font-size: 20px;
+  }
 }
 </style>