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

{% block title %}Accueil - Institut ITM{% endblock %}

{% block content %}
<div class="hero-section">
    <div class="container text-center">
        <img src="https://i.ibb.co/jXmDKP9/2-4.png" alt="Institut ITM Logo" class="hero-logo mb-4">
        <h1 class="hero-title">Institut ITM de Formation</h1>
        <p class="hero-subtitle">Votre avenir professionnel commence ici. Des formations d'excellence pour un succès garanti.</p>
    </div>
</div>

<div class="container py-5">
    {% if messages %}
        {% for message in messages %}
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                {{ message }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        {% endfor %}
    {% endif %}

    <div class="row g-5 align-items-center">
        <div class="col-lg-6">
            <h2 class="section-title">Contactez-Nous</h2>
            <p class="section-subtitle">Une question ? Un projet ? N'hésitez pas à nous contacter. Notre équipe est à votre disposition pour vous orienter et vous accompagner.</p>
            
            <div class="contact-info">
                <p><strong><i class="icon"></i>Adresse (Ouled Fayet):</strong> Villa N° 12, Cité 150 Logements, El Achour, Alger</p>
                <p><strong><i class="icon"></i>Adresse (Draria):</strong> Rue Benchabane Mouloud, Draria 16050</p>
                <p><strong><i class="icon"></i>Téléphone:</strong> +213 660 64 85 47</p>
                <p><strong><i class="icon"></i>Email:</strong> oguernouti@institut-itm.com</p>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="form-container">
                <form method="post" novalidate>
                    {% csrf_token %}
                    {% for field in form %}
                        <div class="mb-3">
                            {{ field }}
                        </div>
                    {% endfor %}
                    <button type="submit" class="btn btn-primary w-100">Envoyer le Message</button>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}
