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

{% import 'macros/breadcrumbs.html.twig' as breadcrumbs %}
{% set crumbs = [
    { 'title': 'Accueil'|trans, 'url': path('home_index') },
    { 'title': 'Les activités locales'|trans, 'url': path('@Booking_activity_list') },
    { 'title': activity.title, 'url': null }
] %}

{% block title %}{{ activity.title }}{% endblock %}

{% block body %}
    <section class="activity-section">
        <div class="activity-section-full">
            <div class="activity-container container">

                {{ breadcrumbs.breadcrumb(crumbs) }}

                <article class="row g-4">
                    <div class="col-lg">
                        <div class="card border-0 shadow-sm mb-4">
                            <div class="card-body">
                                <h1 class="card-title h3 mb-3">{{ activity.title }}</h1>
                                {% if activity_season %}
                                    <div class="mb-4">
                                        {{ include('@CMS/common/editorjs/_block.html.twig', {blocks:activity_season.description|cmsBlocks}) }}
                                    </div>
                                {% endif %}
                                <ul class="list-unstyled">
                                    {% if activity.website %}
                                        <li class="mb-1">
                                            <i class="bi bi-globe me-1 text-secondary"></i>
                                            <a href="{{ activity.website }}" target="_blank" rel="noopener"
                                               class="text-decoration-underline">
                                                {{ activity.website|replace({'https://': '', 'http://': ''}) }}
                                            </a>
                                        </li>
                                    {% endif %}
                                    {% if activity.phone %}
                                        <li class="mb-1">
                                            <i class="bi bi-telephone me-1 text-secondary"></i>
                                            <a href="tel:{{ activity.phone|phoneFormat }}" rel="noopener"
                                               class="text-decoration-underline">
                                                {{ activity.phone|phonePretty }}
                                            </a>
                                        </li>
                                    {% endif %}
                                    <li class="mb-1">
                                        <i class="bi bi-geo-alt me-1 text-secondary"></i>
                                        <address class="d-inline">
                                            {{ activity.address }}<br>
                                            {{ activity.zipCode }} {{ activity.city }}
                                        </address>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    {% if activity_medias %}
                        <div class="col-lg-4">
                            {{ include('@Booking/front/activity/medias/_show_grid_slide.html.twig') }}
                        </div>
                    {% endif %}
                </article>
            </div>
        </div>
    </section>
{% endblock %}