booking/templates/booking.html

{% extends 'base.html' %}
{% block title %}Booking{% endblock %}

{% block content %}
<div class="row justify-content-center">
    <div class="col-md-6">
        <h1 class="text-center">Book {{ listing.title }}</h1>
        <form method="POST">
            <div class="mb-3">
                <label for="check_in" class="form-label">Check-in Date</label>
                <input type="date" class="form-control" id="check_in" name="check_in" required>
            </div>
            <div class="mb-3">
                <label for="check_out" class="form-label">Check-out Date</label>
                <input type="date" class="form-control" id="check_out" name="check_out" required>
            </div>
            <div class="mb-3">
                <label for="guests" class="form-label">Number of Guests</label>
                <input type="number" class="form-control" id="guests" name="guests" required min="1" max="{{ listing.guests }}" value="1">
            </div>
            <button type="submit" class="btn btn-primary w-100">Confirm Booking</button>
        </form>
    </div>
</div>
{% endblock %}