
/* === 购物车相关样式 === */

/* Header Cart Link */
.header-cart { color: #fff; margin-right: 10px; font-size: 14px; }
.header-cart:hover { color: var(--fgr-orange-light); }
.cart-count { display: inline-block; min-width: 18px; height: 18px; line-height: 18px; padding: 0 4px; background: var(--fgr-orange); color: #fff; border-radius: 9px; font-size: 12px; text-align: center; }
.cart-count.has-items { animation: cartBounce 0.3s ease; }
@keyframes cartBounce { 0% { transform: scale(1); } 50% { transform: scale(1.3); } 100% { transform: scale(1); } }

/* Floating Cart Button */
.fgr-side-btn-cart { background: var(--fgr-blue); }
.fgr-side-btn-cart:hover { background: var(--fgr-blue-dark); }

/* Add to Cart Button */
.btn-add-cart { display: inline-block; padding: 8px 20px; background: var(--fgr-orange); color: #fff; border: none; border-radius: 6px; font-size: 14px; cursor: pointer; transition: var(--fgr-transition); text-decoration: none; }
.btn-add-cart:hover { background: var(--fgr-orange-light, #FCD34D); color: var(--fgr-dark); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(245,158,11,0.3); }
.btn-add-cart.added { background: var(--fgr-green); }
.btn-add-cart:disabled { opacity: 0.7; cursor: not-allowed; }

/* Cart fly animation */
.cart-fly { pointer-events: none; }

/* Cart Page */
.cart-page { min-height: 600px; padding: 30px 0; }
.page-title { font-size: 28px; font-weight: 700; color: var(--fgr-dark); margin-bottom: 24px; }

.cart-list { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); overflow: hidden; }
.cart-header { display: flex; padding: 16px 20px; background: #f8f9fa; border-bottom: 2px solid #e9ecef; font-weight: 600; color: #495057; font-size: 14px; }
.cart-header .col-product { flex: 3; }
.cart-header .col-price { flex: 1; text-align: center; }
.cart-header .col-qty { flex: 1.5; text-align: center; }
.cart-header .col-subtotal { flex: 1; text-align: center; }
.cart-header .col-action { flex: 1; text-align: center; }

.cart-item { display: flex; align-items: center; padding: 20px; border-bottom: 1px solid #e9ecef; transition: background 0.2s; }
.cart-item:hover { background: #f8f9fa; }
.cart-item .col-product { flex: 3; }
.cart-item .col-price { flex: 1; text-align: center; color: var(--fgr-gray); }
.cart-item .col-qty { flex: 1.5; text-align: center; }
.cart-item .col-subtotal { flex: 1; text-align: center; color: var(--fgr-orange); font-weight: 600; font-size: 16px; }
.cart-item .col-action { flex: 1; text-align: center; }

.product-info { display: flex; flex-direction: column; gap: 4px; }
.product-title { font-size: 15px; font-weight: 600; color: var(--fgr-dark); }
.product-catid { font-size: 12px; color: var(--fgr-gray); }

.qty-control { display: inline-flex; align-items: center; border: 1px solid #dee2e6; border-radius: 6px; overflow: hidden; }
.qty-control button { width: 32px; height: 32px; border: none; background: #f8f9fa; cursor: pointer; font-size: 16px; color: #495057; transition: background 0.2s; }
.qty-control button:hover { background: #e9ecef; }
.qty-input { width: 50px; height: 32px; border: none; border-left: 1px solid #dee2e6; border-right: 1px solid #dee2e6; text-align: center; font-size: 14px; outline: none; }

.btn-remove { color: #dc3545; font-size: 14px; }
.btn-remove:hover { color: #c82333; text-decoration: underline; }

.cart-footer { display: flex; justify-content: space-between; align-items: center; padding: 20px; background: #f8f9fa; }
.cart-summary { display: flex; gap: 24px; align-items: center; }
.summary-count { font-size: 14px; color: var(--fgr-gray); }
.summary-total { font-size: 20px; }
.summary-total strong { color: var(--fgr-orange); font-size: 24px; }

.cart-actions { display: flex; gap: 12px; }
.btn-clear-cart { padding: 8px 16px; background: #fff; border: 1px solid #dee2e6; border-radius: 6px; color: #6c757d; cursor: pointer; font-size: 14px; text-decoration: none; transition: var(--fgr-transition); }
.btn-clear-cart:hover { border-color: #dc3545; color: #dc3545; }
.btn-go-address { padding: 8px 16px; background: #fff; border: 1px solid var(--fgr-blue); border-radius: 6px; color: var(--fgr-blue); cursor: pointer; font-size: 14px; text-decoration: none; }
.btn-go-address:hover { background: var(--fgr-blue); color: #fff; }
.btn-checkout { padding: 10px 32px; background: var(--fgr-orange); color: #fff; border: none; border-radius: 6px; font-size: 16px; font-weight: 600; cursor: pointer; text-decoration: none; transition: var(--fgr-transition); }
.btn-checkout:hover { background: #e09000; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(245,158,11,0.3); }

/* Empty State */
.cart-empty, .cart-login-prompt { text-align: center; padding: 60px 20px; background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); }
.empty-icon, .login-icon { font-size: 64px; margin-bottom: 16px; }
.cart-empty h2, .cart-login-prompt h2 { font-size: 22px; color: var(--fgr-dark); margin-bottom: 8px; }
.cart-empty p, .cart-login-prompt p { color: var(--fgr-gray); margin-bottom: 20px; }
.btn-go-shop, .btn-login { display: inline-block; padding: 10px 32px; background: var(--fgr-blue); color: #fff; border-radius: 6px; font-size: 16px; text-decoration: none; transition: var(--fgr-transition); }
.btn-go-shop:hover, .btn-login:hover { background: var(--fgr-blue-dark); color: #fff; }
.btn-register { display: inline-block; padding: 10px 32px; background: #fff; border: 2px solid var(--fgr-blue); color: var(--fgr-blue); border-radius: 6px; font-size: 16px; text-decoration: none; margin-left: 12px; }

/* Order Page */
.order-page { min-height: 600px; padding: 30px 0; }
.order-tabs { display: flex; gap: 0; margin-bottom: 24px; background: #fff; border-radius: var(--fgr-radius-lg); overflow: hidden; box-shadow: var(--fgr-shadow); }
.order-tab { flex: 1; padding: 12px 0; text-align: center; color: #495057; font-size: 14px; text-decoration: none; border-bottom: 3px solid transparent; transition: var(--fgr-transition); }
.order-tab:hover { background: #f8f9fa; color: var(--fgr-blue); }
.order-tab.active { color: var(--fgr-blue); border-bottom-color: var(--fgr-blue); font-weight: 600; }

.order-list { display: flex; flex-direction: column; gap: 16px; }
.order-card { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); overflow: hidden; }
.order-card-header { display: flex; align-items: center; gap: 20px; padding: 16px 20px; background: #f8f9fa; border-bottom: 1px solid #e9ecef; }
.order-sn { font-weight: 600; color: var(--fgr-dark); font-size: 15px; }
.order-time { color: var(--fgr-gray); font-size: 13px; }
.order-status { margin-left: auto; padding: 4px 12px; border-radius: 12px; font-size: 13px; font-weight: 600; }
.status-0 { background: #e9ecef; color: #6c757d; }
.status-1 { background: #fff3cd; color: #856404; }
.status-2 { background: #cce5ff; color: #004085; }
.status-3 { background: #d4edda; color: #155724; }
.status-4 { background: #d1ecf1; color: #0c5460; }
.status-5 { background: #f8d7da; color: #721c24; }

.order-card-body { padding: 16px 20px; }
.order-item-row { display: flex; align-items: center; gap: 16px; padding: 8px 0; border-bottom: 1px dashed #e9ecef; }
.order-item-row:last-child { border-bottom: none; }
.order-item-row .item-title { flex: 2; font-size: 14px; }
.order-item-row .item-price { color: var(--fgr-gray); font-size: 14px; }
.order-item-row .item-qty { color: var(--fgr-gray); font-size: 14px; }
.order-item-row .item-link { color: var(--fgr-blue); font-size: 13px; }

.order-card-footer { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: #f8f9fa; border-top: 1px solid #e9ecef; }
.order-total { font-size: 14px; color: var(--fgr-gray); }
.order-total strong { color: var(--fgr-orange); font-size: 18px; }
.order-actions { display: flex; gap: 8px; }
.btn-detail { padding: 6px 16px; background: var(--fgr-blue); color: #fff; border-radius: 4px; font-size: 13px; text-decoration: none; }
.btn-detail:hover { background: var(--fgr-blue-dark); color: #fff; }
.btn-cancel { padding: 6px 16px; background: #fff; border: 1px solid #dc3545; color: #dc3545; border-radius: 4px; font-size: 13px; text-decoration: none; }
.btn-cancel:hover { background: #dc3545; color: #fff; }
.btn-confirm { padding: 6px 16px; background: var(--fgr-green); color: #fff; border-radius: 4px; font-size: 13px; text-decoration: none; }

/* Order Detail Page */
.order-detail-page { min-height: 600px; padding: 30px 0; }
.order-detail-card { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); overflow: hidden; }
.detail-section { padding: 20px; border-bottom: 1px solid #e9ecef; }
.detail-section:last-child { border-bottom: none; }
.detail-section h3 { font-size: 16px; font-weight: 600; color: var(--fgr-dark); margin-bottom: 16px; }
.detail-row { display: flex; padding: 6px 0; }
.detail-label { min-width: 100px; color: var(--fgr-gray); font-size: 14px; }
.detail-value { color: var(--fgr-dark); font-size: 14px; }
.detail-value.price { color: var(--fgr-orange); font-size: 20px; font-weight: 700; }

.detail-item-row { display: flex; align-items: center; gap: 16px; padding: 10px 0; border-bottom: 1px dashed #e9ecef; }
.detail-item-row:last-child { border-bottom: none; }
.detail-item-row .item-title { flex: 2; }
.detail-item-row .item-subtotal { color: var(--fgr-orange); font-weight: 600; }
.btn-after-sale { padding: 4px 12px; background: #fff; border: 1px solid #dc3545; color: #dc3545; border-radius: 4px; font-size: 12px; text-decoration: none; cursor: pointer; }

.detail-actions { display: flex; gap: 12px; padding: 20px; justify-content: center; }
.btn-back { padding: 8px 20px; background: #fff; border: 1px solid #dee2e6; border-radius: 6px; color: #495057; text-decoration: none; font-size: 14px; }
.btn-back:hover { border-color: var(--fgr-gray); }

/* Address Page */
.address-page { min-height: 600px; padding: 30px 0; }
.address-actions { margin-bottom: 20px; }
.btn-add-address { padding: 10px 24px; background: var(--fgr-blue); color: #fff; border: none; border-radius: 6px; font-size: 14px; cursor: pointer; transition: var(--fgr-transition); }
.btn-add-address:hover { background: var(--fgr-blue-dark); }

.address-form-wrapper { margin-bottom: 24px; }
.address-form-card { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); padding: 24px; }
.address-form-card h3 { margin-bottom: 20px; font-size: 18px; color: var(--fgr-dark); }
.form-row { display: flex; align-items: center; margin-bottom: 16px; gap: 12px; }
.form-row label { min-width: 80px; color: var(--fgr-gray); font-size: 14px; }
.form-row input, .form-row textarea, .form-row select { flex: 1; padding: 8px 12px; border: 1px solid #dee2e6; border-radius: 4px; font-size: 14px; outline: none; transition: border-color 0.2s; }
.form-row input:focus, .form-row textarea:focus, .form-row select:focus { border-color: var(--fgr-blue); box-shadow: 0 0 0 2px rgba(37,99,235,0.1); }
.form-row textarea { min-height: 80px; resize: vertical; }
.form-actions { display: flex; gap: 12px; justify-content: flex-end; margin-top: 8px; }
.form-actions .btn-save { padding: 8px 24px; background: var(--fgr-blue); color: #fff; border: none; border-radius: 6px; font-size: 14px; cursor: pointer; }
.form-actions .btn-save:hover { background: var(--fgr-blue-dark); }
.form-actions .btn-cancel { padding: 8px 24px; background: #fff; border: 1px solid #dee2e6; color: #6c757d; border-radius: 6px; font-size: 14px; cursor: pointer; }

.address-list { display: flex; flex-direction: column; gap: 12px; }
.address-card { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: #fff; border-radius: var(--fgr-radius); box-shadow: var(--fgr-shadow); border: 2px solid transparent; transition: border-color 0.2s; }
.address-card.default { border-color: var(--fgr-blue); }
.address-name { font-size: 15px; font-weight: 600; color: var(--fgr-dark); margin-bottom: 4px; }
.address-phone { font-weight: 400; color: var(--fgr-gray); margin-left: 8px; }
.address-detail { font-size: 14px; color: var(--fgr-gray); }
.default-tag { display: inline-block; padding: 2px 8px; background: var(--fgr-blue); color: #fff; border-radius: 3px; font-size: 12px; margin-left: 8px; }
.address-actions-btns { display: flex; gap: 12px; }
.address-actions-btns a { font-size: 14px; text-decoration: none; color: var(--fgr-blue); cursor: pointer; }
.address-actions-btns a:hover { text-decoration: underline; }
.text-danger { color: #dc3545; }

/* Checkout Page */
.checkout-page { min-height: 600px; padding: 30px 0; }
.checkout-content { max-width: 800px; margin: 0 auto; }
.checkout-section { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); padding: 24px; margin-bottom: 20px; }
.checkout-section h3 { font-size: 16px; font-weight: 600; color: var(--fgr-dark); margin-bottom: 16px; }
.checkout-items { display: flex; flex-direction: column; gap: 12px; }
.checkout-item { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px dashed #e9ecef; }
.checkout-item:last-child { border-bottom: none; }
.checkout-item .item-title { flex: 2; }
.checkout-item .item-price { color: var(--fgr-gray); }
.checkout-item .item-subtotal { color: var(--fgr-orange); font-weight: 600; }
.checkout-total { text-align: right; padding-top: 12px; font-size: 18px; }
.checkout-total strong { color: var(--fgr-orange); font-size: 22px; }

.address-select-list { display: flex; flex-direction: column; gap: 12px; }
.address-select-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 2px solid #e9ecef; border-radius: 6px; cursor: pointer; transition: border-color 0.2s; }
.address-select-item:hover { border-color: var(--fgr-blue); }
.address-select-item input[type="radio"] { margin: 0; }
.address-select-item .addr-name { font-weight: 600; }
.address-select-item .addr-phone { color: var(--fgr-gray); }
.address-select-item .addr-text { color: var(--fgr-gray); font-size: 14px; }
.btn-add-new-address { display: inline-block; margin-top: 12px; color: var(--fgr-blue); text-decoration: none; font-size: 14px; }

.checkout-section textarea { width: 100%; padding: 12px; border: 1px solid #dee2e6; border-radius: 4px; font-size: 14px; resize: vertical; }
.checkout-submit { text-align: center; }
.btn-submit-order { padding: 12px 48px; background: var(--fgr-orange); color: #fff; border: none; border-radius: 6px; font-size: 18px; font-weight: 600; cursor: pointer; transition: var(--fgr-transition); }
.btn-submit-order:hover { background: #e09000; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(245,158,11,0.3); }

/* After Sale Form */
.after-sale-form-wrapper { margin-top: 24px; }
.after-sale-form-card { background: #fff; border-radius: var(--fgr-radius-lg); box-shadow: var(--fgr-shadow); padding: 24px; }

/* Pagination */
.pagination { text-align: center; margin-top: 24px; }
.pagination a, .pagination span { display: inline-block; padding: 6px 12px; margin: 0 2px; border: 1px solid #dee2e6; border-radius: 4px; color: #495057; text-decoration: none; font-size: 14px; }
.pagination a:hover { background: var(--fgr-blue); color: #fff; border-color: var(--fgr-blue); }
.pagination .current { background: var(--fgr-blue); color: #fff; border-color: var(--fgr-blue); }

/* Responsive */
@media (max-width: 768px) {
  .cart-header { display: none; }
  .cart-item { flex-wrap: wrap; gap: 10px; padding: 16px; }
  .cart-item .col-product { width: 100%; flex: none; }
  .cart-item .col-price, .cart-item .col-qty, .cart-item .col-subtotal, .cart-item .col-action { flex: 1; text-align: center; }
  .cart-footer { flex-direction: column; gap: 12px; }
  .cart-actions { width: 100%; justify-content: center; flex-wrap: wrap; }
  .order-tabs { overflow-x: auto; }
  .order-tab { padding: 10px 16px; white-space: nowrap; }
  .order-card-header { flex-wrap: wrap; gap: 8px; }
  .order-card-footer { flex-direction: column; gap: 12px; }
  .address-card { flex-direction: column; align-items: flex-start; gap: 8px; }
  .checkout-section { padding: 16px; }
  .checkout-item { flex-wrap: wrap; }
}
