{% extends 'base.html.twig' %}

{% block body %}
<div class="w-full flex flex-col h-full">
    <div class="flex flex-row items-center w-full p-3 border-b text-white bg-bungalow-yellow">
        <div class="flex flex-row w-full">
            <a href="{{ path('instrumentation_livrable') }}" class="text-white text-lg">
                <i class="{{ icon.get('file') }}" style="color: #FFFF;"></i>
                Livrable d'Instrumentation
            </a>
            <span class="mx-2">-</span>
            <a class="text-white text-lg">{{ instrumentation_livrable.hotel.nom }}</a>
        </div>
    </div>
    <div class="w-full max-h-[80vh] flex flex-col overflow-y-auto p-5">
        {% include "./layouts/message_flash.html.twig" %}
        <div class="tabs-container tabs-historic" data-tab-group="instrumentation_livrable-tabs">
            <div class="tabs-header justify-around">
                <button class="tab-button active" data-tab="informations">Informations</button>
                <button class="tab-button" data-tab="documents">Documents</button>
            </div>
            <div class="tabs-content">
                <div class="tab-pane active" id="informations">
                    <div class="mt-6 w-full">
                        {% include "./instrumentation/livrable/partials/informations.html.twig" %}
                    </div>
                </div>
                <div class="tab-pane" id="documents">
                    <div class="mt-6 w-full bg-white shadow-lg rounded-md">
                        {% include "./instrumentation/livrable/partials/documents.html.twig" %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block javascripts %}
    {{ encore_entry_script_tags('instrumentation_livrable_index') }}
{% endblock %}

{% block modals %}
    {% include "./instrumentation/livrable/modals/documents.html.twig" %}
{% endblock %}