@extends("layouts.front.main")
@section("content")
                 <!-- page title area start -->
                 <section class="page-title-area pt-160 pb-160" data-overlay="8" data-background="../renovation-construction/img/bg/page-title-bg.jpg">
                    <div class="container">
                        <div class="row">
                            <div class="col-xl-12">
                                <div class="page-title text-center">
                                    <div class="border-title">
                                        <h1>Project</h1>
                                    </div>
                                    <h1>Project Details</h1>
                                    <nav aria-label="breadcrumb">
                                        <ol class="breadcrumb justify-content-center">
                                            <li class="breadcrumb-item">
                                                <a href="index-2.html">Home</a>
                                            </li>
                                            <li class="breadcrumb-item active" aria-current="page">Project Details</li>
                                        </ol>
                                    </nav>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <!-- page title area end -->

                <!-- services start -->
                <section class="services-details pt-120 pb-80">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-12 pr-25">
                                <div class="s-details-single mb-40">
                                    <div class="s-details-thumb">
                                        <img src="{{ $project->getFirstMediaUrl('project','mainthumb') }}" alt="image_not_found">
                                    </div>
                                    <div class="s-details-text">
                                        <h2>{{ $project->name }}</h2>
                                        <p>{{ $project->description }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>

                 <section class="services-details pb-80">
                     <div class="container">
                         <div class="project-info slider-style-1 owl-carousel">
                            @isset($project)
                            @foreach ($project->getMedia('gallery') as $file)


                            {{-- <p><img src="{{ $file->getFullUrl('mainthumb') }}" width="80" height="80" alt=""></p> --}}
                            <div class="single-project">
                                <div class="project-thumb">
                                    <img src="{{ $file->getFullUrl('mainthumb') }}" alt="image_not_found">
                                </div>
                            </div>
                            @endforeach

                            @endisset
                         </div>
                     </div>
                 </section>


                 <section class="pb-80">
                    <div class="container">
                        <iframe style="width:100%" height="500" src="{{ $project->video }}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                    </div>
                </section>
@endsection