Styled Card - Copy this React, Mui Component to your project

{ "status": 200, "summary": { "totalCustomers": 6, "totalRequests": 57, "totalRevenue": 1882000 }, "data": [ { "rank": 1, "customerId": "67c1ce1a64ed06656d164762", "name": "Trần Phan Quốc", "email": "Không có", "phoneNumber": "0855673461", "totalRequests": 34, "totalRevenue": 101000, "revenuePercentage": "5.37", "averageFrequency": "0.19 ngày" }, { "rank": 2, "customerId": "67c1cd0c9c00d4b111111258", "name": "Hoàng Hiệp Trương", "email": "Không có", "phoneNumber": "0379866596", "totalRequests": 10, "totalRevenue": 120000, "revenuePercentage": "6.38", "averageFrequency": "1.76 ngày" }, { "rank": 3, "customerId": "67cf9ea8638787184cb83ee4", "name": "Nguyễn Văn Bát", "email": "Không có", "phoneNumber": "0336221396", "totalRequests": 5, "totalRevenue": 941000, "revenuePercentage": "50.00", "averageFrequency": "2.22 ngày" }, { "rank": 4, "customerId": null, "name": "", "email": "Không có", "phoneNumber": "Không có", "totalRequests": 4, "totalRevenue": 200000, "revenuePercentage": "10.63", "averageFrequency": "4.73 ngày" }, { "rank": 5, "customerId": "67e6747ecc9c2636403ac8dd", "name": "Vũ Việt Vượng", "email": "Không có", "phoneNumber": "0399421133", "totalRequests": 3, "totalRevenue": 320000, "revenuePercentage": "17.00", "averageFrequency": "7.50 ngày" }, { "rank": 6, "customerId": "67be00ef194a2ae0b0858ec5", "name": "Trương Hoàng Hiệp", "email": "Không có", "phoneNumber": "0379866596", "totalRequests": 1, "totalRevenue": 200000, "revenuePercentage": "10.63", "averageFrequency": "Không xác định" } ], "charts": { "pieChart": [ { "name": "Trần Phan Quốc", "value": 101000 }, { "name": "Hoàng Hiệp Trương", "value": 120000 }, { "name": "Nguyễn Văn Bát", "value": 941000 }, { "name": "", "value": 200000 }, { "name": "Vũ Việt Vượng", "value": 320000 }, { "name": "Trương Hoàng Hiệp", "value": 200000 } ], "barChart": [ { "month": "3/2025", "totalRevenue": 1781000 }, { "month": "4/2025", "totalRevenue": 101000 } ] } }