@extends('front.layout.app')
@section('title', 'Contact Us | TRL Japan Support')
@section('meta_description', 'Have questions? Get in touch with TRL Japan team for inquiries regarding buying, selling, or listing your car.')
@section('content')
{{--    <section class="flat-title">--}}
{{--        <div class="container2">--}}
{{--            <div class="row">--}}
{{--                <div class="col-lg-12">--}}
{{--                    <div class="title-inner style">--}}
{{--                        <div class="title-group fs-12"><a class="home fw-6 text-color-3"--}}
{{--                                                          href="{{route('front.home')}}">Home</a><span>Blogs</span></div>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </section>--}}

    <section class="tf-section3 flat-blog-grid flat-blog-list flat-property">
        <div class="container">
            <div class="inner-heading flex-two flex-wrap">
                <h1 class="heading-listing">Our Blogs</h1>
{{--                <div class="social-listing flex-six flex-wrap">--}}
{{--                    <p>Share this page:</p>--}}
{{--                    <div class="icon-social style1">--}}
{{--                        <a href="#"><i class="icon-autodeal-facebook"></i></a>--}}
{{--                        <a href="#"><i class="icon-autodeal-linkedin"></i></a>--}}
{{--                        <a href="#"><i class="icon-autodeal-twitter"></i></a>--}}
{{--                        <a href="#"><i class="icon-autodeal-instagram"></i></a>--}}
{{--                    </div>--}}
{{--                </div>--}}
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="post">
                        <div class="flat-blog">
                            <div class="row">
                                @forelse($blogs as $blog)
                                    <div class="col-lg-4 col-md-6 mb-4">
                                        <div class="box hover-img">
                                            <div class="images img-style relative flex-none">
                                                <img src="{{ $blog->getFirstMediaUrl('blog_thumbnails') ?: asset('assets/images/dashboard/avatar.png') }}"
                                                     alt="{{ $blog->title }}"
                                                     style="width: 100%; height: 250px; object-fit: cover;">

                                                <div class="date">{{ $blog->created_at->format('M d, Y') }}</div>
                                            </div>
                                            <div class="content">
                                                <div class="sub-box flex align-center fs-13 fw-6">
                                                    <a href="#" class="admin fw-7 text-color-2">Nahide Karabag</a>
                                                </div>

                                                <h3>
                                                    <a href="{{ route('front.blog.detail', $blog->slug) }}">{{ $blog->title }}</a>
                                                </h3>

                                                <p class="text-muted fs-14">
                                                    @php
                                                        $firstPart = preg_split('/(<\/p>|<br>|\n)/i', $blog->content, 2)[0];
                                                        $cleanText = html_entity_decode(strip_tags($firstPart));
                                                        $cleanText = str_replace("\xc2\xa0", ' ', $cleanText);
                                                        $cleanText = preg_replace('/\s+/', ' ', $cleanText);
                                                    @endphp

                                                    {{ Str::limit(trim($cleanText), 150, '...') }}
                                                </p>

                                                <div class="mt-3">
                                                    <a href="{{ route('front.blog.detail', $blog->slug) }}" class="text-orange fw-7">Read More <i class="fas fa-arrow-right ms-1"></i></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @empty
                                    <div class="col-12 text-center py-5">
                                        <div class="no-data-wrapper">
                                            <img src="{{ asset('assets/images/no-data.webp') }}" alt="No Blogs Found" style="max-width: 250px; opacity: 0.7;">
                                            <h3 class="text-dark fw-7">No Blogs Published Yet</h3>
                                            <p class="text-muted">We are currently working on some exciting updates. Please check back soon!</p>
                                        </div>
                                    </div>
                                @endforelse
                            </div>

                            @if ($blogs->hasPages())
                                <div class="tfcl-pagination paging-navigation clearfix">

                                    {{-- PREVIOUS --}}
                                    @if ($blogs->onFirstPage())
                                        <span class="prev page-numbers disabled">
            <i class="far fa-angle-left"></i>
        </span>
                                    @else
                                        <a class="prev page-numbers"
                                           href="{{ $blogs->previousPageUrl() }}">
                                            <i class="far fa-angle-left"></i>
                                        </a>
                                    @endif


                                    {{-- PAGE LINKS --}}
                                    @foreach ($blogs->getUrlRange(1, $blogs->lastPage()) as $page => $url)
                                        @if ($page == $blogs->currentPage())
                                            <span
                                                class="page-numbers current">{{ $page }}</span>
                                        @else
                                            <a class="page-numbers"
                                               href="{{ $url }}">{{ $page }}</a>
                                        @endif
                                    @endforeach


                                    {{-- NEXT --}}
                                    @if ($blogs->hasMorePages())
                                        <a class="next page-numbers"
                                           href="{{ $blogs->nextPageUrl() }}">
                                            <i class="far fa-angle-right"></i>
                                        </a>
                                    @else
                                        <span class="next page-numbers disabled">
            <i class="far fa-angle-right"></i>
        </span>
                                    @endif

                                </div>
                            @endif
                        </div>

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

@endsection