@extends('template-layout.app')
@section('content')
@include('header')

    <!-- Page Header Start -->
    @foreach ($details as $detail)


    <div class="page-header dark-section">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <!-- Page Header Box Start -->
                                     <div class="page-header-box">
                        <h1 class="text-anime-style-3" data-cursor="-opaque">{{ $detail->blog->Bg_Name }}</h1>
                        <nav class="wow fadeInUp">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ route('index') }}">home</a></li>
                                <li class="breadcrumb-item active" aria-current="page">{{ $detail->blog->Bg_Name }}</li>
                            </ol>
                        </nav>
                    </div>
                    <!-- Page Header Box End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Page Header End -->

    <!-- Page Single Post Start -->
    <div class="page-single-post">
        <div class="container">
            <div class="row">
                <div class="col-lg-8">
                    <!-- Post Featured Image Start -->
                    <div class="post-image">
                        <figure class="image-anime reveal">
                            <img src="{{ asset('/uploads/blogs-details/' . $detail->BD_Img) }}" alt="{{ $detail->BD_Img_Alt }}"title="{{ $detail->BD_Img_Title }}">
                        </figure>
                    </div>
                    <!-- Post Featured Image Start -->

                    <!-- Post Single Content Start -->
                    <div class="post-content">
                        <!-- Post Entry Start -->
                        <div class="post-entry">
                            <h2 class="wow fadeInUp" data-wow-delay="0.8s">{{ $detail->blog->Bg_Name }}</h2>
                            <p class="wow fadeInUp">{{ $detail->BD_Para1 }}</p>

                            <p class="wow fadeInUp" data-wow-delay="0.2s">{{ $detail->BD_Para2 }}</p>

                            <blockquote class="wow fadeInUp" data-wow-delay="0.4s">
                                <p>{{ $detail->BD_Quote }}</p>
                            </blockquote>

                            <p class="wow fadeInUp" data-wow-delay="0.6s">{{ $detail->BD_Para3 }}</p>

                            <h2 class="wow fadeInUp" data-wow-delay="0.8s">{{ $detail->BD_Title }}</h2>

                            <p class="wow fadeInUp" data-wow-delay="1s">{{ $detail->BD_Para4 }}</p>

                            <ul class="wow fadeInUp" data-wow-delay="1.2s">
                                <li>{{ $detail->BD_li_1 }}</li>
                                <li>{{ $detail->BD_li_2 }}</li>
                                <li>{{ $detail->BD_li_3 }}</li>
                                <li> {{ $detail->BD_li_4 }}</li>
                                <li>{{ $detail->BD_li_5 }}</li>
                            </ul>

                            <p class="wow fadeInUp" data-wow-delay="1.4s">{{ $detail->BD_Para5 }}</p>
                        </div>
                        <!-- Post Entry End -->


                        <!-- Post Tag Links End -->
                    </div>
                    <!-- Post Single Content End -->
                </div>
                <div class="col-lg-4"><!-- Recent Posts Widget -->
<div class="recent-posts-card">

  <div class="recent-posts-head">
    <h3>Recent Posts</h3>
  </div>

  <div class="recent-posts-list">
@foreach ($latestBlogs as $latestBlog)


    <a class="recent-post" href="{{ route('blog.details', [
                                                        'keyword' => $latestBlog->keyword ?? 'Techservice',
                                                        'name' => Str::slug($latestBlog->Bg_Name),
                                                        'bg_id' => $latestBlog->Bg_Id,
                                                    ]) }}">
      <div class="rp-thumb">
        <img src="{{ asset('/uploads/blogs/'. $latestBlog->Bg_Img) }}" alt="{{ $latestBlog->Bg_Img_Alt }}"title="{{$latestBlog->Bg_Img_Title  }}">
      </div>
      <div class="rp-info">
        <h4>{{$latestBlog->Bg_Name }}</h4>
        <span class="rp-date">Jan 12, 2026</span>
      </div>
    </a>
@endforeach


  </div>
</div>
</div>
            </div>
        </div>
    </div>
        @endforeach
    <!-- Page Single Post End -->

@include('footer')

@endsection