"use client";
import { Suspense } from 'react';
import { useSearchParams } from 'next/navigation';
import { BookingForm } from '@/components/shared/BookingForm';

function BookingPageContent() {
  const searchParams = useSearchParams();
  const movieIdFromQuery = searchParams.get('movieId');

  return <BookingForm movieId={movieIdFromQuery} />;
}

export default function BookingPage() {
  return (
    <div className="container mx-auto px-4 py-12 flex justify-center items-start min-h-[calc(100vh-8rem)]">
        <Suspense fallback={<div>Cargando...</div>}>
            <BookingPageContent />
        </Suspense>
    </div>
  );
}