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

    <section class="rlr-section">
        <div class="rlr-cta rlr-cta--no-button"
             style="background-image: url('{{ $category->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::CATEGORY_BANNER_MEDIA_PATH)['url'] }}'); background-size:150%;"
             role="img"
             aria-label="{{ $category->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::CATEGORY_BANNER_MEDIA_PATH)['alt']}}"
             title="{{ $category->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::CATEGORY_BANNER_MEDIA_PATH)['title']}}">
            <h1>{{$category->name}}</h2>
            <p>{{$category->heading}}</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 active"
                                aria-current="page">{{$category->name}}</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>



    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div id="profile-description">
                    <div class="text show-more-height">
                        <div class="page-heading">
                            {!!$category->description!!}
                            
                        </div><!-- end page-heading -->
                    </div>
                    <div class="show-more">({{__('homePage.show_more')}})</div>
                </div>
            </div>
        </div>
    </div>


    <section class="rlr-section rlr-section__cards mb-5">
        <div class="container">

            <div class="row rlr-featured__cards">
                @foreach ($category->children as $item)
                    <div class="col-md-6 col-lg-4 mb-4">
                        <article class="rlr-product-card rlr-product-card--featured" itemscope
                                 itemtype="https://schema.org/Product">
                            <figure class="rlr-product-card__image-wrapper">
                                <a href="{{route('sub-categories', ['categorySlug'=>$item->category->slug, 'supCategorySlug'=>$item->slug])}}">
                                    <img itemprop="image"
                                         data-srcset="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::SUB_CATEGORY_MEDIA_PATH)['url'] }}"
                                         alt="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::SUB_CATEGORY_MEDIA_PATH)['alt'] }}"
                                         title="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::SUB_CATEGORY_MEDIA_PATH)['title'] }}"
                                         data-sizes="auto" class="lazyload"/>
                                </a>
                            </figure>
                        </article>
                        <!-- Summary -->
                        <div class="rlr-product-card--featured__summary summary_tour ">
                            <h4 class="type-h6-semi-bold">
                                <a href="{{route('sub-categories', ['categorySlug'=>$item->category->slug, 'supCategorySlug'=>$item->slug])}}"
                                   class="text-black"> {{$item->name}} </a>
                            </h4>
                            <p class="type-body">  {!! Str::limit(strip_tags($item->short_description), 180) !!}</p>
                            <a class="readmore-faq text-white"
                               href="{{route('sub-categories', ['categorySlug'=>$item->category->slug, 'supCategorySlug'=>$item->slug])}}">{{__('homePage.read_more')}}</a>
                        </div>
                    </div>
                @endforeach

            </div>
        </div>
    </section>


    @include('layouts.partials.why_choose')
    @include('layouts.partials.customer_gallery')
    @include('layouts.partials.clients_say')
    <section id="faqDiv">
        @include('layouts.partials.faq', ['faqs' => $category->FAQs, 'modelType' => 'Category', 'modelId' => $category->id])
    </section>
     @include('layouts.partials.partners')
@endsection