@extends('layouts.master')
@section('meta')
    @include('layouts.partials.seo', [
        'title' => $blog->meta_title??$blog->title,
        'description' => $blog->meta_description??$blog->title,
        'keywords' => $blog->meta_keywords??$blog->title,
        'image' => $blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'],
        'schema' => $blog->meta_other
    ])
@endsection
@section('content')

    <section class="rlr-section">
        <div class="rlr-cta rlr-cta--no-button"
             style="background-image: url('{{ $blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'] }}'); background-size:150%; "
             role="image"
             aria-label="{{$blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['alt']}}"
             title="{{$blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['title']}}">
            <h1>{{$blog->title}}</h2>
            <!-- <p>{!!$blog->description!!}</p> -->
        </div>
    </section>
    <div class="rlr-search-results-page__breadcrumb-section">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-12">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb rlr-breadcrumb__items">
                            <li class="breadcrumb-item rlr-breadcrumb__item"><a
                                    href="{{route('home')}}">{{__('homePage.home')}}</a></li>
                            <li class="breadcrumb-item rlr-breadcrumb__item"><a
                                    href="{{route('blogs')}}">{{__('article.our_blogs')}}</a></li>
                            <li class="breadcrumb-item rlr-breadcrumb__item active"
                                aria-current="page">{{$blog->title}}</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row rlr-search-results-page__product-details rlr-section__py">
            <aside class="col-xl-3 rlr-search-results-page__sidebar">
                <aside class="rlr-sidebar">
                    <div class="rlr-sidebar__widget">
                        <h4>{{__('article.categories')}}</h4>
                        <ul class="wp-block-categories">
                            @foreach ($articleCats as $cat)
                                <li><a href="{{route('categoryBlogs', ['catSlug' => $cat->slug])}}"> <i
                                            class="fa fa-arrow-circle-left"></i> {{$cat->name}} </a></li>
                            @endforeach
                        </ul>
                    </div>
                    <div class="rlr-sidebar__widget rlr-sidebar--posts">
                        <h4>{{__('article.related_tours')}}</h4>
                        <ul>
                            @foreach ($relatedTours as $tour)
                                <li>
                                    <a href="{{route('tours.show', ['categorySlug'=> $tour->category->category->slug, 'supCategorySlug'=>$tour->category->slug, 'tourSlug'=>$tour->slug])}}">
                                        <img
                                        src="{{ $tour->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::TOUR_MEDIA_PATH)['url'] }}"
                                        alt="{{ $tour->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::TOUR_MEDIA_PATH)['alt'] }}"
                                        title="{{ $tour->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::TOUR_MEDIA_PATH)['title'] }}" />
                                        <div class="rlr-sidebar--posts__column">
                                            <span>  {!! Str::limit(strip_tags($tour->name),50) !!}</span>
                                            {{-- <time datetime="{{$item->created_at->format('Y-M-D')}}">{{$item->created_at->format('Y-M-D')}}</time> --}}
                                        </div>
                                    </a>
                                </li>
                            @endforeach
                        </ul>
                    </div>
                </aside>
            </aside>
            <section class="col-xl-9 rlr-search-results-page__product-list">
                <header class="rlr-article__header">
                    <div class="rlr-article__header__timestamp">{{__('article.published')}} {{$blog->created_at->format('Y-M-D')}}</div>
                    <h1 class="type-h1">{{$blog->title}}</h1>
                    <h6 class="type-sub-title">{!!$blog->description!!}</h6>
                </header>
                <div class="rlr-article__featured-photo">
                    <img
                        src="{{ $blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_BANNER_MEDIA_PATH)['url'] }}"
                        alt="{{ $blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_BANNER_MEDIA_PATH)['alt'] }}"
                        title="{{ $blog->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_BANNER_MEDIA_PATH)['title'] }}">
                </div>
                <div class="rlr-article__wrapper">
                    <div class="content">
                        <figure>
                            @foreach($blog->getMedia(\App\Helpers\Constants\MediaHelper::ARTICLE_GALLERY_MEDIA_PATH) as $media)
                                <img src="{{ $media->getUrl() }}" alt="{{$media->img_alt}}" title="{{$media->img_title}}" class="blog_img float-end m-2">
                            @endforeach

                        </figure>
                        {!!$blog->content!!}
                        <div class="rlr-article__badges">
                            @foreach ($blog->tags as $item)
                                <span class="rlr-badge rlr-badge--left rlr-badge-- rlr-badge rlr-badge--left">{{$item}}</span>
                            @endforeach
                        </div>
                    </div>
                </div>


            </section>

        </div>
    </div>
    @include('layouts.partials.why_choose')
    @include('layouts.partials.customer_gallery')
    @include('layouts.partials.clients_say')
    @include('layouts.partials.faq')
    @include('layouts.partials.partners')

@endsection