I can see this is a Parking Booking System (ระบบจองที่จอดรถ) built as a simple HTML page. Let me recreate this as a polished Next.js app with proper design. Let me first check the existing project setup and generate design inspiration.

Now let me check the available shadcn components for inputs, labels, and badges:

Great, all the shadcn components I need are available. Now let me build the parking booking system. I'll update the theme, layout, and create the components.

Now let me update the layout with Thai language support and proper metadata:

Now let me create the parking slot grid component:

Now let me create the main page:

The Parking Booking System has been rebuilt as a modern Next.js app. Here's what I created:

• Theme: A professional blue-and-teal color scheme with custom design tokens for slot states (available/green, selected/blue, booked/red)
• Layout: A two-column responsive layout — booking details form on the left, interactive parking grid on the right — that stacks on mobile
• Slot Grid: 10 slots (A1-A10) as interactive buttons with car icons, visual state transitions, and accessibility labels
• Booking Flow: Date picker, check-in/out time inputs, license plate field, and confirmation with toast notifications. Recent bookings are tracked and displayed below the grid with badges.