import { CreatePlanForm } from "@/components/create-plan-form";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";

export default function Home() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-center p-4 bg-muted/20">
      <div className="w-full max-w-md space-y-4">
        <div className="text-center space-y-2">
          <h1 className="text-3xl font-bold tracking-tighter">Cat Sitting Planner</h1>
          <p className="text-muted-foreground">Coordinate care for your furry friends while you're away.</p>
        </div>

        <Card>
          <CardHeader>
            <CardTitle>Create a New Plan</CardTitle>
            <CardDescription>Select your travel dates and set a group password.</CardDescription>
          </CardHeader>
          <CardContent>
            <CreatePlanForm />
          </CardContent>
        </Card>
      </div>
    </main>
  );
}