@extends('frontend.layouts.main')
@push('styles')
    <style>
        /* .international-news-area {
                background-color: #f5f5f5;
                padding-top: 20px;
                padding-bottom: 20px;

            } */

        /* .technology-area {
                background-color:#f5f5f5;
                padding-top: 20px;
                padding-bottom: 20px;

            } */
    </style>
@endpush
@section('section')
    <section class="featured-news-area">
        <div class="container">
            <div class="row">
                <div class="col-lg-7 col-md-7">
                    @foreach ($latestPosts->take(1) as $post)
                        <div class="single-featured-news-box">
                            <div class="news-image">
                                <a href="{{ route('post.view', $post->slug) }}">
                                    <img src="{{ asset($post->post_image) }}" alt="{{ $post->title }}" />
                                </a>
                            </div>
                            <div class="news-content">
                                <span>
                                    <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                        {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                    </a>
                                </span>
                                <h3><a href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                </h3>
                                <ul>
                                    <li>{{ $post->published_at->format('M d, Y') }}</li>
                                    {{-- <li>5 Mins Read</li> --}}
                                </ul>
                                <p>{{ Str::limit(strip_tags($post->content), 180) }}</p>
                                <a href="{{ route('post.view', $post->slug) }}" class="read-more-btn">Read More</a>
                            </div>
                        </div>
                    @endforeach
                </div>
                <div class="col-lg-5 col-md-5">
                    <div class="more-featured-news">
                        <div class="section-title">
                            <h2>Latest Posts</h2>
                        </div>
                        @foreach ($latestPosts->skip(1)->take(4) as $post)
                            <div class="featured-media-news">
                                <div class="news-content">
                                    <span>
                                        <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                            {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                        </a>
                                    </span>
                                    <h3><a
                                            href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                    </h3>
                                    <ul>
                                        <li>{{ $post->published_at->format('M d, Y') }}</li>
                                        {{-- <li>5 Mins Read</li> --}}
                                    </ul>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </section>


    {{-- <section class="default-news-area ptb-40 bg-color-none pb-0">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-12">
                    <div class="default-video-news p-0">
                        <h3 class="title">Video</h3>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-1.') }}
                                    alt="image"> <a href="https://www.youtube.com/watch?v=bk7McNUjWgw"
                                    class="popup-youtube"><i class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">Gloost
                                        Better They Are With A Featured</a></h3>
                            </div>
                        </div>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-2.') }}
                                    alt="image"> <a href="https://www.youtube.com/watch?v=bk7McNUjWgw"
                                    class="popup-youtube"><i class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-2.html">Differences
                                        between User Experience Interface</a></h3>
                            </div>
                        </div>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-3.') }}
                                    alt="image"> <a href="https://www.youtube.com/watch?v=bk7McNUjWgw"
                                    class="popup-youtube"><i class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-4.html">A Guide to
                                        Avoiding Web Design Mistakes</a></h3>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-md-12">
                    <div class="single-default-news">
                        <img src="{{ asset('frontend/images/1.jpg') }}" alt="image">
                        <div class="news-content">
                            <ul>
                                <li><i class="icofont-user-suited"></i> by <a
                                        href="https://templates.envytheme.com/sinmun/default/author.html">John Smith</a>
                                </li>
                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                            </ul>
                            <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As well as
                                    stopping goals, Cristiane Endler is opening doors for other women.</a></h3>
                        </div>
                        <div class="tags"><a
                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a></div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 col-md-6">
                            <div class="single-default-inner-news">
                                <div class="news-image"><img
                                        src="{{ asset('frontend/images/2.jpg') }}"
                                        alt="image"></div>
                                <div class="news-content">
                                    <h3>Cloud Infrastructure: is Hosting Review</h3>
                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                </div>
                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                    class="link-overlay"></a>
                                <div class="tags bg-2"><a
                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6">
                            <div class="single-default-inner-news">
                                <div class="news-image"><img
                                        src="{{ asset('frontend/images/3.jpg') }}"
                                        alt="image"></div>
                                <div class="news-content">
                                    <h3>How to Customize your PHP Footer</h3>
                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                </div>
                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                    class="link-overlay"></a>
                                <div class="tags bg-3"><a
                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-12">
                    <div class="small-image-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><img
                                src="{{ asset('frontend/images/1-ads.png"
                                alt="image"></a>
                    </div>
                    <div class="single-default-inner-news">
                        <div class="news-image"><img src="{{ asset('frontend/images/4.jpg') }}"
                                alt="image"></div>
                        <div class="news-content">
                            <h3>Banning Winter Holiy As Islands Offers</h3>
                            <span><i class="icofont-calendar"></i> March 22, 2024</span>
                        </div>
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                            class="link-overlay"></a>
                        <div class="tags bg-4"><a
                                href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a></div>
                    </div>
                    <div class="single-default-inner-news">
                        <div class="news-image"><img
                                src="{{ asset('frontend/images/5.jpg') }}" alt="image">
                        </div>
                        <div class="news-content">
                            <h3>Gloost Better They Are With A Featured</h3>
                            <span><i class="icofont-calendar"></i> March 22, 2024</span>
                        </div>
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                            class="link-overlay"></a>
                        <div class="tags bg-5"><a
                                href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a></div>
                    </div>
                </div>

            </div>
        </div>
    </section> --}}

    {{-- <section class="popular-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-12">
                    <div class="popular-section-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><img
                                src="{{ asset('frontend/images/2-ads.png"
                                alt="image"></a>
                    </div>
                </div>
                <div class="col-lg-9 col-md-12">
                    <div class="section-title">
                        <h2>Most Popular</h2>
                    </div>
                    <div class="row">
                        <div class="popular-news-slides owl-carousel owl-theme owl-loaded owl-drag">




                            <div class="owl-stage-outer">
                                <div class="owl-stage"
                                    style="transform: translate3d(-1148px, 0px, 0px); transition: 0.25s; width: 2870px;">
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/7.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/8.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/1.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Copy – Paste the Style of your elements in Newspaper</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-4"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/6.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Create the Perfect Logo for your Website</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-2"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/7.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/8.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/1.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Copy – Paste the Style of your elements in Newspaper</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-4"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/6.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Create the Perfect Logo for your Website</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-2"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/7.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img
                                                        src="{{ asset('frontend/images/8.jpg') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button><button type="button"
                                    role="presentation" class="owl-next"><i class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}

    {{-- <section class="popular-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12">
                    <div class="section-title">
                        <h2>Most Popular</h2>
                    </div>
                    <div class="row">
                        <div class="popular-news-slides owl-carousel owl-theme owl-loaded owl-drag">
                            <div class="owl-stage-outer">
                                <div class="owl-stage">
                                    @foreach ($mostPopularPosts as $index => $post)
                                        <div class="owl-item {{ $index > 2 ? 'cloned' : '' }} {{ $index == 0 ? 'active' : '' }}"
                                            style="width: 257px; margin-right: 30px;">
                                            <div class="col-lg-12 col-md-12">
                                                <div class="single-popular-news">
                                                    <div class="news-image">
                                                        <img src="{{ asset($post->post_image) }}"
                                                            alt="{{ $post->title }}">
                                                    </div>
                                                    <div class="news-content">
                                                        <h3>{{ Str::limit($post->title, 70) }}</h3>
                                                        <span>
                                                            <i
                                                                class="icofont-calendar"></i>{{ $post->published_at->format('M d, Y') }}
                                                        </span>
                                                    </div>
                                                    <a href="{{ route('post.view', $post->slug) }}"
                                                        class="link-overlay"></a>
                                                    <div class="tags {{ 'bg-' . $loop->iteration }}">
                                                        <a
                                                            href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                                            {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="owl-nav">
                                <button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button>
                                <button type="button" role="presentation" class="owl-next"><i
                                        class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}


    <section class="technology-area pb-40">
        <div class="container">
            @php
                // $mainPostTech = $technology->posts->first();
                $sidePostsTech = $technology->posts;
            @endphp

            {{-- Main Post --}}
            <div class="section-title">
                <h2>Technology</h2>
            </div>
            <div class="international-news-inner">
                <div class="row">
                    @foreach ($sidePostsTech as $post)
                        <div class="col-lg-4">
                            <div class="single-international-news">
                                <div class="news-image"><img src="{{ asset($mainPostSport->post_image) }}"
                                        alt="{{ $post->title }}" /></div>
                                <div class="news-content">
                                    <span><i class="icofont-calendar"></i>
                                        {{ $mainPostSport->published_at->format('M d, Y') }}</span>
                                    <h3><a
                                            href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                    </h3>
                                </div>
                            </div>
                        </div>
                    @endforeach

                    {{-- Side Posts --}}
                    {{-- <div class="col-lg-3 col-md-12">
                    <div class="space-news-list">
                        @foreach ($sidePostsTech as $post)
                            <div class="single-space-news">
                                <h3><a href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                </h3>
                                <ul>
                                    <li><i class="icofont-clock-time"></i>{{ $post->published_at->format('M d, Y') }}
                                    </li>
                                    <li><i class="icofont-tag"></i> <a
                                            href="{{ route('category', $post->category->slug) }}">{{ $post->category->name }}</a>
                                    </li>
                                    <li><i class="icofont-speech-comments"></i> {{ $post->comments->count() }}</li>
                                </ul>
                            </div>
                        @endforeach

                    </div>
                </div>
                <div class="col-lg-3 col-md-12">
                    <div class="technology-section-ads">
                        <a href="#"><img src="#" alt="image"></a>
                    </div>
                </div> --}}
                </div>
            </div>
        </div>
    </section>

    <section class="international-news-area ptb-40">
        <div class="container">
            <div class="row">
                @php
                    // $mainPostint = $international->posts->first();
                    $listPostsint = $international->posts;
                @endphp
                <div class="col-lg-12 col-md-12">
                    <div class="section-title">
                        <h2>International</h2>
                    </div>
                    <div class="international-news-inner">
                        <div class="row">
                            @foreach ($listPostsint as $post)
                                <div class="col-lg-4">
                                    <div class="single-international-news">
                                        <div class="news-image"><img src="{{ asset($post->post_image) }}"
                                                alt="{{ $post->title }}" /></div>
                                        <div class="news-content">
                                            <span><i class="icofont-calendar"></i>
                                                {{ $post->published_at->format('M d, Y') }}</span>
                                            <h3><a
                                                    href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                            {{-- <div class="col-lg-7">
                                <div class="international-news-list">
                                    @foreach ($listPostsint as $post)
                                        <div class="media news-media align-items-center">
                                            <a href="{{ route('post.view', $post->slug) }}">
                                                <img src="{{ asset($post->post_image) }}"
                                                    alt="{{ $post->title }}" /></a>
                                            <div class="content">
                                                <span><i class="icofont-calendar"></i>
                                                    {{ $post->published_at->format('M d, Y') }}</span>
                                                <h3><a
                                                        href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                                </h3>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div> --}}
                        </div>
                    </div>
                </div>
                {{-- <div class="col-lg-4 col-md-12">
                    <div class="section-title">
                        <h2>Stay Connected</h2>
                    </div>
                    <ul class="stay-connected">
                        <li>
                            <a href="https://www.facebook.com/login/" target="_blank"><i
                                    class="icofont-facebook"></i><b>10.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://twitter.com/login/" target="_blank"><i
                                    class="icofont-twitter"></i><b>14.2K</b> <span>Followers</span></a>
                        </li>
                        <li>
                            <a href="https://linkedin.com/login/" target="_blank"><i
                                    class="icofont-linkedin"></i><b>11.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://en.wikipedia.org/wiki/RSS" target="_blank"><i
                                    class="icofont-rss"></i><b>15.2K</b> <span>Subscriber</span></a>
                        </li>
                    </ul>
                    <div class="stay-connected-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"><img
                                src="{{ asset('frontend/images/3-ads.png"
                                alt="image"></a>
                    </div>
                </div> --}}
            </div>
        </div>
    </section>


    <section class="gallery-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    <div class="gallery-news">
                        <div class="section-title">
                            <h2>Gallery News</h2>
                        </div>
                        <div class="gallery-news-inner-slides owl-carousel owl-theme owl-loaded owl-drag">


                            <div class="owl-stage-outer">
                                <div class="owl-stage"
                                    style="transform: translate3d(-2208px, 0px, 0px); transition: 0.25s; width: 4416px;">
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June 2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.') }}
                                                        alt="image">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button><button type="button"
                                    role="presentation" class="owl-next"><i class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-12">
                    <div class="gallery-news-list">
                        <div class="media gallery-news-media align-items-center">
                            <div class="image">
                                <img
                                    src="{{ asset('frontend/images/small-4.') }}
                                    alt="image">
                                <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                        class="icofont-ui-camera"></i></a>
                            </div>
                            <div class="content">
                                <h3>
                                    <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                            class="icofont-camera-alt"></i> A glance (17 June 2024)</a>
                                </h3>
                            </div>
                        </div>
                        <div class="media gallery-news-media align-items-center">
                            <div class="image">
                                <img
                                    src="{{ asset('frontend/images/small-2.') }}
                                    alt="image">
                                <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                        class="icofont-ui-camera"></i></a>
                            </div>
                            <div class="content">
                                <h3>
                                    <a href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                            class="icofont-camera-alt"></i> A glance (16 June 2024)</a>
                                </h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="all-category-news ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    <div class="section-title">
                        <h2>All News</h2>
                    </div>

                    @foreach ($allPosts as $post)
                        <div class="single-category-news">
                            <div class="row m-0 align-items-center">
                                <div class="col-lg-5 col-md-6 p-0">
                                    <div class="category-news-image">
                                        <a href="{{ route('post.view', $post->slug) }}"><img
                                                src="{{ asset($post->post_image) }}" alt="{{ $post->title }}"></a>
                                        <div class="tags {{ 'bg-' . $loop->iteration }}"> <a
                                                href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                                {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-7 col-md-6">
                                    <div class="category-news-content">
                                        <span><i class="icofont-clock-time"></i>
                                            {{ $post->published_at->format('M d, Y') }}</span>
                                        <h3><a
                                                href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                        </h3>
                                        <p>{{ Str::limit(strip_tags($post->content), 180) }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                    <div class="pagination-area">
                        {{ $allPosts->links() }}
                    </div>

                </div>
                <div class="col-lg-4 col-md-12">
                    <div class="section-title">
                        <h2>Stay Connected</h2>
                    </div>
                    <ul class="stay-connected">
                        <li>
                            <a href="https://www.facebook.com/login/" target="_blank"><i
                                    class="icofont-facebook"></i><b>10.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://twitter.com/login/" target="_blank"><i
                                    class="icofont-twitter"></i><b>14.2K</b> <span>Followers</span></a>
                        </li>
                        <li>
                            <a href="https://linkedin.com/login/" target="_blank"><i
                                    class="icofont-linkedin"></i><b>11.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://en.wikipedia.org/wiki/RSS" target="_blank"><i
                                    class="icofont-rss"></i><b>15.2K</b> <span>Subscriber</span></a>
                        </li>
                    </ul>
                    {{-- <div class="stay-connected-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"><img
                                src="{{ asset('frontend/images/3-ads.png"
                                alt="image"></a>
                    </div> --}}
                    <div class="featured-news">
                        <div class="section-title">
                            <h2>Featured News</h2>
                        </div>
                        @foreach ($featuredPosts as $post)
                            <div class="single-featured-news">
                                <img src="{{ $post->post_image }}" alt="{{ $post->title }}" />

                                <div class="news-content">
                                    <ul>
                                        <li>
                                            <i class="icofont-user-suited"></i>
                                            by <a href="{{ route('author.profile', $post->author->name) }}">
                                                {{ $post->author->name }}
                                            </a>
                                        </li>
                                        <li>
                                            <i class="icofont-calendar"></i>
                                            {{ $post->published_at->format('M d, Y') }}
                                        </li>
                                    </ul>

                                    <h3>
                                        <a href="{{ route('post.view', $post->slug) }}">
                                            {{ Str::limit($post->title, 70) }}
                                        </a>
                                    </h3>
                                </div>

                                <div class="tags {{ 'bg-' . $loop->iteration }}">
                                    <a href="{{ route('category', $post->category->slug) }}">
                                        {{ $post->category->name }}
                                    </a>
                                </div>
                            </div>
                        @endforeach

                    </div>
                    <div class="newsletter-box">
                        <div class="section-title">
                            <h2>Newsletter</h2>
                        </div>
                        <div class="newsletter-box-inner">
                            <h3>Subscribe To Our Mailing List To Get The New Updates!</h3>
                            <i class="icofont-email"></i>
                            <form class="newsletter-form" data-toggle="validator" novalidate="true">
                                <input type="email" class="newsletter-input" placeholder="Enter your email"
                                    name="EMAIL" required="" autocomplete="off"> <button type="submit"
                                    class="disabled" style="pointer-events: all; cursor: pointer;"><i
                                        class="icofont-paper-plane"></i></button>
                                <div id="validator-newsletter" class="form-result"></div>
                            </form>
                        </div>
                    </div>
                    {{-- <div class="hot-news-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-4.html"><img
                                src="{{ asset('frontend/images/4-ads.png"
                                alt="image"></a>
                    </div> --}}
                </div>
            </div>
        </div>
    </section>
    {{-- 
    <section class="more-news-area">
        <div class="container">
            <div class="more-news-inner">
                <div class="section-title">
                    <h2>More News</h2>
                </div>
                <div class="row">
                    <div class="more-news-slides owl-carousel owl-theme owl-loaded owl-drag">
                        <div class="owl-stage-outer">
                            <div class="owl-stage"
                                style="transform: translate3d(-1474px, 0px, 0px); transition: 0.25s; width: 3687px;">
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/2.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-3"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/3.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-4"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/4.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-5"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/1.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-2"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item active" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/2.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-3"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item active" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/3.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-4"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item active" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/4.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-5"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/1.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-2"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/2.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-3"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="owl-item cloned" style="width: 338.667px; margin-right: 30px;">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="single-more-news">
                                            <img src="{{ asset('frontend/images/3.jpg') }}" alt="image">
                                            <div class="news-content">
                                                <ul>
                                                    <li><i class="icofont-user-suited"></i> by <a
                                                            href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                            Smith</a></li>
                                                    <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                                </ul>
                                                <h3><a
                                                        href="https://templates.envytheme.com/sinmun/default/single-post-4.html">As
                                                        well as stopping goals, Cristiane Endler is opening doors.</a></h3>
                                            </div>
                                            <div class="tags bg-4"><a
                                                    href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                    class="icofont-rounded-left"></i></button><button type="button" role="presentation"
                                class="owl-next"><i class="icofont-rounded-right"></i></button></div>
                        <div class="owl-dots disabled"></div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
@endsection
