@extends('frontend.layouts.app')

@section('title', $title)
@php
    $reasons = config()->get('static_array.report_type');
@endphp

@section('meta')
    <meta property="og:title" content="{{$title ?? ''}}" />
    <meta property="og:description" content="{{$og_description ?? ''}}" />
    <meta property="og:image" content="{{$og_image ?? ''}}" />
    <meta name="description" content="{{$ad->meta_description ?? ''}}">
    <meta name="keywords" content="{{$ad->meta_keywords ?? ''}}">
@endsection

@push('style')
    <link rel="stylesheet" href="{{ asset('assets/css/swiper-bundle.min.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/css/magnific-popup.css') }}">
@endpush

@section('content')
    @php
        $adID = $ad?->id;
    @endphp
    @include('frontend.layouts.includes.breadcrumb', [
        'links' => [
            ['Ads' => route('ads')],
            [$ad?->belongsToCity?->name => route('ads', ['location' => $ad?->belongsToCity?->slug])],
            [
                $ad?->belongsToCategory?->name => route('ads', [
                    'location' => $ad?->belongsToCity?->slug,
                    'category' => $ad?->belongsToCategory?->slug,
                ]),
            ],
            [
                $title => route('ads.details', [
                    'location' => $ad->city_slug,
                    'category' => $ad->category_slug,
                    'scategory' => $ad->subcategory_slug,
                    'slug' => $ad->slug,
                ]),
            ],
        ],
    ])

    <!-- ======================= Local Ad Banner Start  ============================ -->
    <div class="container mb-3">
        <div class="mx-auto text-center">
            {{-- Ad Image Size > 728*90px --}}
            @forelse ($banners as $banner)
            <a href="{{ route('user.banner.click',$banner->id) }}" target="_blank">
                <img class="img-fluid" src="{{ asset($banner->image) }}" alt="Banner Ad" />
            </a>
            @empty
            <a href="#" target="_blank">
                <img class="img-fluid" src="{{ asset('assets/images/banner-ad.png') }}" alt="Banner Ad" />
            </a>
            @endforelse
        </div>
    </div>
    <!-- ======================== Local Ad Banner End  ============================= -->

    <!-- ======================= Listing Details Start  ============================ -->
    <div class="listings_details pt-2 pb-5">
        <div class="container">
            @if ($ad->status != 'active' || $ad->verification_status != 'verified')
                @if ($ad->status=='sold')
                <div class="alert alert-warning m-2">
                    <div class="text-center p-2">
                        This ad already SOLD out.
                    </div>
                </div>
                    @else
                    <div class="alert alert-danger m-2">
                        <div class="text-center p-2">
                            Ads is not available or has been removed by the owner.
                        </div>
                    </div>
                @endif
            @endif
            <div class="bg-light rounded-1 shadow-sm">
                <div class="row g-lg-0">
                    <div class="col-lg-8 border_end">
                        <div class="p-3">
                            <div class="singel_listing_name">

                                <h1>{{ $ad?->title }}</h1>
                            </div>
                            <div class="posted_date">
                                Posted on {{ date('d-m-Y h:i a', strtotime($ad?->created_at)) }}, <a
                                    href="{{ route('ads', ['location' => $ad?->belongsToRegion?->slug]) }}">{{ $ad?->belongsToRegion?->name }}</a>,
                                <a
                                    href="{{ route('ads', ['location' => $ad?->belongsToCity?->slug]) }}">{{ $ad?->belongsToCity?->name }}</a>
                            </div>
                            <div class="listing_gallery mb-4 mt-4">
                                <div class="listing-gallery">
                                    <div class="swiper swiperGallery">
                                        <div class="swiper-wrapper">

                                            <a class="swiper-slide popup" href="{{ getPhoto($ad->thumbnail) }}">
                                                <img src="{{ getPhoto($ad->thumbnail) }}" alt="{{ getPhoto($ad->title) }}">
                                            </a>
                                            @foreach ($ad->hasManyGallery as $gellary)
                                                <a class="swiper-slide popup" href="{{ getPhoto($gellary->image) }}">
                                                    <img src="{{ getPhoto($gellary->image) }}"
                                                        alt="{{ getPhoto($gellary->image) }}">
                                                </a>
                                            @endforeach

                                        </div>
                                        <div class="swiper-button-next"></div>
                                        <div class="swiper-button-prev"></div>
                                    </div>
                                    <div class="swiper swiperThumbs">
                                        <div class="swiper-wrapper">

                                            <div class="swiper-slide">
                                                <img src="{{ getPhoto($ad->thumbnail) }}" alt="{{ getPhoto($ad->slug) }}">
                                            </div>

                                            @foreach ($ad->hasManyGallery as $gellary)
                                                <div class="swiper-slide">
                                                    <img src="{{ getPhoto($gellary?->image) }}"
                                                        alt="{{ getPhoto($gellary?->image) }}">
                                                </div>
                                            @endforeach

                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_listing_des">
                                @if ($ad->category_slug && $ad->category_slug != 'jobs')
                                    @if ($ad->negotiable == '1')
                                        <div class="price mb-3">Negotiable</div>
                                    @else
                                        <div class="price mb-3">
                                            {{ $setting?->currency_symbol }} {{ $ad?->price }}
                                            @if ($ad->category_slug && $ad->category_slug == 'property')
                                                {{ $ad?->hasOneAdsInfo?->property_price_type }}
                                            @endif
                                        </div>
                                    @endif
                                @endif
                                <div class="short_info mb-3">
                                    <ul>
                                        @if ($ad?->condition)
                                            <li>Condition : <span class="text-dark text-uppercase">{{ $ad?->condition }}</span></li>
                                        @endif

                                        @if ($ad?->belongsToBrand?->name)
                                            <li>Brand : <span class="text-dark">{{ $ad?->belongsToBrand?->name }}</span>
                                            </li>
                                        @endif

                                        @if ($ad?->model)
                                            <li>Model : <span class="text-dark">{{ $ad?->model }}</span></li>
                                        @endif

                                        @if ($ad?->edition)
                                            <li>Edition : <span class="text-dark">{{ $ad?->edition }}</span></li>
                                        @endif

                                        @if ($ad?->authenticity)
                                            <li>Authenticity : <span class="text-dark">{{ $ad?->authenticity }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->designation)
                                            <li>Designation : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->designation }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->job_type)
                                            <li>Job Type : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->job_type }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->experience)
                                            <li>Experience : <span class="text-dark">{{ $ad?->hasOneAdsInfo?->experience }}
                                                    years</span>
                                            </li>
                                        @endif

                                        @if ($ad?->hasOneAdsInfo?->required_education)
                                            <li>Education Qualification : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->required_education }}</span>
                                            </li>
                                        @endif

                                        @if ($ad?->hasOneAdsInfo?->employer_phone || $ad?->hasOneAdsInfo?->receive_is_email)
                                            <li>
                                                Recruiter want to received application :
                                                @if ($ad?->hasOneAdsInfo?->receive_is_email)
                                                    <span><i class="fas fa-check-circle text-success"></i> By Email</span>
                                                @endif
                                                @if ($ad?->hasOneAdsInfo?->receive_is_phone == '1')
                                                    <span><i class="fas fa-check-circle text-success"></i> By Phone</span>
                                                @endif
                                            </li>
                                        @endif



                                        @if ($ad?->hasOneAdsInfo?->salary_from || $ad?->hasOneAdsInfo?->salary_to)
                                            <li>Salary : <span class="text-dark">{{ $setting->currency_symbol }}
                                                    {{ $ad?->hasOneAdsInfo?->salary_from }}</span> to <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->salary_to }}</span>
                                            </li>
                                            {{-- @else
                                            <li>Salary : Negotiable</li> --}}
                                        @endif

                                        @if ($ad?->hasOneAdsInfo?->deadline)
                                            <li>Application deadline : <span
                                                    class="text-dark">{{ date('d M Y', strtotime($ad?->hasOneAdsInfo?->deadline)) }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->employer_name)
                                            <li>Recruiter Name : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->employer_name }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->employer_email)
                                            <li>Recruiter Email : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->employer_email }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->employer_phone)
                                            <li>Recruiter Phone : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->employer_phone }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->website)
                                            <li>Recruiter Website : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->website }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->employer_logo)
                                            <li>Recruiter Company Logo : <br><img class="img-thumbnail"
                                                    style="width: 160px ;height: 160px;"
                                                    src="{{ getPhoto($ad?->hasOneAdsInfo?->employer_logo) }}"
                                                    alt="{{ $ad?->hasOneAdsInfo?->employer_logo }}">

                                            </li>
                                        @endif

                                        @if ($ad?->hasOneAdsInfo?->vehicle_body_type)
                                            <li>Body Type : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->vehicle_body_type }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->vehicle_transmission)
                                            <li>Transmission : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->vehicle_transmission }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->registration_year)
                                            <li>Year of Manufacture : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->vehicle_manufacture }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->vehicle_fule_type)
                                            @php
                                                $vehicleFuelTypes = $ad->hasOneAdsInfo->vehicle_fule_type;

                                                // If the vehicle_fule_type is stored as a JSON string, decode it first
                                                if (is_string($vehicleFuelTypes)) {
                                                    $vehicleFuelTypes = json_decode($vehicleFuelTypes, true);
                                                }

                                                // Convert the array to a comma-separated string
                                                $vehicleFuelTypesString = is_array($vehicleFuelTypes)
                                                    ? implode(', ', $vehicleFuelTypes)
                                                    : $vehicleFuelTypes;
                                            @endphp
                                            <li>Fule type : <span class="text-dark">{{ $vehicleFuelTypesString }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->vehicle_manufacture)
                                            <li>Registration year : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->registration_year }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->vehicle_engine_capacity)
                                            <li>Vehicle Engine Capacity : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->vehicle_engine_capacity }}
                                                    cc</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->property_type)
                                            <li>Property Type : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->property_type }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->property_type)
                                            <li>Address : {{ $ad?->address }}
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->property_size)
                                            <li>Size : <span class="text-dark">{{ $ad?->hasOneAdsInfo?->property_size }}
                                                    {{ $ad?->hasOneAdsInfo?->property_unit }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->textbook_type)
                                            <li>Type : <span
                                                    class="text-dark">{{ $ad?->hasOneAdsInfo?->textbook_type }}</span>
                                            </li>
                                        @endif
                                        @if ($ad?->hasOneAdsInfo?->ads_type)
                                            @php
                                                if (
                                                    $ad->category_slug &&
                                                    $ad->category_slug == 'mens-fashion-grooming'
                                                ) {
                                                    $cloth_types = config()->get('static_array.mens_clothing');
                                                } else {
                                                    $cloth_types = config()->get('static_array.womens_clothing');
                                                }
                                            @endphp
                                            <li>Type : <span
                                                    class="text-dark">{{ $cloth_types[$ad?->hasOneAdsInfo?->ads_type] }}</span>
                                            </li>
                                        @endif

                                    </ul>
                                </div>
                                @if ($ad?->hasManyFeatures?->count() > 0)
                                    <div class="features_list mb-3">
                                        <h3>Features</h3>

                                        <div class="freatures">
                                            @forelse($ad?->hasManyFeatures as $feature)
                                                {!! $feature->name !!}
                                            @empty
                                                {!! 'No Features' !!}
                                            @endforelse
                                        </div>
                                    </div>
                                @endif
                                <div class="description mb-4">
                                    <h3>Description</h3>
                                    <div class="desc">
                                        {!! nl2br($ad?->hasOneAdsInfo?->description) !!}
                                    </div>
                                </div>
                                <hr>
                                @if (empty($auth_report))
                                    <div class="text-center">
                                        <a href="{{ Auth::check() ? 'javascript:void(0)' : route('login') }}"
                                            class="btn btn-sm btn-warning"
                                            data-bs-toggle="{{ Auth::check() ? 'modal' : '' }}"
                                            data-bs-target="{{ Auth::check() ? '#adReportModal' : '' }}">
                                            <svg width="18" height="18" viewBox="0 0 18 18"
                                                class="svg-wrapper--8ky9e">
                                                <g transform="translate(1 1)" fill="none" fill-rule="evenodd">
                                                    <circle stroke="#707676" stroke-width="2" cx="8"
                                                        cy="8" r="8"></circle>
                                                    <path fill="#707676"
                                                        d="M12.461 1.3l1.362 1.143L3.54 14.7l-1.362-1.143z"></path>
                                                </g>
                                            </svg>
                                            Report this ad
                                        </a>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="details_sidebar p-3 position-sticky" style="top:5rem;">
                            <div class="seller_name">
                                <h5>For sale by <strong>{{ $ad?->belongsToUser?->name }}</strong> <br></h5>
                                {{-- @if ($ad->category_id == '15')
                                    <a href="{{ route('frontend.provider', ['id' => $ad?->user_id,'name' => Str::slug($ad?->belongsToUser?->name)]) }}" target="_blank">See Provider Profile</a>
                                @else
                                @endif --}}
                                <a href="{{ route('seller.shop', ['id' => $ad?->user_id,'name' => Str::slug($ad?->belongsToUser?->name)]) }}" target="_blank">See all ads
                                    from this member</a>
                            </div>
                            <hr>
                            <div class="phone_number text-dark d-flex align-items-center" onclick="showPhoneNumber(this)">
                                <img src="{{ asset('assets/images/icons/phone.png') }}" class="me-2" alt="Phone">
                                <div class="click_text">Click to show phone number</div>

                                @if ($ad?->phone)
                                    <a href="tel:{{ $ad?->phone }}"
                                        class="phone_n px-2 py-1 me-2 text-success bg-success bg-opacity-10 border border-success border-opacity-10 rounded-2"
                                        style="display: none;">
                                        {{ $ad?->phone }}
                                    </a>
                                @endif
                                @if ($ad?->phone2)
                                    <a href="tel:{{ $ad?->phone2 }}"
                                        class="phone_n px-2 py-1 me-2 text-success bg-success bg-opacity-10 border border-success border-opacity-10 rounded-2"
                                        style="display: none;">
                                        {{ $ad?->phone2 }}
                                    </a>
                                @endif
                            </div>
                            <hr>
                            <div class="chat">
                                <a href="{{ auth()->guard('user')->check() && auth()->guard('user')->id() == $ad->user_id ? 'javascript:void(0)' : route('user.chatform', $ad->user_id) }}"
                                    class="text-dark" @if (auth()->guard('user')->check() && auth()->guard('user')->id() !== $ad->user_id) target="_blank" @endif>
                                    <img src="{{ asset('assets/images/icons/chat.png') }}" class="me-2"
                                        alt="Chat">
                                    Chat
                                    @if (auth()->guard('user')->check() && auth()->guard('user')->id() == $ad->user_id)
                                        <span class="badge rounded-pill text-bg-secondary" data-bs-toggle="tooltip"
                                            data-bs-placement="top" data-bs-custom-class="custom-tooltip"
                                            data-bs-title="You can not chat with yourself"><i
                                                class="fas fa-info"></i></span>
                                    @endif

                                </a>
                            </div>
                            <hr>
                         @if ($ad->is_escrow==1)
                            @guest
                                <div class="escrow">
                                    <a href="{{ route('user.escrow.create', $ad->id) }}"
                                    class="text-dark" @if (auth()->guard('user')->check() && auth()->guard('user')->id() !== $ad->user_id) @endif>
                                        <img src="{{ asset('assets/images/escrow.png') }}" class="me-2" alt="escrow">
                                        Buy with SokoBuild Escrow
                                    </a>
                                </div>
                            @else
                                @if(Auth::user()->id != $ad->user_id )
                                    <div class="escrow">
                                        <a href="{{ route('user.escrow.create', $ad->id) }}"
                                        class="text-dark" @if (auth()->guard('user')->check() && auth()->guard('user')->id() !== $ad->user_id) @endif>
                                            <img src="{{ asset('assets/images/escrow.png') }}" class="me-2" alt="escrow">
                                            Buy with SokoBuild Escrow
                                        </a>
                                    </div>
                                @endif
                            @endguest
                     

                         @endif

                            <hr>
                            <div class="safety_tips_box border p-3 rounded shadow-sm">
                                <h4>Posting rules: Avoid Online Scams</h4>
                                <p>
                                    Never share card details or OTPs, and always verify items in person before payment.
                                    Soco Build does not offer a delivery service. Stay vigilant!
                                </p>
                                <a href="{{ route('frontend.posting-rules') }}" target="_blank" class="mt-3 d-block">See
                                    all posting rules <i class="fa fa-angle-right"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ======================= Listing Details End  ============================ -->

    @if ($related_ads && count($related_ads) > 0)

        <!-- ======================= Similar Listings Start  ============================ -->
        <div class="related_listings pb-0">
            <div class="container">
                <div class="section_heading mb-3">
                    <h3 class="title">Favorites Just for You</h3>
                </div>
                <div id="carouselExample" class="carousel slide">
                    <div class="carousel-inner listings_wrap">
                        @foreach ($related_ads as $related_ad)
                            <div class="carousel-item @if ($loop->first) active @endif">
                                <div class="row">
                                    @foreach ($related_ad as $ad)
                                        <!-- list item -->
                                        <div class="col-lg-6 mt-2">
                                            @include('frontend.ads.list-item')
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        @endforeach


                        {{-- <div class="carousel-item">
                            <div class="row">
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/3.jpg')}}" class="me-3"
                                                     alt="Google Pixel 5a 5g (Used)">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">Google Pixel 5a 5g (Used)</h2>
                                                <div class="listing_info mb-1">Kumasi, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 757.00</div>
                                                <div class="date text-end">1 minute</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/4.jpg')}}" class="me-3"
                                                     alt="Hero 2024">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">Hero 2024</h2>
                                                <div class="car_info mb-1">25,600 km, 110 cc</div>
                                                <div class="listing_info mb-1">Bolgatanga, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 900.00</div>
                                                <div class="date text-end">1 minute</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/5.jpg')}}" class="me-3"
                                                     alt="Wardrobe for sell">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">Wardrobe for sell</h2>
                                                <div class="listing_info mb-1">Kumasi, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 400.00</div>
                                                <div class="date text-end">just now</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/6.jpg')}}" class="me-3"
                                                     alt="needs keeway rks 100cc">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">needs keeway rks 100cc</h2>
                                                <div class="listing_info mb-1">Sunyani, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 456.00</div>
                                                <div class="date text-end">1 minute</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="carousel-item">
                            <div class="row">
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/7.jpg')}}" class="me-3"
                                                     alt="Realme Gt Master Edition masters (Used)">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">Realme Gt Master Edition masters (Used)</h2>
                                                <div class="listing_info mb-1">Ashaiman, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 265.00</div>
                                                <div class="date text-end">just now</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/8.jpg')}}" class="me-3" alt="5200 SqFt Brand New Commercial Space Rent In
                                                Gulshan (2)">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">5200 SqFt Brand New Commercial Space Rent In
                                                    Gulshan (2)</h2>
                                                <div class="listing_info mb-1">Sunyani, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 300.00</div>
                                                <div class="date text-end">1 minute</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- list item -->
                                <div class="col-lg-6">
                                    <div class="listing_item h-100">
                                        <div class="d-flex position-relative w-100">
                                            <a href="{{route('ads.details',['location'=>$ad->city_slug,'category'=>$ad->category_slug,'scategory'=>$ad->subcategory_slug,'slug'=>$ad->slug])}}"
                                               class="listing_img d-block stretched-link">
                                                <img src="{{asset('assets/images/listings/9.jpg')}}" class="me-3"
                                                     alt="Xiaomi Redmi 8 4/64 (Used)">
                                            </a>
                                            <div class="listing_content w-100 overflow-hidden">
                                                <h2 class="mb-1 listing_name">Xiaomi Redmi 8 4/64 (Used)</h2>
                                                <div class="listing_info mb-1">Ashaiman, Mobile Phones</div>
                                                <div class="listing_price">{{$setting?->currency_symbol}} 500.00</div>
                                                <div class="date text-end">just now</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> --}}
                    </div>
                    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExample"
                        data-bs-slide="prev">
                        <i class="fa fa-angle-left"></i>
                    </button>
                    <button class="carousel-control-next" type="button" data-bs-target="#carouselExample"
                        data-bs-slide="next">
                        <i class="fa fa-angle-right"></i>
                    </button>
                </div>
            </div>
        </div>
        <!-- ======================= Similar Listings End  ============================ -->
    @endif

    <!-- ======================= Modal Start  ============================ -->

    <!-- Report Ad -->
    <div class="report_modal modal fade" id="adReportModal" tabindex="-1" aria-labelledby="adReportModalLabel"
        aria-hidden="true" data-bs-backdrop="static">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="modal-title fs-5" id="adReportModalLabel">Is there something wrong with this ad?</div>
                    <button type="button" class="btn-close shadow-none" data-bs-dismiss="modal"
                        aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <p class="mb-4">
                        We're constantly working hard to assure that our ads meet high standards and we are very
                        grateful for any kind of feedback from our users.
                    </p>
                    <form action="{{ route('ad-report.store') }}" method="post">
                        @csrf
                        <input type="hidden" name="ads_id" value="{{ $adID }}">
                        <div class="mb-4">
                            <label for="reason" class="form-label">Reason <span class="text-danger">*</span></label>

                            <select name="reason" id="reason" required class="form-control shadow-none form-select">
                                <option value="" class="d-none">Reason</option>
                                @foreach ($reasons as $key => $reason)
                                    <option value="{{ $key }}">{{ $reason }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="mb-4">
                            <label for="name" class="form-label">Your Name <span class="text-danger">*</span></label>
                            <input type="text" name="name" id="name" class="form-control shadow-none"
                                placeholder="Your Name" required
                                value="{{ auth()->guard('user')->check() ? auth()->guard('user')->user()->name : '' }}">
                        </div>
                        <div class="mb-4">
                            <label for="email" class="form-label">Your Email <span
                                    class="text-danger">*</span></label>
                            <input type="email" name="email" id="email" class="form-control shadow-none"
                                placeholder="Your Email" required
                                value="{{ auth()->guard('user')->check() ? auth()->guard('user')->user()->email : '' }}">
                        </div>
                        <div class="mb-4">
                            <label for="reason" class="form-label">Message <span class="text-danger">*</span></label>
                            <textarea name="message" id="message" maxlength="999" class="form-control shadow-none" rows="5" required
                                placeholder="Your Message"></textarea>
                        </div>
                        <div class="">
                            <button type="submit" class="btn btn-primary w-100 text-uppercase">Send</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection

@push('scripts')
    <script src="{{ asset('assets/js/swiper-bundle.min.js') }}"></script>
    <script src="{{ asset('assets/js/magnific-popup.min.js') }}"></script>
    <script>
        // listing gallery
        var swiper = new Swiper(".swiperThumbs", {
            spaceBetween: 10,
            slidesPerView: 6,
        });
        var swiper2 = new Swiper(".swiperGallery", {
            spaceBetween: 10,
            effect: 'fade',
            navigation: {
                nextEl: ".swiper-button-next",
                prevEl: ".swiper-button-prev",
            },
            thumbs: {
                swiper: swiper,
            },
        });

        // magnificPopup
        $(document).ready(function() {
            $('.popup').magnificPopup({
                type: 'image',
                gallery: {
                    enabled: true
                }
            });
        });

        // show phone number
        function showPhoneNumber() {
            $('.click_text').hide();
            $('.phone_n').show();
        }
    </script>
@endpush