Calendar Scheduling Component - Copy this Angular, Tailwind Component to your project

Build a single page application (SPA) using Angular and Tailwind CSS that replicates the functionality of Calendly for scheduling appointments. The page should include: Header and Navigation: A responsive navigation bar with the app logo and links to 'Home,' 'Appointments,' and 'Profile'. Calendar Integration: A dynamic, interactive calendar component where users can view available slots and select a date/time for appointments. Highlight available and unavailable days/times with clear visual indicators using Tailwind CSS. Appointment Form: After selecting a time, users should fill out a simple form with fields like name, email, and a brief message. Add validation for required fields and an intuitive, mobile friendly design. Backend Integration (Optional): If feasible, connect the calendar to a backend (e.g., Firebase or Node.js) to store user data and manage real time availability. Responsiveness: Ensure the page is fully responsive and looks great on mobile, tablet, and desktop screens. Use Tailwind CSS to achieve this. Styling and UX: Use modern, clean, and minimalist styles inspired by popular scheduling tools. Include smooth hover effects, modal transitions, and loading indicators. Provide reusable Angular components for modularity (e.g., separate components for the calendar, form, and navigation).