@extends('frontend::layouts.master')

@section('title')
    <title>{{ $seo_setting->title }}</title>
    <meta name="title" content="{{ $seo_setting->title }}" />
    <meta name="description" content="{!! strip_tags(clean($seo_setting->description)) !!}" />
@endsection

@section('content')
    <!-- main-area -->
    <main class="fix">

        <!-- breadcrumb-area -->
        <x-frontend::breadcrumb>
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('home') }}">{{ __('frontend::messages.Home') }}</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ __('frontend::messages.Blogs') }}</li>
            </ol>
        </x-frontend::breadcrumb>
        <!-- breadcrumb-area-end -->

        <!-- blog-area -->
        <section class="blog-area pt-60 pb-60">
            <div class="container">
                <div class="author-inner-wrap">
                    <div class="row justify-content-center">
                        <div class="col-70">
                            <div class="weekly-post-item-wrap">
                                @forelse ($blogs as $blog)
                                    <div class="weekly-post-item weekly-post-four">
                                        <div class="weekly-post-thumb">
                                            <a href="{{ route('blog.detail', $blog->slug) }}">
                                                <img src="{{ getContentMediaWithFallback($blog, 'featured') ?: asset('backend/assets/img/blog/default.png') }}"
                                                    alt="{{ $blog?->title }}">
                                            </a>
                                        </div>
                                        <div class="weekly-post-content">

                                            @if ($blog?->categories && $blog?->categories->count() > 0)
                                                <div class="d-flex flex-wrap gap-3">
                                                    @foreach ($blog?->categories as $category)
                                                        @break($loop->index == 2)
                                                        <a href="{{ route('blogs', ['category_id' => $category?->id]) }}"
                                                            class="post-tag">
                                                            {{ $category?->name }}
                                                        </a>
                                                    @endforeach
                                                </div>
                                            @endif

                                            <h2 class="post-title">
                                                <a href="{{ route('blog.detail', $blog->slug) }}">
                                                    {{ $blog?->title }}
                                                </a>
                                            </h2>

                                            <div class="blog-post-meta">
                                                <ul class="list-wrap">
                                                    <li>
                                                        <i class="flaticon-calendar"></i>
                                                        {{ Carbon\Carbon::parse($blog->created_at)->format('d M Y') }}
                                                    </li>
                                                    @if ($blog?->getMeta('reading_time'))
                                                        <li><i
                                                                class="flaticon-history"></i>{{ $blog?->getMeta('reading_time') }}
                                                        </li>
                                                    @endif
                                                </ul>
                                            </div>
                                            <div>
                                                {!! Str::limit($blog?->excerpt, 140, '...') !!}
                                            </div>
                                            <div class="view-all-btn">
                                                <a href="{{ route('blog.detail', $blog->slug) }}" class="link-btn">
                                                    {{ __('frontend::messages.Read More') }}
                                                    <span class="svg-icon">
                                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"
                                                            fill="none">
                                                            <path
                                                                d="M1.07692 10L0 8.92308L7.38462 1.53846H0.769231V0H10V9.23077H8.46154V2.61538L1.07692 10Z"
                                                                fill="currentColor" />
                                                            <path
                                                                d="M1.07692 10L0 8.92308L7.38462 1.53846H0.769231V0H10V9.23077H8.46154V2.61538L1.07692 10Z"
                                                                fill="currentColor" />
                                                        </svg>
                                                    </span>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                @empty
                                    @include('frontend::blog.include.blog_not_found')
                                @endforelse
                            </div>
                            @include('frontend::components.custom-pagination', ['items' => $blogs])
                        </div>
                        <div class="col-30">
                            @include('frontend::blog.include.blog_sidebar')
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- blog-area-end -->

        <!-- newsletter-area -->
        @include('frontend::components.newsletter_area')
        <!-- newsletter-area-end -->

    </main>
    <!-- main-area-end -->
@endsection