.container { padding: 32rpx; background-color: #f5f5f5; box-sizing: border-box; min-height: 91.8vh; } .user-info { display: flex; align-items: center; margin-bottom: 40rpx; } .avatar { width: 120rpx; height: 120rpx; border-radius: 50%; margin-right: 32rpx; background-color: rgba(37, 131, 255, .5); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; } .avatar image { width: 100%; height: 100%; border-radius: 50%; } .user-detail { flex: 1; display: flex; flex-direction: column; position: relative; } .upload-tip { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 24rpx; text-align: center; padding: 8rpx; } .name { font-size: 32rpx; font-weight: bold; margin-bottom: 8rpx; } .phone { font-size: 28rpx; color: #666; } .section { background-color: #fff; border-radius: 16rpx; padding: 32rpx; margin-bottom: 32rpx; } .section-title { font-size: 32rpx; font-weight: bold; margin-bottom: 32rpx; } .order-list { display: flex; justify-content: center; } .order-item { display: flex; flex-direction: column; align-items: center; margin: 0 40rpx; } .order-icon { width: 80rpx; height: 80rpx; margin-bottom: 16rpx; } .order-label { font-size: 28rpx; color: #333; } .record-list { background-color: #fff; border-radius: 16rpx; padding: 0 32rpx; } .record-item { display: flex; justify-content: space-between; align-items: center; padding: 32rpx 0; border-bottom: 1rpx solid #eee; } .record-item:last-child { border-bottom: none; } .record-label { font-size: 28rpx; color: #333; } .arrow { width: 32rpx; height: 32rpx; } .checkout { width: 650rpx; height: 80rpx; background: #2583FF; border-radius: 100rpx 100rpx 100rpx 100rpx; display: flex; align-items: center; justify-content: center; font-weight: 400; font-size: 36rpx; color: #FFFFFF; margin-top: 30rpx; }