Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed to facilitate the creation and management of online surveys. Users will be able to distribute unique access codes to participants, allowing them to complete the survey securely. The application will provide a professional and minimalist aesthetic while ensuring all survey questions fit comfortably on the screen with scroll functionality.

## CORE FEATURES
1. **User Authentication**: Participants can log in using unique access codes sent to their corporate email addresses, ensuring secure access to the survey.
2. **Survey Creation**: Administrators can create surveys with various question types, including multiple-choice and open-ended responses, using a simple and intuitive interface.
3. **Progress Tracking**: Users will see their progress throughout the survey, including the number of questions completed and how many remain, to enhance user engagement.
4. **Responsive Design**: The application will be fully responsive, ensuring usability across different devices and screen sizes.
5. **Data Storage**: All user responses and survey data will be stored securely in a database, allowing easy retrieval and analysis.
6. **Conditional Logic**: The survey will skip irrelevant questions based on previous answers, making the experience more personalized and efficient.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The main layout will feature a single-page scroll design where questions are grouped logically. The header will include the logos of both companies, followed by the survey questions, and a progress bar at the bottom.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: React Context API or Redux (if needed for complex state management).

## IMPLEMENTATION STEPS
1. **Setup the React Environment**: Initialize a new React project with TypeScript and Tailwind CSS.
2. **Create Authentication Module**: Implement user authentication using access codes. Set up backend integration for user management and security.
3. **Develop Survey Creation Interface**: Build a user-friendly form for creating surveys, allowing for different question types and conditional logic.
4. **Implement Progress Tracking**: Create a progress bar that updates as users complete questions, displaying the total number of questions and how many have been answered.
5. **Design Responsive Layout**: Ensure the application layout is responsive and fits all screens, incorporating the minimalist design principles specified.
6. **Connect to Database**: Set up a database to store survey responses and user details, ensuring secure data handling.
7. **Testing and Feedback**: Conduct thorough testing to ensure all features work as intended and gather feedback for improvements.

## USER EXPERIENCE
Participants will receive an email with their unique access code, allowing them to log in to the survey. Upon entering, they will see the survey title and logos of the companies. As they answer questions, they will have a clear indication of their progress. The interface will scroll smoothly to the next set of questions, and optional questions will be skipped based on prior responses, ensuring a personalized experience. The overall design will be clean and professional, making it easy for users to engage with the survey.