@extends('layouts.app')

@section('content')
<div class="back-wrapper">
            @php
                $locale = app()->getLocale();
            @endphp
            <h1 class="visually-hidden">{{ $siteTitle }}</h1>
            <!--================= Back Hero Start Here =================-->
            <div class="back-hero-area md-mt-40">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-6">
                            <ul class="back-hero-slider owl-carousel">
                                @forelse ($heroPosts as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/hero-blog/' . ($loop->first ? '1' : '11') . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-area">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                            <div class="back-btm-content">
                                                @if ($categoryName)
                                                    <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                @endif
                                                <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                <ul>
                                                    <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                    <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>
                                                </ul>
                                            </div>
                                        </div> 
                                    </li>
                                @empty
                                    <li>
                                        <div class="image-area">
                                            <img src="{{ asset('assets/images/hero-blog/1.jpg') }}" alt="image">
                                            <div class="back-btm-content">
                                                <h3>{{ __('site.common.no_posts') }}</h3>
                                            </div>
                                        </div>
                                    </li>
                                @endforelse
                            </ul>
                        </div>
                        <div class="col-lg-6 back-hero-right">
                            <div class="row back-pl-6">
                                @php
                                    $heroSideMain = $heroSidePosts->first();
                                    $heroSideSmall = $heroSidePosts->slice(1);
                                @endphp
                                <div class="col-lg-12">
                                    <ul>
                                        @if ($heroSideMain)
                                            @php
                                                $slug = $heroSideMain->slugForLocale($locale) ?? '';
                                                $title = $heroSideMain->titleForLocale($locale) ?? '';
                                                $cover = $heroSideMain->cover_image
                                                    ? Storage::url($heroSideMain->cover_image)
                                                    : asset('assets/images/hero-blog/2.jpg');
                                                $category = $heroSideMain->categories->first();
                                                $categoryName = $category?->nameForLocale($locale);
                                                $categorySlug = $category?->slugForLocale($locale);
                                            @endphp
                                            <li>
                                                <div class="image-area">
                                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                                    <div class="back-btm-content">
                                                        @if ($categoryName)
                                                            <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                        @endif
                                                        <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                        <ul>
                                                            <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                            <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($heroSideMain->published_at)->format('M d, Y') }}</li>
                                                        </ul>
                                                    </div>
                                                </div> 
                                            </li>
                                        @endif
                                    </ul>
                                </div>
                                @foreach ($heroSideSmall as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/hero-blog/' . ($loop->first ? '3' : '4') . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                        $listClass = $loop->first ? 'back-pr-3' : 'back-pl-3';
                                    @endphp
                                    <div class="col-lg-6">
                                        <ul class="{{ $listClass }}">
                                            <li>
                                                <div class="image-area">
                                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                                    <div class="back-btm-content">
                                                        @if ($categoryName)
                                                            <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                        @endif
                                                        <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                        <ul>
                                                            <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                        </ul>
                                                    </div>
                                                </div> 
                                            </li>
                                        </ul>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                    <ul class="back-hero-bottom back-hero-slider2 owl-carousel">
                        @forelse ($heroBottomPosts as $post)
                            @php
                                $slug = $post->slugForLocale($locale) ?? '';
                                $title = $post->titleForLocale($locale) ?? '';
                                $cover = $post->cover_image
                                    ? Storage::url($post->cover_image)
                                    : asset('assets/images/hero-blog/' . (string) (5 + $loop->index) . '.jpg');
                                $category = $post->categories->first();
                                $categoryName = $category?->nameForLocale($locale);
                                $categorySlug = $category?->slugForLocale($locale);
                            @endphp
                            <li>
                                <div class="image-areas">
                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                </div>
                                <div class="back-btm-content">
                                    @if ($categoryName)
                                        <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                    @endif
                                    <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                    <ul>
                                        <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>
                                    </ul>
                                </div> 
                            </li>
                        @empty
                            <li>{{ __('site.common.no_posts') }}</li>
                        @endforelse
                    </ul>      
                </div>
            </div>
            <!--================= Back Hero End Here =================-->

            <!--================= Back Trending Stories Start Here =================-->
            <div class="back-trending-stories">
                <div class="container">
                    <div class="back-title">
                        <h2>{{ __('site.home.trending_stories') }}</h2>
                    </div>
                    <ul class="back-trending-slider owl-carousel">
                        @forelse ($trendingPosts as $post)
                            @php
                                $slug = $post->slugForLocale($locale) ?? '';
                                $title = $post->titleForLocale($locale) ?? '';
                                $cover = $post->cover_image
                                    ? Storage::url($post->cover_image)
                                    : asset('assets/images/trending/' . (string) (1 + $loop->index) . '.jpg');
                                $category = $post->categories->first();
                                $categoryName = $category?->nameForLocale($locale);
                                $categorySlug = $category?->slugForLocale($locale);
                            @endphp
                            <li>
                                <div class="image-areas">
                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                    @if ($categoryName)
                                        <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                    @endif
                                </div>
                                <div class="back-btm-content">
                                    <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                    <ul>
                                        <li class="back-author">{{ __('site.common.by') }} <a href="#">{{ $siteTitle }}</a></li>
                                        <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>
                                    </ul>
                                </div> 
                            </li>
                        @empty
                            <li>{{ __('site.common.no_posts') }}</li>
                        @endforelse
                    </ul>
                </div>
            </div>
            <!--================= Back Trending Stories End Here =================-->

            <!--================= Back Latest Posts Start Here =================-->
            <div class="back-hero-area back-latest-posts">
                <div class="container">
                    <div class="row">
                        <div class="col-md-8">
                            <div class="back-title">
                                <h2>{{ __('site.common.latest_posts') }}</h2>
                            </div>
                        </div>
                        <div class="col-md-4 text-right">
                            <a href="{{ route('blog.index', ['locale' => locale_param()]) }}" class="back-btn">{{ __('site.common.view_all') }}</a>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-8">
                            @php
                                $latestPrimary = $latestMain->first();
                            @endphp
                            <ul>
                                @if ($latestPrimary)
                                    @php
                                        $slug = $latestPrimary->slugForLocale($locale) ?? '';
                                        $title = $latestPrimary->titleForLocale($locale) ?? '';
                                        $cover = $latestPrimary->cover_image
                                            ? Storage::url($latestPrimary->cover_image)
                                            : asset('assets/images/latest-news/1.jpg');
                                        $category = $latestPrimary->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-area">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                            <div class="back-btm-content">
                                                @if ($categoryName)
                                                    <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                @endif
                                                <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                <ul>
                                                    <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                    <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($latestPrimary->published_at)->format('M d, Y') }}</li>
                                                </ul>
                                            </div>
                                        </div> 
                                    </li>
                                @else
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endif
                            </ul>
                        </div>
                        <div class="col-lg-4 md-mt-40"> 
                            <ul class="back-hero-bottom">
                                @forelse ($latestSide as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/latest-news/' . (string) (2 + $loop->index) . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-areas">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                        </div>
                                        <div class="back-btm-content">
                                            @if ($categoryName)
                                                <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                            @endif
                                            <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>                                        
                                        </div> 
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endforelse
                            </ul>                           
                        </div>
                    </div>                         
                </div>
            </div>
            <!--================= Back Latest Posts End Here =================-->

            <!--================= Back Add Start Here =================-->
            @if ($bannerHomeTop)
                <div class="back-add text-center">
                    <div class="container">
                        <a href="{{ $bannerHomeTop->link_url ?: '#' }}" target="_blank" rel="noopener">
                            <img src="{{ Storage::url($bannerHomeTop->image) }}" alt="{{ $bannerHomeTop->titleForLocale($locale) ?? 'banner' }}">
                        </a>
                    </div>
                </div>
            @endif
            <!--================= Back Add End Here =================-->

            <!--================= Back Whats Posts Start Here =================-->
            <div class="back-hero-area back-latest-posts back-whats-posts">
                <div class="container">                    
                    <div class="row">
                        <div class="col-lg-8">
                            <div class="back-title">
                                <h2>{{ __('site.home.whats_new') }}</h2>
                            </div>
                            @php
                                $whatsPrimary = $whatsMain->first();
                            @endphp
                            <ul>
                                @if ($whatsPrimary)
                                    @php
                                        $slug = $whatsPrimary->slugForLocale($locale) ?? '';
                                        $title = $whatsPrimary->titleForLocale($locale) ?? '';
                                        $cover = $whatsPrimary->cover_image
                                            ? Storage::url($whatsPrimary->cover_image)
                                            : asset('assets/images/whats/1.jpg');
                                        $category = $whatsPrimary->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-area">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                            <div class="back-btm-content">
                                                @if ($categoryName)
                                                    <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                @endif
                                                <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                <ul>
                                                    <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                    <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($whatsPrimary->published_at)->format('M d, Y') }}</li>
                                                </ul>
                                            </div>
                                        </div> 
                                    </li>
                                @else
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endif
                            </ul>
                            <div class="row pt-30">
                                <div class="col-lg-6">
                                    <ul class="back-whats-btm">
                                        @forelse ($whatsSecondary as $post)
                                            @php
                                                $slug = $post->slugForLocale($locale) ?? '';
                                                $title = $post->titleForLocale($locale) ?? '';
                                                $cover = $post->cover_image
                                                    ? Storage::url($post->cover_image)
                                                    : asset('assets/images/whats/2.jpg');
                                                $category = $post->categories->first();
                                                $categoryName = $category?->nameForLocale($locale);
                                                $categorySlug = $category?->slugForLocale($locale);
                                            @endphp
                                            <li>
                                                <div class="image-areas">
                                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                                    @if ($categoryName)
                                                        <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                                    @endif
                                                </div>
                                                <div class="back-btm-content">                                                    
                                                    <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                    <ul>
                                                        <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                        <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>                                                    
                                                    </ul>
                                                </div>                                            
                                            </li>
                                        @empty
                                            <li>{{ __('site.common.no_posts') }}</li>
                                        @endforelse
                                    </ul>
                                </div>
                                <div class="col-lg-6 md-mt-40">
                                    <ul class="back-hero-bottom back-hero-bottom2">
                                        @forelse ($whatsList as $post)
                                            @php
                                                $slug = $post->slugForLocale($locale) ?? '';
                                                $title = $post->titleForLocale($locale) ?? '';
                                                $cover = $post->cover_image
                                                    ? Storage::url($post->cover_image)
                                                    : asset('assets/images/latest-news/' . (string) (2 + $loop->index) . '.jpg');
                                                $category = $post->categories->first();
                                                $categoryName = $category?->nameForLocale($locale);
                                                $categorySlug = $category?->slugForLocale($locale);
                                            @endphp
                                            <li>
                                                <div class="image-areas">
                                                    <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                                </div>
                                                <div class="back-btm-content">
                                                    @if ($categoryName)
                                                        <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                                    @endif
                                                    <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3> 
                                                    <ul>
                                                        <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>                                                    
                                                    </ul>                                     
                                                </div> 
                                            </li>
                                        @empty
                                            <li>{{ __('site.common.no_posts') }}</li>
                                        @endforelse                                     
                                    </ul>
                                </div>
                            </div>                            
                        </div>
                        <div class="col-lg-4 pl-30"> 
                            <div class="back-title back-small-title">
                                <h2>{{ __('site.common.get_in_touch') }}</h2>
                            </div>
                            <ul class="social-area">
                                <li><div><a href="#"><i class="fa-brands fa-facebook-f"></i></a> <span>{{ __('site.social.followers') }} <em>750</em></span></div></li>
                                <li><div><a href="#"><i class="fa-brands fa-twitter"></i></a> <span>{{ __('site.social.fans') }} <em>1236</em></span></div></li>
                                <li><div><a href="#"><i class="fa-brands fa-instagram"></i></a> <span>{{ __('site.social.likes') }} <em>523</em></span></div></li>
                                <li><div><a href="#"><i class="fa-brands fa-vimeo-v"></i></a> <span>{{ __('site.social.comments') }} <em>790</em></span></div></li>
                                <li><div><a href="#"><i class="fa-brands fa-linkedin-in"></i></a> <span>{{ __('site.social.followers') }} <em>1025</em></span></div></li>
                                <li><div><a href="#"><i class="fa-brands fa-youtube"></i></a> <span>{{ __('site.social.subscribers') }} <em>590M</em></span></div></li>
                            </ul>
                            <div class="back-title back-small-title pt-30">
                                <h2>{{ __('site.home.dont_miss') }}</h2>
                            </div>
                            <ul class="back-hero-bottom">
                                @forelse ($dontMissPosts as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/dont/' . (string) (1 + $loop->index) . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-areas">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                        </div>
                                        <div class="back-btm-content">
                                            @if ($categoryName)
                                                <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                            @endif
                                            <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3> 
                                            <ul>
                                                <li class="back-date">{{ __('site.common.by') }} <a href="#">{{ $siteTitle }}</a></li>                                                    
                                            </ul>                                        
                                        </div> 
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endforelse
                            </ul>  
                            <a href="{{ route('blog.index', ['locale' => locale_param()]) }}" class="view-more"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg> {{ __('site.common.view_more') }}</a>
                            @if ($bannerHomeSidebar)
                                <div class="back-add">
                                    <a href="{{ $bannerHomeSidebar->link_url ?: '#' }}" target="_blank" rel="noopener">
                                        <img src="{{ Storage::url($bannerHomeSidebar->image) }}" alt="{{ $bannerHomeSidebar->titleForLocale($locale) ?? 'banner' }}">
                                    </a>
                                </div>
                            @endif                         
                        </div>
                    </div>                         
                </div>
            </div>
            <!--================= Back Whats Posts End Here =================-->

            <!--================= Back Trading Video Start Here =================-->
            <div class="back-trading-video">
                <div class="container">  
                    <div class="back-title">
                        <h2>{{ __('site.home.trading_video') }}</h2>
                    </div>                  
                    <div class="row">
                        <div class="col-lg-8">                            
                            @php
                                $videoPrimary = $videoMain->first();
                            @endphp
                            <ul>
                                @if ($videoPrimary)
                                    @php
                                        $slug = $videoPrimary->slugForLocale($locale) ?? '';
                                        $title = $videoPrimary->titleForLocale($locale) ?? '';
                                        $cover = $videoPrimary->cover_image
                                            ? Storage::url($videoPrimary->cover_image)
                                            : asset('assets/images/video/1.jpg');
                                    @endphp
                                    <li>
                                        <div class="image-area">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                            <a href="{{ post_url($slug) }}" class="back-video"><i class="fa-solid fa-play"></i></a>
                                            <div class="back-btm-content">
                                                <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                                <ul>
                                                    <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                                    <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($videoPrimary->published_at)->format('M d, Y') }}</li>
                                                </ul>
                                            </div>
                                        </div> 
                                    </li>
                                @else
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endif
                            </ul>                                                        
                        </div>
                        <div class="col-lg-4 pl-30 md-pt-40">                            
                            <ul class="back-hero-bottom">
                                @forelse ($videoSide as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/video/' . (string) (2 + ($loop->index % 5)) . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-areas">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a> 
                                            <a href="{{ post_url($slug) }}" class="back-video"><i class="fa-solid fa-play"></i></a>                               
                                        </div>
                                        <div class="back-btm-content">
                                            @if ($categoryName)
                                                <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                            @endif
                                            <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>                                        
                                        </div> 
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endforelse
                            </ul>                        
                        </div>
                    </div>                         
                </div>
            </div>
            <!--================= Back Trading Video End Here =================-->

            <!--================= Back Feature Posts Start Here =================-->
            <div class="back-hero-area back-latest-posts back-whats-posts back-feature-posts">
                <div class="container">                    
                    <div class="row">
                        <div class="col-lg-8">
                            <div class="back-title">
                                <h2>{{ __('site.home.feature_posts') }}</h2>
                            </div>
                            
                            <ul class="back-hero-bottom back-hero-bottom2">
                                @forelse ($featurePosts as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $excerpt = $post->excerptForLocale($locale)
                                            ?? \Illuminate\Support\Str::limit(strip_tags($post->contentForLocale($locale) ?? ''), 120);
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/feature/' . (string) (1 + $loop->index) . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-areas">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                        </div>
                                        <div class="back-btm-content">
                                            @if ($categoryName)
                                                <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                            @endif
                                            <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3> 
                                            <p>{{ $excerpt }}</p>  
                                            <ul class="back-meta">
                                                <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span>{{ __('site.common.by') }} <a href="#">{{ $siteTitle }}</a></li>
                                                <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>                                                    
                                            </ul>                                     
                                        </div> 
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endforelse                                
                            </ul>
                            <div class="text-center pt-73">
                                <a href="{{ route('blog.index', ['locale' => locale_param()]) }}" class="back-btn">{{ __('site.home.view_all_posts') }}</a>
                            </div>                           
                        </div>
                        <div class="col-lg-4 pl-30"> 
                            <div class="back-title back-small-title">
                                <h2>{{ __('site.common.categories') }}</h2>
                            </div>
                            <ul class="back-category-area">
                                @forelse (($navCategories ?? collect())->take(6) as $category)
                                    @php
                                        $categoryName = $category->nameForLocale($locale) ?? '';
                                        $categorySlug = $category->slugForLocale($locale) ?? '';
                                        $count = $category->posts_count ?? null;
                                        $image = asset('assets/images/category/' . (string) (1 + $loop->index) . '.jpg');
                                    @endphp
                                    <li>
                                        <div>
                                            <img src="{{ $image }}" alt="Cagegory Image">
                                            <a href="{{ category_url($categorySlug) }}">
                                                <span>
                                                    @if ($count !== null)
                                                        <em>{{ $count }}</em>
                                                    @endif
                                                    {{ $categoryName }}
                                                </span>
                                            </a>
                                        </div>
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_categories') }}</li>
                                @endforelse
                            </ul>
                            <div class="back-title back-small-title pt-30">
                                <h2>{{ __('site.home.most_read') }}</h2>
                            </div>
                            <ul class="back-hero-bottom">
                                @forelse ($mostReadPosts as $post)
                                    @php
                                        $slug = $post->slugForLocale($locale) ?? '';
                                        $title = $post->titleForLocale($locale) ?? '';
                                        $cover = $post->cover_image
                                            ? Storage::url($post->cover_image)
                                            : asset('assets/images/read/' . (string) (1 + $loop->index) . '.jpg');
                                        $category = $post->categories->first();
                                        $categoryName = $category?->nameForLocale($locale);
                                        $categorySlug = $category?->slugForLocale($locale);
                                    @endphp
                                    <li>
                                        <div class="image-areas">
                                            <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>                                
                                        </div>
                                        <div class="back-btm-content">
                                            @if ($categoryName)
                                                <a href="{{ category_url($categorySlug) }}" class="back-cates">{{ $categoryName }}</a>
                                            @endif
                                            <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>                                        
                                        </div> 
                                    </li>
                                @empty
                                    <li>{{ __('site.common.no_posts') }}</li>
                                @endforelse
                            </ul>
                            <div class="back-title back-small-title pt-25">
                                <h2>{{ __('site.common.follow_us') }}</h2>                                
                            </div>    
                            <ul class="back-instragram">
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/1.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/2.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/3.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/4.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/5.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                                <li><a href="#"> <img src="{{ asset('assets/images/instragram/6.jpg') }}" alt="image"> <i class="fa-brands fa-instagram"></i></a></li>
                            </ul>                   
                        </div>
                    </div>                         
                </div>
            </div>
            <!--================= Back Feature Posts End Here =================-->

            <!--================= Back Footer Top Area Start Here =================-->
            <div class="back-hero-area footer-top-area">                
                <ul class="back-footer-top-slider owl-carousel">
                    @forelse ($footerTopPosts as $post)
                        @php
                            $slug = $post->slugForLocale($locale) ?? '';
                            $title = $post->titleForLocale($locale) ?? '';
                            $cover = $post->cover_image
                                ? Storage::url($post->cover_image)
                                : asset('assets/images/footer-top/' . (string) (1 + $loop->index) . '.jpg');
                            $category = $post->categories->first();
                            $categoryName = $category?->nameForLocale($locale);
                            $categorySlug = $category?->slugForLocale($locale);
                        @endphp
                        <li>
                            <div class="image-area">
                                <a href="{{ post_url($slug) }}"><img src="{{ $cover }}" alt="image"></a>
                                <div class="back-btm-content">
                                    @if ($categoryName)
                                        <a href="{{ category_url($categorySlug) }}" class="back-cate">{{ $categoryName }}</a>
                                    @endif
                                    <h3><a href="{{ post_url($slug) }}">{{ $title }}</a></h3>
                                    <ul>
                                        <li class="back-author"><span><img src="{{ asset('assets/images/author/1.jpg') }}" alt="image"></span><a href="#">{{ $siteTitle }}</a></li>
                                        <li class="back-date"><span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></span>{{ optional($post->published_at)->format('M d, Y') }}</li>
                                    </ul>
                                </div>
                            </div> 
                        </li>
                    @empty
                        <li>{{ __('site.common.no_posts') }}</li>
                    @endforelse
                </ul>
            </div>
            <!--================= Back Footer Top Area End Here =================-->
        </div>
@endsection