
{% extends 'base.html' %}

{% block title %}Welcome to VTU Nigeria{% endblock %}

{% block content %}
<div class="hero">
    <div class="container">
        <h1>Fast & Reliable VTU Services</h1>
        <p>Your one-stop platform for airtime, data, cable subscriptions, and more.</p>
        <a href="{% url 'signup' %}" class="btn btn-primary btn-lg">Get Started Now</a>
    </div>
</div>

<section class="products-section">
    <div class="container">
        <h2 class="text-center mb-5">Our Products</h2>
        <div class="row g-4">
            {% for product in products %}
            <div class="col-md-6 col-lg-4">
                <div class="card h-100">
                    <div class="card-body">
                        <h5 class="card-title">{{ product.name }}</h5>
                        <h6 class="card-subtitle mb-2 text-muted">{{ product.category }}</h6>
                        <p class="card-text">{{ product.description|truncatewords:20 }}</p>
                        <p class="card-text fs-4 fw-bold">₦{{ product.price }}</p>
                        <form action="{% url 'add_to_cart' product.id %}" method="post">
                            {% csrf_token %}
                            <input type="hidden" name="quantity" value="1">
                            <button type="submit" class="btn btn-primary">Add to Cart</button>
                        </form>
                    </div>
                </div>
            </div>
            {% empty %}
            <div class="col">
                <p class="text-center">No products available at the moment. Please check back later.</p>
            </div>
            {% endfor %}
        </div>
    </div>
</section>
{% endblock %}
