{% load static %}
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}Groupe-alpages : Contrôle Technique Bâtiments{% endblock %}</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    
    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
      rel="stylesheet" />
    <link href="{% static 'assets/vendor/fonts/iconify-icons.css' %}" rel="stylesheet">
    
    <!-- Core CSS -->
    <link  href="{% static 'assets/vendor/css/core.css' %}" rel="stylesheet">
    <link  href="{% static 'assets/css/demo.css' %}" rel="stylesheet">

    <!-- Vendors CSS -->
    <link rel="stylesheet" href="{% static 'assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.css' %}" />

    <!-- endbuild -->
    <link rel="stylesheet" href="{% static 'assets/vendor/libs/apex-charts/apex-charts.css' %}" />

    <!-- Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="container">
            <a class="navbar-brand" href="{% url 'controle:login' %}">
                <i class="bi bi-building"></i> Contrôle Technique
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'controle:parametres' %}">Paramètres</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'controle:liste_pv' %}">Procès-verbaux</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'controle:creer_pv' %}">Nouveau PV</a>
                    </li>
                </ul>
                <ul class="navbar-nav">
                    {% if user.is_authenticated %}
                        <li class="nav-item">
                            <span class="nav-link">Bonjour, {{ user.username }}</span>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{% url 'controle:logout' %}">Déconnexion</a>
                        </li>
                    {% else %}
                        <li class="nav-item">
                            <a class="nav-link" href="{% url 'controle:login' %}">Connexion</a>
                        </li>
                    {% endif %}
                </ul>
            </div>
        </div>
    </nav>

    <!-- Messages -->
    <div class="container mt-4">
        {% if messages %}
            {% for message in messages %}
                <div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
                    {{ message }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            {% endfor %}
        {% endif %}
    </div>
    <!-- Contenu -->   
   <div class="content-wrapper"></div>
        {% block content %}{% endblock %}
    </div> 
    <footer class="content-footer footer bg-footer-theme">                
              <div class="container-xxl">
                <div class="footer-container d-flex align-items-center justify-content-between py-4 flex-md-row flex-column">
                  <div class="mb-2 mb-md-0"> <i class="bi bi-pen-fill"></i><b> Contrôle Technique Bâtiments</b> &nbsp;&nbsp; © 2026 - Médiasoft Tous droits réservés.
                  </div>
                   
                  <div class="d-none d-lg-inline-block">
                    <a href="{% url 'controle:parametres' %}" class="footer-link me-4">Paramètres</a>
                    <a href="{% url 'controle:liste_pv' %}" class="footer-link me-4" target="_blank">Procès-verbaux</a>
                    <a href="{% url 'controle:creer_pv' %}" class="footer-link me-4">Nouveau PV</a>
                   
                  </div>
                </div>
              </div>
    </footer>
    <!-- Footer -->
</body>
</html>