/* 订单结算页面样式 */ .checkout-section { margin-bottom: 1.5rem; } .address-card { cursor: pointer; transition: all 0.3s ease; border: 2px solid #e9ecef; } .address-card:hover { border-color: #007bff; box-shadow: 0 2px 8px rgba(0, 123, 255, 0.1); } .address-card.selected { border-color: #007bff; background-color: #e7f3ff; } .product-item { padding: 1rem 0; border-bottom: 1px solid #e9ecef; } .product-item:last-child { border-bottom: none; } .order-summary { background: #f8f9fa; padding: 1rem; border-radius: 0.5rem; } .price-row { display: flex; justify-content: space-between; margin-bottom: 0.5rem; } .price-row.total-price { font-size: 1.1rem; font-weight: bold; color: #dc3545; } .form-check { padding: 0.75rem; border: 1px solid #e9ecef; border-radius: 0.5rem; margin-bottom: 0.5rem; transition: all 0.3s ease; } .form-check:hover { border-color: #007bff; background-color: #f8f9fa; } .form-check-input:checked + .form-check-label { color: #007bff; } /* 支付方式特殊样式 */ .form-check input[type="radio"][value="simulate"]:checked + label { color: #ffc107; } .form-check input[type="radio"][value="simulate"]:checked + label i { color: #ffc107 !important; } /* 模拟支付说明样式 */ .alert-warning { border-left: 4px solid #ffc107; } /* 响应式设计 */ @media (max-width: 768px) { .checkout-section .col-md-4, .checkout-section .col-md-3 { margin-bottom: 1rem; } .address-card { margin-bottom: 1rem; } .product-item .col-md-2, .product-item .col-md-6 { margin-bottom: 0.5rem; } } /* 动画效果 */ @keyframes fadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .alert { animation: fadeIn 0.3s ease; } /* 按钮样式 */ .btn-lg { padding: 0.75rem 1.5rem; font-size: 1.1rem; } /* 卡片头部样式 */ .card-header h5 { margin-bottom: 0; color: #495057; } .card-header i { margin-right: 0.5rem; color: #007bff; } /* 表单标签样式 */ .form-check-label { cursor: pointer; width: 100%; } .form-check-label strong { display: block; margin-bottom: 0.25rem; } .form-check-label small { color: #6c757d; } /* 商品图片样式 */ .product-item img { max-height: 80px; object-fit: cover; } /* 价格显示样式 */ .fw-bold { color: #dc3545; } /* 面包屑导航样式 */ .breadcrumb { background: transparent; padding: 0; } .breadcrumb-item + .breadcrumb-item::before { color: #6c757d; }