@extends('layouts.webpage.main_two')

@section('page-title', 'Projects')

@section('content')

        <section class="hero-section about-ban" style="background-image: url('{{ asset('uploads/projects/featured/' . $project->featured_img) }}')">
            <div class="hero-content about-inner">

                {{-- Main Heading --}}
                <h1 class="about-page">
                    Project Details
                </h1>

                <!-- Brochure Download -->
                 <div class="d-flex flex-column align-items-center gap-2 mt-3">
                     @php
    $defaultBrochure = 'uploads/brochures/1766551813_1764931665_Meking E-Brochure (1).pdf';
    $brochurePath = $project->button_link
        ? 'uploads/project_brochures/' . $project->brochure
        : $defaultBrochure;
                    @endphp
                    <a href="{{ asset($brochurePath) }}"
                    download
                    class="btn btn-primary download">
                        <i class="bi bi-download"></i> Download Brochure
                    </a>


                    <a href="{{ route('request') }}" class="btn main-butn">
                        Get a Quote <i class="bi bi-chevron-right"></i>
                    </a>
                </div>


            </div>
        </section>

    <!-- 
        <section class="single-product">
            @if(!empty($project->featured_img))
                <img src="{{ asset('uploads/projects/featured/' . $project->featured_img) }}" 
                    class="img-fluid" 
                    alt="{{ $project->title }}">
            @else
                <img src="{{ asset('assets/img/default-project.jpg') }}" 
                    class="img-fluid" 
                    alt="Default project image">
            @endif
        </section> -->

        <div data-aos="fade-up">
        <section class="structure py-5">
            <div class="container text-center">

                <!-- Project Title & Location -->
                <h2 class="main-title">{{ $project->title ?? 'Project Title' }}</h2>
                <p class="main-para">{{ $project->location ?? 'Project Location' }}</p>

                <!-- About Section -->
                <div class="row ">
                    <h3>About the Project</h3>
                    <p class="sec-para">
                        {!! $project->content ?? 'Project description not available.' !!}
                    </p>
                </div>

                <!-- Info Section -->
               <div class="container my-4">
                <div class="row justify-content-center g-3 text-center">

                    <div class="col-md-3">
                        <div class="border rounded-3 p-3 h-100 bg-white info-box">
                            <div class="mb-2">
                                <i class="bi bi-geo-alt fs-4 text-primary"></i>
                            </div>
                            <h6 class="fw-semibold mb-1">Location</h6>
                            <p class="text-muted small mb-0">
                                {{ $project->location ?? 'N/A' }}
                            </p>
                        </div>
                    </div>

                    <div class="col-md-3">
                        <div class="border rounded-3 p-3 h-100 bg-white info-box">
                            <div class="mb-2">
                                <i class="bi bi-stopwatch fs-4 text-primary"></i>
                            </div>
                            <h6 class="fw-semibold mb-1">Duration</h6>
                            <p class="text-muted small mb-0">
                                {{ $project->duration ?? 'N/A' }}
                            </p>
                        </div>
                    </div>

                </div>
            </div>



                    <!-- <div class="col-md-4">
                        <div class="info-box">
                            <h4><i class="bi bi-person"></i> Client</h4>
                            <p class="main-para">{{ $project->client_name ?? 'N/A' }}</p>
                        </div>
                    </div> -->
            


                <!-- Key Features -->
               @if(!empty($project->project_desc))
                <div class="row mt-5">
                    <h4>Key Features</h4>
                    <div class="text-start main-para">
                        {!! $project->project_desc !!}
                    </div>
                </div>
            @endif


                <!-- Behind the Build -->
                <!-- <div class="row">
                    <h4>Behind the Build</h4>
                    @if(!empty($project->gallery_images))
                        @foreach(json_decode($project->gallery_images, true) as $image)
                            <div class="col-lg-4 col-md-6 mb-3">
                                <img src="{{ asset('uploads/projects/gallery/' . $image) }}" class="img-fluid rounded shadow-sm" alt="Project Image">
                            </div>
                        @endforeach
                    @else
                        <p>No images available for this project.</p>
                    @endif
                </div> -->

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





@endsection