Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application will provide a streamlined interface for users to securely update their passwords. The primary goal is to enhance user security while ensuring a smooth and intuitive experience. The app will prioritize simplicity and efficiency, allowing users to manage their passwords effortlessly.

## CORE FEATURES
1. **User Authentication**: Secure login functionality to ensure that only authorized users can access the password update feature.
2. **Current Password Verification**: Users must enter their current password to confirm their identity before making changes.
3. **New Password Entry**: Input fields for entering a new password with real-time validation to ensure strength and compliance with security standards.
4. **Confirmation of New Password**: A second input field for users to confirm their new password.
5. **Success and Error Feedback**: Clear notifications to inform users of successful password updates or any errors encountered during the process.
6. **Responsive Design**: Ensure the application is fully functional and visually appealing on all device sizes, including mobile phones and tablets.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimized aesthetic with a focus on clean lines and ample whitespace. The design will avoid clutter, emphasizing the functionality of the password update feature.
- **Color Mode**: A light theme with dark text on light backgrounds, ensuring high readability and a pleasant user experience.
- **Layout**: A centered form layout with a vertical arrangement of input fields and buttons. Adequate spacing between elements will be maintained to enhance usability.
- **Typography**: Use sans-serif font for clarity and modernity. Headings should be bold and larger than body text to establish a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for better scalability and type safety.
- **Styling**: Tailwind CSS to facilitate rapid styling and ensure a responsive design.
- **UI Components**: Utilize shadcn/ui for pre-built components that align with the minimalist design.
- **State Management**: Implement React Context API or Zustand for managing authentication state as needed.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui library to the project.
3. **Create Authentication Context**: Implement a context provider for managing user authentication status and password update functionality.
4. **Build the Password Update Form**:
   - Create a new component for the password update form.
   - Include input fields for the current password, new password, and confirmation of the new password.
   - Apply Tailwind CSS classes for styling.
5. **Implement Validation Logic**: Add logic to verify the current password and validate the new password for length and complexity.
6. **Handle Form Submission**: Set up a function to handle form submission, including API calls to update the password and feedback messages for success or failure.
7. **Responsive Design Testing**: Ensure the application layout adapts smoothly to different screen sizes and devices.

## USER EXPERIENCE
Users will begin by logging into their accounts. Upon accessing the password update feature, they will see a clean, centered form inviting them to enter their current password, new password, and confirmation. Each field will provide immediate feedback regarding input validity. After submitting the form, users will receive clear notifications about the success or failure of their password update, ensuring a smooth and reassuring experience. The overall interaction will be intuitive, emphasizing ease of use and security.