Merge pull request 'Refine appointment detail styles and enhance status handling' (#69) from feat/booking-panel into master

Reviewed-on: http://35.207.46.142/ATTUNE-HEART-THERAPY/website/pulls/69

app/(admin)/admin/booking/[id]/page.tsx

@@ -845,7 +845,7 @@ export default function AppointmentDetailPage() {
                           disabled
                           className={`flex items-center justify-center gap-2 w-full cursor-not-allowed h-12 rounded-lg text-sm sm:text-base font-medium transition-colors ${isDark ? "bg-gray-700 text-gray-500" : "bg-gray-300 text-gray-500"}`}
                         >
-                          <Video className="w-4 h-4 sm:w-5 sm:h-5 flex-shrink-0" />
+                          <Video className="w-4 h-4 sm:w-5 sm:h-5 shrink-0" />
                           <span className="text-center px-1">
                             <span className="hidden sm:inline">Meeting would be available to join starting at </span>
                             <span className="sm:hidden">Available at </span>

app/(user)/user/dashboard/page.tsx

@@ -369,6 +369,8 @@ export default function UserDashboard() {
                             case "completed":
                               return isDark ? 'bg-blue-900/30 text-blue-400' : 'bg-blue-50 text-blue-700';
                             case "rejected":
+                            case "cancelled":
+                            case "canceled":
                               return isDark ? 'bg-red-900/30 text-red-400' : 'bg-red-50 text-red-700';
                             default:
                               return isDark ? 'bg-gray-700 text-gray-300' : 'bg-gray-100 text-gray-700';