@extends('layout.master')
@section('meta')
    @include('layout.partials.seo', [
        'title' => $article->meta_title,
        'description' => $article->meta_description,
        'keywords' => $article->meta_keywords,
        'image' => $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_MEDIA_PATH, 'webp')['url'],
        'schema' => $article->schema,
    ])
@endsection
@section('content')
    <main id="content">

        <div class="bg-img-hero text-center mb-1"
            style="background-image: url({{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_BANNER_MEDIA_PATH, 'webp')['url'] }});"
            role="img" title="{{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_BANNER_MEDIA_PATH)['title'] }}"
            aria-label="{{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_BANNER_MEDIA_PATH)['alt'] }}">
            <div class="container space-top-xl-3 py-6 py-xl-0">
                <div class="row justify-content-center py-xl-4">
                    <!-- Info -->
                    <div class="py-xl-10 py-5">
                        <h1 class="font-size-40 font-size-xs-30 text-white font-weight-bold mb-0">{{ $article->name }}</h1>
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb breadcrumb-no-gutter justify-content-center mb-0">
                                <li class="breadcrumb-item font-size-14">
                                    <a class="text-white" href="{{ route('home') }}">{{ __('general.home') }}</a>
                                </li>
                                <li class="breadcrumb-item font-size-14">
                                    <a class="text-white" href="{{ route('blog.category') }}">{{ __('general.blog') }}</a>
                                </li>
                                <li class="breadcrumb-item font-size-14">
                                    <a class="text-white"
                                        href="{{ route('blog.index', [$articleCategory->slug]) }}">{{ $articleCategory->name }}</a>
                                </li>
                                <li class="breadcrumb-item custom-breadcrumb-item font-size-14 text-white active"
                                    aria-current="page">{{ $article->name }}
                                </li>
                            </ol>
                        </nav>
                    </div>
                    <!-- End Info -->
                </div>
            </div>
        </div>

        <div class="mb-6 mb-lg-8 pb-lg-1 pt-1">
            <div class="container mb-5 mb-lg-9">
                <div class="row">
                    <div class="col-lg-8 col-xl-8">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="img--blog mt-5 mb-3">
                                    <img class="w-100"
                                        src="{{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_MEDIA_PATH, 'webp')['url'] }}"
                                        alt="{{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_MEDIA_PATH)['alt'] }}"
                                        title="{{ $article->getFirstMediaUrlOrDefault(MediaHelper::ARTICLE_MEDIA_PATH)['title'] }}">
                                </div>
                            </div>
                        </div>

                        <h5 class="font-weight-bold font-size-21 text-gray-3">
                            <a
                                href="{{ route('blog.show', [$article->category->slug, $article->slug]) }}">{{ $article->name }}</a>
                        </h5>
                        <div class="mb-3">
                            <a class="mr-3 pr-1">
                                <span
                                    class="font-weight-normal text-gray-3">{{ \Carbon\Carbon::parse($article->created_at)->format('d M Y') }}</span>
                            </a>
                        </div>
                        {!! $article->description !!}
                    </div>

                    <div class="col-lg-4 col-xl-4">

                        @if ($related_tours->count() > 0)
                            {{-- Featured Articles Section --}}
                            <div class="related_article">
                                <h3 class="tit_art"> {{ __('article.related_tours') }} </h3>
                                <ul>
                                    @foreach ($related_tours as $tour)
                                        <li>
                                            <a
                                                href="{{ route('tour.show', [$tour->category->category->slug, $tour->category->slug, $tour->slug]) }}">
                                                <img src="{{ $tour->getFirstMediaUrlOrDefault(MediaHelper::TOUR_MEDIA_PATH, 'webp')['url'] }}"
                                                    alt="{{ $tour->getFirstMediaUrlOrDefault(MediaHelper::TOUR_MEDIA_PATH, 'webp')['alt'] }}"
                                                    title="{{ $tour->getFirstMediaUrlOrDefault(MediaHelper::TOUR_MEDIA_PATH, 'webp')['title'] }}">



                                            </a>
                                            <div>
                                                <h3> {{ $tour->name }}</h3>
                                                <a>{{ __('homePage.from') }}</a>
                                                <span class="font-weight-bold">{{ Currency::display($tour->price) }}</span>
                                            </div>
                                        </li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif

                       

                        <div class="tour-details-deals">
                            <div class="tour-details-package-item blog-sidebar blog__sidebar">
                                <h3 class="tit_art"> {{ __('article.related_articles') }} </h3>
                                <hr>
                                <ul>
                                    @foreach ($related_articles as $related_article)
                                        <li class="underline-two">
                                            <a
                                                href="{{ route('blog.show', [$related_article->category->slug, $related_article->slug]) }}"><i
                                                    class="fa-solid fa-angles-right" aria-hidden="true"></i>
                                                {{ $related_article->name }}
                                                Attractions</a>
                                        </li>
                                    @endforeach

                                </ul>
                            </div>
                        </div>



                    </div>
                </div>

            </div>
        </div>

        @include('layout.partials.faqs')
        @include('layout.partials.partners')
    </main>
@endsection