{% extends "base.html" %}
{% load static %}

{% block content %}
<div class="container mt-5">
    <div class="row">
        <div class="col-md-8">
            <div class="card">
                <img src="{{ property.image.url }}" class="card-img-top" alt="{{ property.title }}">
                <div class="card-body">
                    <h2 class="card-title">{{ property.title }}</h2>
                    <p class="card-text">{{ property.location }}</p>
                    <p class="card-text"><strong>${{ property.price_per_night }}</strong> / night</p>
                    <p class="card-text">{{ property.description }}</p>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Book this property</h5>
                    <a href="{% url 'booking_create' property.id %}" class="btn btn-primary">Book Now</a>
                    {% if user.is_authenticated and user == property.owner %}
                        <hr>
                        <a href="{% url 'property_update' property.id %}" class="btn btn-secondary">Edit Property</a>
                        <a href="{% url 'property_delete' property.id %}" class="btn btn-danger mt-2">Delete Property</a>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
