<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>{% block title %}{{ title[app.request.locale] }}{% endblock %}</title>
        <link rel="icon" href="{{ asset('images/logo.svg') }}" />
        {% block stylesheets %}
        {% endblock %}
        {% block javascripts %}
            {% block importmap %}{{ importmap('app') }}{% endblock %}
        {% endblock %}
    </head>
    <body>
        {% block body %}
        <header>{% block header %}{% include '_header.html.twig' %}{% endblock %}</header>
        <main>
            <div class="container my-3">
                <div class="row">
                    <div class="col mb-3">
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                {% block breadcrumb %}{% endblock %}
                            </ol>
                        </nav>
                    </div>
                </div>
                <div class="row">
                    <div class="col mb-3">
                        <h1>{% block page_title %}{% endblock %}</h1>
                    </div>
                </div>
                <div class="row">
                    <div class="col mb-3">
                        {% for label, messages in app.flashes %}
                            {% for message in messages %}
                            <div class="alert alert-{{ label }} alert-dismissible fade show" role="alert">
                                {{ message }}
                                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="{{ 'button.close'|trans }}"></button>
                            </div>
                            {% endfor %}
                        {% endfor %}
                    </div>
                </div>{% block page_content %}
                {% endblock %}
            </div>
        </main>
        {% endblock %}
        {% block modals %}{% endblock %}
    </body>
</html>
