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

{% block title %}{{ ficheOutil.titre }}{% endblock %}

{% block content %}
    <div class="fiche-outil-container">
        {% if parcours and parcours.logo %}
            <div class="parcours-logo-container">
                <img src="{{ asset('uploads/logos/' ~ parcours.logo) }}" alt="{{ parcours.nom }}" class="img-fluid parcours-logo" style="max-height: 60px;">
            </div>
        {% endif %}
        
        <div class="card">
            <div class="card-body">
                <nav aria-label="Fil d'Ariane" class="mb-4">
                    <ol class="breadcrumb breadcrumb-custom">
                        <li class="breadcrumb-item">
                            <a href="{{ path('app_home') }}">
                                <i class="fas fa-home me-1"></i>
                                Accueil
                            </a>
                        </li>
                        {% if parcours %}
                            <li class="breadcrumb-item">
                                <a href="{{ path('app_parcours_show', {'id': parcours.id}) }}">
                                    {{ parcours.nom }}
                                </a>
                            </li>
                        {% endif %}
                        <li class="breadcrumb-item">
                            <a href="{{ path('app_pratique_show', {'id': pratique.id}) }}{% if parcours %}?parcours={{ parcours.id }}{% endif %}">
                                {{ pratique.titre }}
                            </a>
                        </li>
                        {# Si on arrive depuis une fiche outil niveau 2, insérer cette étape dans le fil d'Ariane #}
                        {% if ficheOutilNiv2Parent is defined and ficheOutilNiv2Parent %}
                            <li class="breadcrumb-item">
                                <a href="{{ path('app_pratique_fiche_outil_niv2', {'id': pratique.id, 'ficheId': ficheOutilNiv2Parent.id}) }}{% if parcours %}?parcours={{ parcours.id }}{% endif %}">
                                    {{ ficheOutilNiv2Parent.titre }}
                                </a>
                            </li>
                        {% endif %}
                        <li class="breadcrumb-item active" aria-current="page">{{ ficheOutil.titre }}</li>
                    </ol>
                </nav>
                
                <h1 class="card-title">{{ ficheOutil.titre }}</h1>
                
                {% if ficheOutil.description %}
                    <p class="lead text-muted mt-2">{{ ficheOutil.description }}</p>
                {% endif %}
                
                <div class="fiche-outil-content mt-4">
                    {% if ficheOutil.type.value == 'standard' %}
                        {% if ficheOutil.question %}
                            <div class="fiche-section">
                                <h3>Question</h3>
                                <div class="fiche-content">{{ ficheOutil.question|raw }}</div>
                            </div>
                        {% endif %}
                        
                        {% if ficheOutil.reponse %}
                            <div class="fiche-section">
                                <h3>Réponse</h3>
                                <div class="fiche-content">{{ ficheOutil.reponse|raw }}</div>
                            </div>
                        {% endif %}
                        
                        {% if ficheOutil.informationsComplementairesType != 'aucun' and ficheOutil.informationsComplementairesContenu %}
                            <div class="fiche-section">
                                <h3>Informations complémentaires</h3>
                                <div class="fiche-content">{{ ficheOutil.informationsComplementairesContenu|raw }}</div>
                            </div>
                        {% endif %}
                        
                        {% if ficheOutil.facturationType != 'aucun' and ficheOutil.facturationContenu %}
                            <div class="fiche-section">
                                <h3>Facturation</h3>
                                <div class="fiche-content">{{ ficheOutil.facturationContenu|raw }}</div>
                            </div>
                        {% endif %}
                        
                        {% if ficheOutil.definitionType != 'aucun' and ficheOutil.definitionContenu %}
                            <div class="fiche-section">
                                <h3>Définition</h3>
                                <div class="fiche-content">{{ ficheOutil.definitionContenu|raw }}</div>
                            </div>
                        {% endif %}
                    {% elseif ficheOutil.type.value == 'url' %}
                        <div class="fiche-section">
                            <h3>Lien externe</h3>
                            <div class="fiche-content">
                                <a href="{{ ficheOutil.url }}" target="_blank" class="btn btn-primary">
                                    <i class="fas fa-external-link-alt me-2"></i>Accéder au lien
                                </a>
                            </div>
                        </div>
                    {% elseif ficheOutil.type.value == 'fichier' %}
                        <div class="fiche-section">
                            <h3>Fichier à télécharger</h3>
                            <div class="fiche-content">
                                <div class="file-info mb-3">
                                    <div class="file-icon mb-2">
                                        <i class="fas fa-file-pdf fa-3x text-danger"></i>
                                    </div>
                                    <div class="file-details">
                                        <h4>{{ ficheOutil.originalFilename ?: 'Fichier' }}</h4>
                                        {% if ficheOutil.fileSize %}
                                            <p class="text-muted mb-1">Taille: {{ (ficheOutil.fileSize / 1024)|round(1, 'floor') }} Ko</p>
                                        {% endif %}
                                        {% if ficheOutil.uploadedAt %}
                                            <p class="text-muted mb-2">Ajouté le {{ ficheOutil.uploadedAt|date('d/m/Y') }}</p>
                                        {% endif %}
                                    </div>
                                </div>
                                <a href="{{ path('app_fiche_outil_download', {'id': ficheOutil.id}) }}" class="btn btn-primary">
                                    <i class="fas fa-download me-2"></i>Télécharger le fichier
                                </a>
                            </div>
                        </div>
                    {% endif %}
                </div>
                
                <div class="mt-4">
                    <a href="{{ path('app_pratique_show', {'id': pratique.id}) }}{% if parcours %}?parcours={{ parcours.id }}{% endif %}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left me-2"></i>Retour à la pratique
                    </a>
                </div>
            </div>
        </div>
    </div>
{% endblock %}