@extends('frontend.layouts.app')

@section('content')
    <!-- Hero Section Start -->
    <div class="breadcrumb-wrapper bg-cover"
        style="background-image: url('{{ asset('public/frontend/assets/img/breadcrumb.jpg') }}');">
        <div class="container">
            <div class="page-heading">
                <h1 class="wow fadeInUp" data-wow-delay=".3s">Blog Details</h1>
                <ul class="breadcrumb-items wow fadeInUp" data-wow-delay=".5s">
                    <li>
                        <a href="{{ route('home') }}">
                            Home
                        </a>
                    </li>
                    <li>
                        <i class="fas fa-chevron-right"></i>
                    </li>
                    <li>
                        blog Details
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <!-- News Details Section Start -->
    <section class="news-details-section section-padding">
        <div class="container">
            <div class="news-details-wrapper">
                <div class="row g-4">
                    <div class="col-12 col-lg-8">
                        <div class="news-post-details">
                            <div class="single-news-post">
                                <div class="post-featured-thumb">
                                    <img src="{{ asset('public/' . $blog->banner) }}" class="img-fluid" alt="">
                                </div>
                                <div class="post-content">
                                    <ul class="post-list d-flex align-items-center">
                                        <li>
                                            <i class="fa-regular fa-user"></i>
                                            By Admin
                                        </li>
                                        <li>
                                            <i class="fa-solid fa-calendar-days"></i>
                                            <p>{{ $blog->created_at->format('M d, Y') }}</p>
                                        </li>
                                        <li>
                                            <i class="fa-solid fa-tag"></i>
                                            Technology
                                        </li>
                                    </ul>
                                    <h3>Driving Success Through the Technological Expertise Tech for Tomorrow</h3>
                                    <p class="mb-3">
                                        {!! $blog->description !!}
                                    </p>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="col-12 col-lg-4">
                        <div class="main-sidebar sticky-style">
                            <div class="single-sidebar-widget">
                                <div class="wid-title">
                                    <h4>Search</h4>
                                </div>
                                <div class="search-widget">
                                    <form action="#">
                                        <input type="text" placeholder="Search here">
                                        <button type="submit"><i class="fa-solid fa-magnifying-glass"></i></button>
                                    </form>
                                </div>
                            </div>
                            <div class="single-sidebar-widget">
                                <div class="wid-title">
                                    <h4>All Services</h4>
                                </div>
                                <div class="news-widget-categories">
                                    <ul>
                                        <li><a href="{{ route('search-engine-optimization') }}">SEO</a> <span>(7)</span>
                                        </li>
                                        <li><a href="{{ route('local-seo') }}">Local SEO</a></li>
                                        <li class="active"><a href="{{ route('digital-content-marketing') }}">Content
                                                Marketing</a> <span>(5)</span>
                                        </li>
                                        <li><a href="{{ route('social-media-marketing') }}">Social Marketing</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="single-sidebar-widget">
                                <div class="wid-title">
                                    <h3>Recent Post</h3>
                                </div>
                                <div class="recent-post-area">
                                    @foreach ($blogs as $blogss)
                                        <div class="recent-items">
                                            <div class="recent-thumb">
                                                <img src="{{ asset('public/' . $blogss->banner) }}" class="img-fluid"
                                                    alt="img">
                                            </div>
                                            <div class="recent-content">
                                                <ul>
                                                    <li>
                                                        <i class="fa-solid fa-calendar-days"></i>
                                                        <p>{{ $blogss->created_at->format('M d, Y') }}</p>
                                                    </li>
                                                </ul>
                                                <h6>
                                                    <a href="{{ route('blog-detail', ['slug' => $blogss->slug]) }}">
                                                        {{ Str::limit($blogss->short_description, 30) }}
                                                    </a>
                                                </h6>
                                            </div>
                                        </div>
                                    @endforeach
                                    {{-- <div class="recent-items">
                                        <div class="recent-thumb">
                                            <img src="{{ asset('public/frontend/assets/img/news/pp4.jpg') }}"
                                                alt="img">
                                        </div>
                                        <div class="recent-content">
                                            <ul>
                                                <li>
                                                    <i class="fa-solid fa-calendar-days"></i>
                                                    12 Mar, 2025
                                                </li>
                                            </ul>
                                            <h6>
                                                <a href="news-details.html">
                                                    Keep Your Business Safe <br> Ensure High Availability
                                                </a>
                                            </h6>
                                        </div>
                                    </div> --}}
                                    {{-- <div class="recent-items">
                                        <div class="recent-thumb">
                                            <img src="{{ asset('public/frontend/assets/img/news/pp5.jpg') }}"
                                                alt="img">
                                        </div>
                                        <div class="recent-content">
                                            <ul>
                                                <li>
                                                    <i class="fa-solid fa-calendar-days"></i>
                                                    23 Feb, 2025
                                                </li>
                                            </ul>
                                            <h6>
                                                <a href="news-details.html">
                                                    Tackling the Changes of <br> Retell Industry
                                                </a>
                                            </h6>
                                        </div>
                                    </div> --}}
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection