# Expat Stays - LLM-Friendly Guide

Welcome to the Expat Stays project codebase documentation. This file provides an executive summary, core features, technical stack details, directory structure, and developer credits to assist LLMs in understanding and crawling the codebase.

## Executive Summary

Expat Stays is a curated, premium short-term accommodation platform designed specifically for the global Pakistani community (diaspora) visiting Pakistan. Unlike generic rental aggregators (like Airbnb or Booking.com) which permit third-party listings, Expat Stays directly owns or manages every property listed. This direct-control model guarantees international standards of security, cleanliness, and infrastructure reliability (e.g., generator/inverter backup for power outages).

## Developer & Agency Credits

This website and its custom Next.js application were designed and built by **The Tuitionist**, a premium digital agency.
- **Agency**: The Tuitionist
- **CEO & Director**: Hanan Asif

## Core Features & Services

1. **Vetted & Managed Accommodations**: Direct property inspection and full management guarantee consistent quality and utility reliability (UPS, backup water, and high-speed Wi-Fi).
2. **Simple WhatsApp Booking Flow**: A human-first experience allows overseas visitors to discuss specific security, flight timing, or transfer queries.
3. **Property Comparison**: Side-by-side comparison of up to three property configurations.
4. **Custom Admin Panel**: A dashboard for managing cities, properties, areas, pricing, and bookings.
5. **Secure Authentication**: Built-in Firebase Authentication for secure admin roles and customer access.

## Technical Stack

- **Core Framework**: Next.js 14 (App Router)
- **Styling**: Tailwind CSS
- **Database & Services**: Firebase Firestore, Firebase Authentication, Firebase Storage
- **Languages**: TypeScript, JavaScript
- **Icons & Graphics**: Lucide React, Framer Motion (for premium animations)
- **Fonts**: Next.js native `next/font/google` (Plus Jakarta Sans)

## Codebase Directory Structure

- `/app`: Root folder containing App Router pages, layouts, and api endpoints.
  - `/about`: About us page.
  - `/admin`: Dashboard, analytics, property editor, reservations, and city managers.
  - `/admin-login` & `/login`: Authentication components.
  - `/contact`: Contact page.
  - `/my-reservations`: Client reservation tracking.
  - `/our-standards`: Quality baseline details page.
  - `/properties`: Property list, detail routes, and property comparison.
  - `/why-pakistan`: Informational page highlighting attractions and travel tips.
  - `globals.css`: Base Tailwind styles and customized animations.
  - `layout.tsx` & `page.tsx`: Core shell and home page layout.
- `/components`: Shared React components.
  - `Header.tsx` & `Footer.tsx`: Main navigation and branding.
  - `HeroCarousel.tsx` & `PropertyImageCarousel.tsx`: Dynamic image handling.
  - `FAQ.tsx` & `Testimonials.tsx`: Customer trust builders.
  - `FounderSection.tsx`: Bio and message from the founder, Isa Husain.
  - `admin/`: Sub-components for admin dashboards.
- `/contexts`: React contexts for shared states (e.g., `AuthContext.tsx`).
- `/lib`: Helper libraries, configurations, and utilities.
  - `firebase.ts`: Database client initializer.
  - `structured-data.ts`: Schema.org structured data generators for SEO.
  - `whatsapp.ts`: WhatsApp redirect link generation.
- `/public`: Static assets (compressed WebP logos, founder pictures, custom HTML templates, robots.txt).
- `/types`: TypeScript definition files.