@extends('layouts.app')
@if(!empty($getServicesDetail->title))
@section('title',$getServicesDetail->title)
@else
@section('title',$Title)
@endif
@section('content')

<div class="position-relative">
    <div class="iq-breadcrumb bg-primary-subtle">
        <div class="container">
            <nav aria-label="breadcrumb" class="text-center">
                <h2 class="title">Service Detail</h2>
                <ol class="breadcrumb justify-content-center mt-2 mb-0">
                    <li class="breadcrumb-item">
                        <a href="{{url('/')}}">Home</a>
                    </li>
                </ol>
            </nav>
        </div>
    </div>
</div>

<div class="section-padding service-details">
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
                <div class="about-service">
                    <div class="position-relative">
                        <img src="{{asset('service/'.$getServicesDetail->image)}}" class="img-fluid" alt="{{$getServicesDetail->img_alt ?? ""}}" title="{{$getServicesDetail->img_title ?? ""}}">
                    </div>
                    <div class="iq-title-box mt-5 mb-0">
                        <h3 class="iq-title iq-heading-title mb-2">
                            <span class="right-text text-capitalize">{{$getServicesDetail->title ?? ""}}</span>
                        </h3>
                        <p class="iq-title-desc text-body">
                            {!! $getServicesDetail->description ?? "" !!}
                        </p>
                    </div>

                </div>
            </div>
            <div class="col-lg-4 mt-lg-0 mt-5">
                <div class="widget-area">
                    <div class="widget bg-primary-subtle iq-widget-menu p-5 mb-5">
                        <h5 class="widget-title position-relative mb-5 pb-3 letter-spacing-1 fw-normal">Recent Post</h5>
                        <ul class="p-0 m-0">
                            @forelse($getServices as $list)
                            <li class="d-flex gap-4">
                                <div class="img-holder">
                                    <a href="{{url('services/'.$list->slug)}}">
                                        <img src="{{asset('service/'.$list->image)}}" alt="{{$list->img_alt}}" title="{{$list->title}}" class="img-fluid">
                                    </a>
                                </div>
                                <div class="post-blog">
                                    <ul class="list-inline mb-2">
                                        <li class="list-inline-item border-0 mb-0 pb-0">
                                            <a href="#"> <i class="far fa-calendar-alt me-2" aria-hidden="true"></i>{{$list->created_at}}
                                            </a>
                                        </li>
                                    </ul>
                                    <a class="new-link" href="{{url('services/'.$list->slug)}}">
                                        <h6 class="post-title mb-0">{{$list->title}}</h6>
                                    </a>
                                </div>
                            </li>
                            @empty
                            @endforelse

                        </ul>

                    </div>

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

@endsection