/* 订单详情页面样式 */ page { background-color: #f5f7fb; } /* 容器样式 */ .order-detail-container { padding: 0; margin: 0; display: flex; flex-direction: column; } /* 支付金额头部 */ .payment-header { background-color: #ffffff; padding: 30rpx; border-bottom: 1rpx solid #f0f0f0; margin-top: 20rpx; } .amount-info { display: flex; align-items: baseline; } .amount-symbol { font-size: 32rpx; color: #333333; } .amount-value { font-size: 40rpx; font-weight: bold; color: #333333; margin-left: 10rpx; } .payment-status { font-size: 24rpx; color: #ffffff; background-color: #ff4219; padding: 2rpx 15rpx; border-radius: 30rpx; margin-left: 15rpx; } /* 订单详情内容 */ .order-content { padding: 40rpx 40rpx 0 40rpx; background-color: #ffffff; } .detail-item { display: flex; justify-content: space-between; align-items: center; padding: 30rpx 0; } .detail-label { font-size: 26rpx; color: #a7a7a7; width: 180rpx; } .detail-value { font-size: 26rpx; color: #333333; flex: 1; text-align: right; } .park-type { color: #ff4219; margin-right: 10rpx; } /* 支付方式选择 */ .payment-method { margin-top: 20rpx; background-color: #ffffff; padding: 30rpx 40rpx; } .method-item { display: flex; justify-content: space-between; align-items: center; } .method-info { display: flex; align-items: center; } .method-info-img { width: 50rpx; height: 50rpx; margin-right: 20rpx; } .method-text { font-size: 32rpx; color: #333333; } /* 底部支付栏 */ .bottom-payment { display: flex; align-items: center; justify-content: space-between; padding: 30rpx 40rpx; background-color: #ffffff; border-top: 1rpx solid #f0f0f0; position: fixed; bottom: 0; left: 0; right: 0; z-index: 999; } .total-amount { display: flex; align-items: baseline; } .total-label { font-size: 32rpx; color: #666666; } .total-value { font-size: 40rpx; font-weight: bold; color: #ff4219; margin-left: 10rpx; } .pay-button { background-color: #ff4219; color: #ffffff; padding: 20rpx 60rpx; border-radius: 50rpx; } .pay-text { font-size: 34rpx; font-weight: bold; color: #ffffff; }