Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web-based platform designed for users seeking the best transportation options for their moving needs. It allows users to input their specific requirements and compare various moving companies based on price, services, and availability, ensuring a quick and efficient selection process.

## CORE FEATURES
1. **Editable Search Bar**: A user-friendly search bar at the top allows users to input their origin city, destination city, moving date, size of the move (S/M/L), additional services (packing, furniture assembly, storage), and an 'Update Results' button for real-time filtering.
2. **Permanent Side Filters**: Visible filters on the side of the screen for price range, ratings, availability, type of company (freelancer/small/medium), extra services, and estimated moving time, enabling users to refine their search easily.
3. **Comparative Cards**: A vertical list of comparison cards for each moving company, displaying essential information such as company name and logo, estimated price, acceptable moving sizes, star ratings, number of reviews, availability, included services, a brief description, and a call-to-action button 'Select this option'.
4. **Recommendations Section**: Highlighted recommendations based on user feedback, such as 'Top recommended by other users', using badges or a distinct section to draw attention.
5. **Sorting Options**: Users can sort results based on criteria like best option, lowest price, highest rating, and nearest availability, helping them make informed decisions quickly.
6. **Trust Microcopy**: Incorporate reassuring microcopy like 'Verified companies', 'Support included', and 'Insurance available' to enhance user trust.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Emphasizes a clean and simple design with ample white space, a minimal color palette, and a strong focus on typography to ensure clarity and ease of use.
- **Color Mode**: Light theme with dark text on light backgrounds to maintain readability and a modern feel.
- **Layout**: A top navigation bar featuring the editable search bar, with a two-column layout where the left column showcases permanent filters and the right column displays the comparative cards. The recommendations section is positioned prominently above the comparison cards for visibility.
- **Typography**: Use a sans-serif font like 'Inter' for a modern feel, employing a hierarchy where headings are bold and larger, subheadings are medium weight, and body text is regular weight for easy reading.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and modular component architecture.
- **Styling**: Tailwind CSS for utility-first styling that allows for rapid design iterations.
- **UI Components**: Utilize shadcn/ui for pre-built components, ensuring a cohesive design language.
- **State Management**: Use React's Context API or Zustand for managing global state, especially for user preferences and selections.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui components.
2. **Create Layout Structure**: Develop the main layout with a top navigation bar, side filters, and a right column for comparative cards. Ensure responsiveness for various screen sizes.
3. **Implement Search Bar**: Build the editable search bar component, integrating form handling to capture user inputs.
4. **Design Filters**: Create sidebar filter components that allow users to select their preferences dynamically.
5. **Develop Comparative Cards**: Construct the card component to display moving companies' details, including a dynamic display based on user-selected filters.
6. **Integrate Recommendations**: Add a section for highlighted recommendations, ensuring it is visually distinct and easy to locate.
7. **Implement Sorting Functionality**: Develop sorting options and link them to the results displayed in the cards.
8. **Add Microcopy**: Ensure trust-building microcopy is present throughout the interface, particularly near cards and the search bar.

## USER EXPERIENCE
Users will interact with the application by entering their moving details into the search bar, refining their results using the side filters, and viewing comparative cards that make it easy to assess options at a glance. The sorting functionality allows them to prioritize their search criteria, while the recommendations section guides them toward highly-rated services. This intuitive flow ensures users can quickly and confidently select the best moving option tailored to their needs.