From 6bcb6c54149f42b3e6e21a56643a67ac4b5716db Mon Sep 17 00:00:00 2001
From: iamkiddy <francisyoungson@gmail.com>
Date: Tue, 25 Nov 2025 20:39:47 +0000
Subject: [PATCH] Update Booking component UI for improved layout and
 responsiveness. Adjust class names for better styling consistency and ensure
 elements are properly sized with shrink properties. This enhances the overall
 user experience in managing availability.

---
 app/(admin)/admin/booking/page.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/(admin)/admin/booking/page.tsx b/app/(admin)/admin/booking/page.tsx
index 86c8c98..89eab3d 100644
--- a/app/(admin)/admin/booking/page.tsx
+++ b/app/(admin)/admin/booking/page.tsx
@@ -445,15 +445,15 @@ export default function Booking() {
                           return (
                             <div
                               key={dayNum}
-                              className={`flex items-center gap-2 px-2.5 py-1.5 rounded-lg text-sm max-w-[200px] ${
+                              className={`flex items-center gap-2 px-2.5 py-1.5 rounded-lg text-sm whitespace-nowrap ${
                                 isDark
                                   ? "bg-rose-500/10 text-rose-200 border border-rose-500/20"
                                   : "bg-rose-50 text-rose-700 border border-rose-200"
                               }`}
                             >
                               <Check className={`w-3.5 h-3.5 shrink-0 ${isDark ? "text-rose-400" : "text-rose-600"}`} />
-                              <span className="font-medium">{dayName}</span>
-                              <span className={`ml-auto text-sm ${isDark ? "text-rose-300" : "text-rose-600"}`}>
+                              <span className="font-medium shrink-0">{dayName}</span>
+                              <span className={`text-sm shrink-0 ${isDark ? "text-rose-300" : "text-rose-600"}`}>
                                 ({new Date(`2000-01-01T${timeRange.startTime}`).toLocaleTimeString("en-US", {
                                   hour: "numeric",
                                   minute: "2-digit",