diff --git a/app/dashboard/storefront/customers/page.tsx b/app/dashboard/storefront/customers/page.tsx
index 82234b4..5ffeae1 100644
--- a/app/dashboard/storefront/customers/page.tsx
+++ b/app/dashboard/storefront/customers/page.tsx
@@ -180,18 +180,18 @@ export default function CustomerManagementPage() {
               <Table>
                 <TableHeader>
                   <TableRow>
-                    <TableHead className="w-[300px]">Customer</TableHead>
+                    <TableHead className="w-[250px]">Customer</TableHead>
                     <TableHead 
-                      className="cursor-pointer"
+                      className="cursor-pointer w-[100px]"
                       onClick={() => handleSort("totalOrders")}
                     >
                       <div className="flex items-center">
-                        Total Orders
+                        Orders
                         <ArrowUpDown className="ml-2 h-4 w-4" />
                       </div>
                     </TableHead>
                     <TableHead 
-                      className="cursor-pointer"
+                      className="cursor-pointer w-[150px]"
                       onClick={() => handleSort("totalSpent")}
                     >
                       <div className="flex items-center">
@@ -199,7 +199,7 @@ export default function CustomerManagementPage() {
                         <ArrowUpDown className="ml-2 h-4 w-4" />
                       </div>
                     </TableHead>
-                    <TableHead>Status Breakdown</TableHead>
+                    <TableHead className="w-[250px]">Status</TableHead>
                   </TableRow>
                 </TableHeader>
                 <TableBody>
@@ -214,27 +214,24 @@ export default function CustomerManagementPage() {
                         <div className="text-sm text-gray-500">ID: {customer.telegramUserId}</div>
                       </TableCell>
                       <TableCell>
-                        <Badge variant="outline">{customer.totalOrders}</Badge>
+                        <Badge className="font-medium">{customer.totalOrders}</Badge>
                       </TableCell>
                       <TableCell className="font-medium">
                         {formatCurrency(customer.totalSpent)}
                       </TableCell>
                       <TableCell>
-                        <div className="flex space-x-1 text-xs">
-                          <Badge variant="outline" className="bg-blue-50 text-blue-700 dark:bg-blue-900/20 dark:text-blue-300 dark:hover:bg-blue-900/30">
-                            Paid: {customer.ordersByStatus.paid}
+                        <div className="flex space-x-1">
+                          <Badge className="bg-blue-100 text-blue-800 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-300">
+                            {customer.ordersByStatus.paid} Paid
                           </Badge>
-                          <Badge variant="outline" className="bg-green-50 text-green-700 dark:bg-green-900/20 dark:text-green-300 dark:hover:bg-green-900/30">
-                            Completed: {customer.ordersByStatus.completed}
+                          <Badge className="bg-green-100 text-green-800 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-300">
+                            {customer.ordersByStatus.completed} Completed
                           </Badge>
-                          <Badge variant="outline" className="bg-amber-50 text-amber-700 dark:bg-amber-900/20 dark:text-amber-300 dark:hover:bg-amber-900/30">
-                            Shipped: {customer.ordersByStatus.shipped}
+                          <Badge className="bg-amber-100 text-amber-800 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-300">
+                            {customer.ordersByStatus.shipped} Shipped
                           </Badge>
                         </div>
                       </TableCell>
-                      <TableCell>
-                       {/* {formatDate(customer.lastOrderDate)} */}
-                      </TableCell>
                     </TableRow>
                   ))}
                 </TableBody>
@@ -349,20 +346,20 @@ export default function CustomerManagementPage() {
                   </CardHeader>
                   <CardContent>
                     <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
-                      <div className="bg-blue-50 dark:bg-blue-900/20 p-3 rounded-md">
-                        <p className="text-sm text-blue-700 dark:text-blue-300">Paid</p>
+                      <div className="bg-blue-100 dark:bg-blue-900/30 p-3 rounded-md">
+                        <p className="text-sm text-blue-800 dark:text-blue-300">Paid</p>
                         <p className="text-xl font-semibold">{selectedCustomer.ordersByStatus.paid}</p>
                       </div>
-                      <div className="bg-purple-50 dark:bg-purple-900/20 p-3 rounded-md">
-                        <p className="text-sm text-purple-700 dark:text-purple-300">Acknowledged</p>
+                      <div className="bg-purple-100 dark:bg-purple-900/30 p-3 rounded-md">
+                        <p className="text-sm text-purple-800 dark:text-purple-300">Acknowledged</p>
                         <p className="text-xl font-semibold">{selectedCustomer.ordersByStatus.acknowledged}</p>
                       </div>
-                      <div className="bg-amber-50 dark:bg-amber-900/20 p-3 rounded-md">
-                        <p className="text-sm text-amber-700 dark:text-amber-300">Shipped</p>
+                      <div className="bg-amber-100 dark:bg-amber-900/30 p-3 rounded-md">
+                        <p className="text-sm text-amber-800 dark:text-amber-300">Shipped</p>
                         <p className="text-xl font-semibold">{selectedCustomer.ordersByStatus.shipped}</p>
                       </div>
-                      <div className="bg-green-50 dark:bg-green-900/20 p-3 rounded-md">
-                        <p className="text-sm text-green-700 dark:text-green-300">Completed</p>
+                      <div className="bg-green-100 dark:bg-green-900/30 p-3 rounded-md">
+                        <p className="text-sm text-green-800 dark:text-green-300">Completed</p>
                         <p className="text-xl font-semibold">{selectedCustomer.ordersByStatus.completed}</p>
                       </div>
                     </div>