| .userCenterContainer { |
| max-width: 1200px; |
| margin: 0 auto; |
| padding: 24px; |
| min-height: 100vh; |
| background: #f5f5f5; |
| } |
| |
| .userCenterCard { |
| background: #fff; |
| border-radius: 8px; |
| box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); |
| } |
| |
| .tabContent { |
| padding: 16px 0; |
| } |
| |
| .tabHeader { |
| margin-bottom: 16px; |
| display: flex; |
| justify-content: space-between; |
| align-items: center; |
| } |
| |
| .emptyState { |
| text-align: center; |
| padding: 60px 0; |
| color: #999; |
| } |
| |
| .emptyState p { |
| margin-top: 16px; |
| font-size: 16px; |
| } |
| |
| .paymentModal { |
| text-align: center; |
| } |
| |
| .paymentInfo { |
| margin-bottom: 24px; |
| padding: 16px; |
| background: #f9f9f9; |
| border-radius: 8px; |
| } |
| |
| .paymentInfo h3 { |
| margin: 0 0 8px 0; |
| color: #1890ff; |
| } |
| |
| .paymentInfo p { |
| margin: 4px 0; |
| color: #666; |
| } |
| |
| .qrCode { |
| margin: 24px 0; |
| } |
| |
| .qrCodePlaceholder { |
| padding: 24px; |
| border: 2px dashed #d9d9d9; |
| border-radius: 8px; |
| background: #fafafa; |
| } |
| |
| .mockQrCode { |
| width: 120px; |
| height: 120px; |
| margin: 16px auto; |
| border: 1px solid #d9d9d9; |
| border-radius: 8px; |
| display: flex; |
| flex-direction: column; |
| justify-content: center; |
| align-items: center; |
| background: #fff; |
| } |
| |
| .mockQrCode p { |
| margin: 4px 0; |
| font-size: 12px; |
| color: #666; |
| } |
| |
| .paymentActions { |
| margin-top: 24px; |
| } |