.container.data-v-eade9ab2 { width: 100%; height: 100vh; min-height: 100vh; background-color: #F5F5F5; display: flex; padding-top: 30px; box-sizing: border-box; flex-direction: column; box-sizing: border-box; overflow: hidden; } .header.data-v-eade9ab2 { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 30rpx; padding-top: calc(20rpx + env(safe-area-inset-top)); background-color: #FFFFFF; border-bottom: 1rpx solid #F0F0F0; position: relative; flex-shrink: 0; box-sizing: border-box; } .back-btn.data-v-eade9ab2 { width: 60rpx; height: 60rpx; display: flex; align-items: center; justify-content: center; z-index: 10; } .back-icon.data-v-eade9ab2 { font-size: 40rpx; color: #333333; font-weight: bold; } .header-title.data-v-eade9ab2 { position: absolute; left: 50%; transform: translateX(-50%); font-size: 36rpx; font-weight: bold; color: #333333; } .header-right.data-v-eade9ab2 { width: 60rpx; } .scroll-content.data-v-eade9ab2 { flex: 1; width: 100%; height: 0; overflow: hidden; padding: 40rpx 30rpx; padding-bottom: calc(40rpx + env(safe-area-inset-bottom)); box-sizing: border-box; } .amount-section.data-v-eade9ab2 { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60rpx 0; margin-bottom: 40rpx; } .amount-label.data-v-eade9ab2 { font-size: 28rpx; color: #999999; margin-bottom: 20rpx; } .amount-value.data-v-eade9ab2 { font-size: 64rpx; font-weight: bold; color: #333333; } .payment-card.data-v-eade9ab2 { background-color: #FFFFFF; border-radius: 16rpx; overflow: hidden; } .payment-item.data-v-eade9ab2 { display: flex; align-items: center; justify-content: space-between; padding: 30rpx; border-bottom: 1rpx solid #F0F0F0; } .payment-item.data-v-eade9ab2:last-child { border-bottom: none; } .payment-left.data-v-eade9ab2 { display: flex; align-items: center; flex: 1; } .payment-icon.data-v-eade9ab2 { width: 80rpx; height: 80rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 30rpx; } .payment-icon-text.data-v-eade9ab2 { font-size: 40rpx; } .payment-name.data-v-eade9ab2 { font-size: 30rpx; color: #333333; } .payment-radio.data-v-eade9ab2 { width: 40rpx; height: 40rpx; border-radius: 50%; border: 2rpx solid #CCCCCC; display: flex; align-items: center; justify-content: center; background-color: #FFFFFF; } .payment-radio.checked.data-v-eade9ab2 { border-color: #4FC3F7; background-color: #4FC3F7; } .radio-dot.data-v-eade9ab2 { width: 16rpx; height: 16rpx; border-radius: 50%; background-color: #FFFFFF; } .confirm-section.data-v-eade9ab2 { padding: 30rpx; background-color: #FFFFFF; border-top: 1rpx solid #F0F0F0; padding-bottom: calc(30rpx + env(safe-area-inset-bottom)); flex-shrink: 0; box-sizing: border-box; } .confirm-btn.data-v-eade9ab2 { width: 100%; height: 88rpx; background-color: #4FC3F7; color: #FFFFFF; font-size: 32rpx; font-weight: bold; border: none; border-radius: 44rpx; display: flex; align-items: center; justify-content: center; } .confirm-btn.data-v-eade9ab2::after { border: none; }