@extends('templates.header')
@section('content')
    <style>
        .media {
            width: 100%;
            height: 400px;

        }

        @media screen and (max-width: 720px) {
            .media {
                width: 100%;
                height: 200px;
                display: flex;
                justify-content: center;
                align-items: center;
            }
        }
    </style>
    <section id="page-header-cover" class="section-slider swiper-slider fixed no-image">
        <div class="swiper-container" data-autoplay="0">
            <div class="swiper-wrapper">
                <div class="swiper-slide slide-align-center">
                    <div class="swiper-slide-intro">
                        <div class="swiper-intro-inner" style="padding-top: 2%; padding-bottom: 0%; ">
                            <h1 class="swiper-slide-heading">{{ $event->title }}</h1>
                        </div>
                    </div>
                    <div class="overlay"></div>
                </div>
            </div>
        </div>
    </section>
    <div id="content" class="site-content">
        <div id="content-inside" class="container right-sidebar">
            <div id="primary" class="content-area">
                <main id="main" class="site-main" role="main">
                    <article id="post-4232" class="post-4232 page type-page status-publish hentry">
                        <div class="entry-content">
                            <nav role="navigation" aria-label="Breadcrumbs" class="breadcrumb-trail breadcrumbs"
                                itemprop="breadcrumb">
                                <h2 class="trail-browse">Browse:</h2>
                                <ul class="trail-items"
                                    style="text-align: {{ App::getLocale() === 'ar' ? 'right' : 'left' }}" itemscope=""
                                    itemtype="http://schema.org/BreadcrumbList">
                                    <meta name="numberOfItems" content="2">
                                    <meta name="itemListOrder" content="Ascending">
                                    <li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
                                        class="trail-item trail-begin"><a href="{{ route('accueil') }}" rel="home"
                                            itemprop="item">
                                            <span itemprop="name">
                                                {{ App::getLocale() === 'ar' ? 'الرئيسية' : (App::getLocale() === 'fr' ? 'Accueil' : 'Home') }}
                                            </span>
                                        </a>

                                        <meta itemprop="position" content="1">
                                    </li>
                                    <li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
                                        class="trail-item trail-end"><span itemprop="item"><span
                                                itemprop="name">{{ $event->title }}</span></span>
                                        <meta itemprop="position" content="2">
                                    </li>
                                </ul>
                            </nav>

                            <p>&nbsp;</p>
                            <p>{!! $event->Desc !!}</p>
                            @if ($event->apercu)
                                <img class="media" src="{{ asset('uploads/events/' . $event->apercu) }}"
                                    alt="{{ $event->titre }}">
                            @endif
                        </div>
                        <footer class="entry-footer"></footer>
                    </article>
                </main>
            </div>
            <div id="secondary" class="widget-area sidebar baright" role="complementary">
                <section id="text-7" class="widget widget_text">
                    <div class="textwidget">
                        <!-- Multilingual button text -->
                        <p>
                            <a class="btn btn-lg btn-theme-primary" href="{{ route('devis') }}">
                                {{ App::getLocale() === 'ar' ? 'أطلب عرض سعر مجاني' : (App::getLocale() === 'fr' ? 'Je demande un devis gratuit' : 'I request a free quote') }}
                            </a>
                        </p>

                        <!-- Multilingual description text -->
                        <p class="txtptit txtsidebar">
                            <i class="fa fa-info-circle" aria-hidden="true"></i>
                            {{ App::getLocale() === 'ar'
                                ? 'يشمل العرض رأي الطبيب حول حالتك بالإضافة إلى تقدير التكاليف للإقامة الشاملة'
                                : (App::getLocale() === 'fr'
                                    ? 'Un devis comprend l’avis d’un médecin sur votre cas plus une estimation des coûts pour un séjour tout inclus.'
                                    : 'A quote includes the opinion of a doctor on your case, as well as an estimate of costs for an all-inclusive stay.') }}
                        </p>
                    </div>
                </section>
            </div>

        </div>
    </div>
@endsection