fix(ui): repair vehicle and booking list filtering and pagination

Vehicles and Bookings both computed a filtered (and, for bookings, paginated)
result but rendered the original unfiltered array in the table body, so
search, status and attention filters had no visible effect and every booking
rendered on every page regardless of the 25-row limit. Render the computed
result instead, and clamp the current booking page when a filter change
shrinks the result set below it.

frontend/src/pages/Bookings.tsx

@@ -26,6 +26,15 @@ export function Bookings() {
       .catch(() => setError("Booking list is unavailable right now."));
   }, [status]);
 
+  useEffect(() => {
+    if (!bookings) return;
+    const filteredCount = bookings.filter((b) =>
+      `${b.public_ref} ${b.customer_name} ${b.vehicle_ref}`.toLowerCase().includes(query.toLowerCase()),
+    ).length;
+    const totalPages = Math.max(1, Math.ceil(filteredCount / perPage));
+    setPage((p) => Math.min(p, totalPages));
+  }, [bookings, query]);
+
   return (
     <div className="page">
       <PageHeader eyebrow="Operations / Schedule" title="Bookings" description="Review active rental windows and upcoming vehicle commitments." />
@@ -68,7 +77,7 @@ export function Bookings() {
             </tr>
           </thead>
           <tbody>
-            {bookings.map((b) => (
+            {visible.map((b) => (
               <tr key={b.public_ref}>
                 <th scope="row" data-label="Reference">
                   <Link to={`/bookings/${b.public_ref}`}>{b.public_ref}</Link>

frontend/src/pages/Vehicles.tsx

@@ -75,7 +75,7 @@ export function Vehicles() {
             </tr>
           </thead>
           <tbody>
-            {vehicles.map((v) => (
+            {filtered.map((v) => (
               <tr key={v.public_ref} className={v.attention ? "row-attention" : ""}>
                 <th scope="row" data-label="Reference">
                   <Link to={`/vehicles/${v.public_ref}`}>{v.public_ref}</Link>