@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::ARTICLE_CATEGORY_BANNER_MEDIA_PATH)['url'],
        'schema' => $category->meta_other ?? $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::ARTICLE_CATEGORY_BANNER_MEDIA_PATH)['url'] }}'); background-size:100%;"
            role="image"
            aria-label="{{ $category->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_CATEGORY_BANNER_MEDIA_PATH)['alt'] }}"
            title="{{ $category->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_CATEGORY_BANNER_MEDIA_PATH)['title'] }}">
            <h1>{{ $category->name }}</h2>
                {{ $category->heading }}
        </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">
                                {{ $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>
                    </div>
                    <div class="show-more">({{ __('homePage.show_more') }})</div>
                </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.recent_posts') }}</h4>
                        <ul>
                            @foreach ($recentPosts as $item)
                                <li>
                                    <a
                                        href="{{ route('blogs.show', ['catSlug' => $item->category->slug, 'slug' => $item->slug]) }}">
                                        <img src="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'] }}"
                                            title="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['title'] }}"
                                            alt="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['alt'] }}" />
                                        <div class="rlr-sidebar--posts__column">
                                            <span>{{ $item->title }}</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">
                <div class="row">
                    @foreach ($blogs as $item)
                        <div class="col-md-4 col-lg-4 col-12">
                            <article class="rlr-postcard">
                                <div class="rlr-postcard__thumbnail">
                                    <a href="{{ route('blogs.show', ['catSlug' => $category->slug, 'slug' => $item->slug]) }}">
                                        <img src="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'] }}"
                                            alt="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['alt'] }}"
                                            title="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['title'] }}">
                                    </a>
                                </div>
                                <div class="rlr-postcard__summary pb-0">
                                    <span class="rlr-postcard__author"> <i class="fa fa-user"></i> Admin |
                                        {{ $item->created_at->format('Y-M-D') }}</span>
                                    <a class="rlr-product-card__anchor-title"
                                        href="{{ route('blogs.show', ['catSlug' => $category->slug, 'slug' => $item->slug]) }}">
                                        <h2 class="rlr-product-card__title mt-1">{{ $item->title }}</h2>
                                    </a>
                                </div>
                            </article>
                        </div>
                    @endforeach
                    <div class="links">
                        @include('blogs.pagination',['paginator'=>$blogs])
                        {{-- {{ $blogs->links() }} --}}
    
    
                    </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