feat(bookings): add calendar UI with booking creation

- Add TimeSlot component with available/booked visual states
- Add BookingCalendar component with date navigation and court columns
- Add BookingDialog for creating bookings and viewing/cancelling existing ones
- Add bookings page with calendar integration
- Fix sidebar navigation paths for route group structure

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

apps/web/app/(admin)/bookings/page.tsx

@@ -0,0 +1,52 @@
+"use client";
+
+import { useState, useCallback } from "react";
+import { BookingCalendar, SelectedSlot } from "@/components/bookings/booking-calendar";
+import { BookingDialog } from "@/components/bookings/booking-dialog";
+
+export default function BookingsPage() {
+  const [selectedSlot, setSelectedSlot] = useState<SelectedSlot | null>(null);
+  const [refreshKey, setRefreshKey] = useState(0);
+
+  const handleSlotClick = useCallback((slot: SelectedSlot) => {
+    setSelectedSlot(slot);
+  }, []);
+
+  const handleCloseDialog = useCallback(() => {
+    setSelectedSlot(null);
+  }, []);
+
+  const handleBookingCreated = useCallback(() => {
+    // Refresh the calendar after booking creation
+    setRefreshKey((prev) => prev + 1);
+  }, []);
+
+  const handleBookingCancelled = useCallback(() => {
+    // Refresh the calendar after booking cancellation
+    setRefreshKey((prev) => prev + 1);
+  }, []);
+
+  return (
+    <div className="space-y-6">
+      <div>
+        <h1 className="text-2xl font-bold text-primary-800">Reservas</h1>
+        <p className="mt-2 text-primary-600">
+          Gestiona las reservas de canchas. Selecciona un horario para crear o ver una reserva.
+        </p>
+      </div>
+
+      <BookingCalendar key={refreshKey} onSlotClick={handleSlotClick} />
+
+      {selectedSlot && (
+        <BookingDialog
+          courtId={selectedSlot.courtId}
+          date={selectedSlot.date}
+          slot={selectedSlot}
+          onClose={handleCloseDialog}
+          onBookingCreated={handleBookingCreated}
+          onBookingCancelled={handleBookingCancelled}
+        />
+      )}
+    </div>
+  );
+}