/* pages/refund/refund-apply/index.wxss */ .refund-apply-page { background-color: #f5f5f5; min-height: 100vh; padding-bottom: 120rpx; } /* 页面标题 */ .page-header { background: #fff; padding: 30rpx; border-bottom: 1rpx solid #eee; } .page-title { font-size: 36rpx; font-weight: 600; color: #333; } /* 通用区块样式 */ .order-section, .amount-section, .reason-section, .description-section { background: #fff; margin-top: 20rpx; padding: 30rpx; } .section-title { font-size: 32rpx; font-weight: 600; color: #333; margin-bottom: 30rpx; } /* 订单信息 */ .order-card { background: #f8f9fa; border-radius: 12rpx; padding: 24rpx; border: 1rpx solid #e9ecef; } .order-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16rpx; } .order-no { font-size: 28rpx; color: #666; } .order-status { font-size: 24rpx; color: #007aff; background: #e3f2fd; padding: 8rpx 16rpx; border-radius: 20rpx; } .order-amount { display: flex; align-items: center; } .amount-label { font-size: 28rpx; color: #666; } .amount-value { font-size: 32rpx; font-weight: 600; color: #ff4757; margin-left: 8rpx; } /* 退款金额 */ .amount-input-wrapper { display: flex; align-items: center; background: #f8f9fa; border-radius: 12rpx; padding: 24rpx; border: 1rpx solid #e9ecef; } .currency-symbol { font-size: 36rpx; font-weight: 600; color: #333; margin-right: 16rpx; } .amount-input { flex: 1; font-size: 36rpx; font-weight: 600; color: #333; } .amount-tips { display: flex; justify-content: space-between; align-items: center; margin-top: 16rpx; } .tips-text { font-size: 24rpx; color: #999; } .quick-fill { font-size: 24rpx; color: #007aff; padding: 8rpx 16rpx; background: #e3f2fd; border-radius: 20rpx; } /* 退款原因 */ .reason-options { display: flex; flex-direction: column; gap: 16rpx; } .reason-option { display: flex; justify-content: space-between; align-items: center; padding: 24rpx; background: #f8f9fa; border-radius: 12rpx; border: 1rpx solid #e9ecef; transition: all 0.3s ease; } .reason-option.selected { background: #e3f2fd; border-color: #007aff; } .reason-text { font-size: 28rpx; color: #333; } .reason-check { width: 40rpx; height: 40rpx; border-radius: 50%; border: 2rpx solid #ddd; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; } .reason-check.checked { background: #007aff; border-color: #007aff; } .check-icon { font-size: 24rpx; color: #fff; font-weight: 600; } /* 自定义原因 */ .custom-reason { margin-top: 20rpx; } .reason-textarea { width: 100%; min-height: 120rpx; background: #f8f9fa; border-radius: 12rpx; padding: 20rpx; font-size: 28rpx; color: #333; border: 1rpx solid #e9ecef; box-sizing: border-box; } /* 退款说明 */ .description-textarea { width: 100%; min-height: 160rpx; background: #f8f9fa; border-radius: 12rpx; padding: 20rpx; font-size: 28rpx; color: #333; border: 1rpx solid #e9ecef; box-sizing: border-box; } .char-count { text-align: right; font-size: 24rpx; color: #999; margin-top: 8rpx; } /* 提交按钮 */ .submit-section { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; padding: 20rpx 30rpx; border-top: 1rpx solid #eee; z-index: 100; } .submit-btn { width: 100%; height: 88rpx; border-radius: 44rpx; font-size: 32rpx; font-weight: 600; border: none; transition: all 0.3s ease; } .submit-btn.enabled { background: #007aff; color: #fff; } .submit-btn.disabled { background: #f5f5f5; color: #ccc; } /* 温馨提示 */ .tips-section { background: #fff; margin-top: 20rpx; padding: 30rpx; } .tips-title { font-size: 28rpx; font-weight: 600; color: #333; margin-bottom: 20rpx; } .tips-content { display: flex; flex-direction: column; gap: 12rpx; } .tip-item { font-size: 24rpx; color: #666; line-height: 1.6; } /* 加载状态 */ .loading-wrapper { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-content: center; z-index: 1000; } .loading-content { display: flex; flex-direction: column; align-items: center; gap: 20rpx; } .loading-spinner { width: 60rpx; height: 60rpx; border: 4rpx solid #f3f3f3; border-top: 4rpx solid #007aff; border-radius: 50%; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .loading-text { font-size: 28rpx; color: #666; } /* 错误状态 */ .error-wrapper { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-content: center; z-index: 1000; } .error-content { display: flex; flex-direction: column; align-items: center; gap: 20rpx; padding: 40rpx; } .error-icon { font-size: 80rpx; } .error-text { font-size: 28rpx; color: #666; text-align: center; } .retry-btn { background: #007aff; color: #fff; border: none; border-radius: 44rpx; padding: 16rpx 32rpx; font-size: 28rpx; }