@extends('layouts.frontend.app')
@section('title', 'Home')

@section('content')

<main>
    <!--START POPUP -->
    @if ($popups->count() > 0)
    @foreach ($popups as $index => $popup)
    <div class="modal fade" id="popup{{ $index + 1 }}" tabindex="-1" aria-labelledby="popup{{ $index + 1 }}"
        aria-hidden="true">
        <div class="modal-dialog none ">
            <div class="modal-content">
                <div class="modal-header">
                    @if ($popup->show_title)
                    <h3 class="modal-title">{{ $popup->title }}</h3>
                    @endif

                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <!-- Your modal content goes here -->
                    @if (isset($popup->url) && !empty($popup->url))
                    <a href="{{ $popup->url }}" {{ $popup->target == 1 ? 'target="_blank"' : '' }}>
                        @endif
                        <img src="{{ asset('storage/' . $popup->image) }} " style="width:100%" />
                        @if (isset($popup->url) && !empty($popup->url))
                    </a>
                    @endif
<br>
<br>
                    @if ($popup->btn_label && $popup->url && $popup->show_button == 1)
                    <a href="{{ $popup->url }}" @if($popup->target == 1) target="_blank" @endif>
                        <button type="button" style="float: right;" class="btn-primary-fill pill-btn">{{ $popup->btn_label }}</button>
                    </a>
                    @endif
                </div>
            </div>
        </div>
    </div>
    @endforeach
    @endif
    <!--END POPUP -->

    <!-- Hero area S t a r t-->
    <section class="hero-area">
        <div class="single-slider hero-padding">
            <div class="container">
                <div class="row justify-content-between">
                    @if (isset($banner) && !empty($banner) && $banner->show_block == 1)
                    <div class="col-xxl-6 col-xl-6 col-lg-6 my-auto">
                        <div class="hero-caption-one mb-20">
                            <h4 class="key-title font-700 mb-20 wow fadeInUp" data-wow-delay="0.0s">A Just Equitable and
                                Prosperous Society</h4>
                            <h1 class="title font-700 wow fadeInUp" data-wow-delay="0.1s">{{ $banner->title }}</h1>
                            <p class="pera wow fadeInUp" data-wow-delay="0.3s">{!! $banner->caption !!}</p>
                            <div class="d-flex gap-20 flex-wrap">
                                @if ($banner->link && $banner->link_text)
                                <a class="btn-primary-fill hero-btn wow fadeInLeft" data-wow-delay="0.4s"
                                    href="{{ $banner->link }}" @if ($banner->link_target == 1) target="_blank" @endif>
                                    {!! $banner->link_text !!}</a>
                                @endif
                                <!-- <a href="" class="btn-tertiary-fill hero-btn wow fadeInRight"
                                    data-wow-delay="0.4s">Internship</a> -->
                            </div>
                        </div>
                    </div>
                    @endif

                    <div class="col-xxl-6 col-xl-6 col-lg-6">
                        <div class="d-flex gap-44">
                            @if (isset($banner) && !empty($banner) && $banner->image && file_exists('storage/' . $banner->image))
                            <div class="hero-image position-relative d-none d-lg-block">
                                <img src="{{ asset('storage/' . $banner->image) }}" alt="image of {{ $banner->title }}"
                                    class="w-100 tilt-effect wow fadeInUp" data-wow-delay="0.1s">
                            </div>
                            @endif


                            @if (isset($blocks) && $blocks['block-2']['value'] != null)
                            <div class="hero-count-section flex flex-column gap-60">
                                {!! $blocks['block-2']['value'] !!}
                            </div>
    </section>
    @endif
    </div>
    </div>
    </div>
    </div>
    </div>
    </section>

    <!-- Our event S t a r t-->
    @if ($projects && $projects->count() > 0)
    <section class="our-event section-padding pt-0">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-xl-7">
                    <!-- Section Tittle -->
                    <div class="section-tittle text-center mb-30">
                        <h2 class="title font-700">{{ trans('general.our-projects') }}</h2>
                    </div>
                </div>
            </div>
            <div class="row gy-24 homepage-project">

                @foreach ($projects as $project)
                <div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 view-wrapper">
                    <div class="single-event h-calc wow fadeInUp" data-wow-delay="0.0s">
                        <div class="event-img position-relative">
                            <a
                                href="{{ route('project.show', ['projectType' => $project->category->slug, 'slug' => $project->slug]) }}">
                                <img src="{{ $project->image && file_exists('storage/' . $project->image) ? asset('storage/' . $project->image) : asset('assets/images/no-img.jpg') }}"
                                    class="img-fluid w-100" alt="{{ $project->title }}">
                            </a>
                        </div>
                        <div class="event-info">
                            <div class="d-flex justify-content-between align-items-center gap-6">
                                <div class="event-info-title">
                                    <div class="flex gap-15 mb-18 align-items-center flex-wrap">
                                        <div class="date flex gap-12 align-items-center">
                                            <i class="ri-time-line"></i>
                                            <p class="info">
                                                {{ $project->published_date ? \Carbon\Carbon::parse($project->published_date)->format('M d, Y') : \Carbon\Carbon::parse($project->created_at)->format('M d, Y') }}
                                            </p>
                                        </div>

                                    </div>
                                    <h4><a class="title text-capitalize"
                                            href="{{ route('project.show', ['projectType' => $project->category->slug, 'slug' => $project->slug]) }}">{{ $project->title }}</a>
                                    </h4>
                                </div>
                                <a href="{{ route('project.show', ['projectType' => $project->category->slug, 'slug' => $project->slug]) }}"
                                    class="btn-arrow"><i class="ri-arrow-right-line"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach

            </div>
        </div>
    </section>
    @endif
    <!-- End-of All Product -->

    @if (isset($blocks) && $blocks['block-1']['value'] != null)
    <section class="helpful-area-three section-padding">
        <div class="container">
            {!! $blocks['block-1']['value'] !!}



        </div>
    </section>
    @endif

    <!-- News -->
    <section class="blog-section section-padding">
        <div class=" container">
            <div class="row justify-content-center">
                <div class="col-xl-7">
                    <!-- Section Tittle -->
                    <div class="section-tittle text-center mb-30">
                        <h2 class="title font-700">{{ trans('general.news-and-events') }}</h2>
                    </div>
                </div>
            </div>
            <div class="row gy-24 homepage-news">
                @forelse ($news as $info)
                <div class="col-xl-4 col-lg-4 col-md-6 col-sm-12 view-wrapper">
                    <div class="single-blog h-calc wow fadeInUp" data-wow-delay="0.2s">
                        <div class="position-relative">
                            <a
                                href="{{ $info->category->slug == 'general' || $info->category->slug == 'news' ? route('news.show', $info->slug) : route('events.show', $info->slug) }}">
                                <img src="{{ $info->image && file_exists('storage/' . $info->image) ? asset('storage/' . $info->image) : asset('assets/images/no-img.jpg') }}"
                                    class="img-fluid w-100" alt="{{ $info->title }}">
                            </a>
                        </div>
                        <div class="blog-info">
                            <div class="blog-info-title">
                                <div class="flex gap-16 align-items-center">
                                    <div class="user flex gap-10 align-items-center">
                                        <i class="ri-time-line"></i>
                                        <p class="info">
                                            {{ $info->published_date ? \Carbon\Carbon::parse($info->published_date)->format('M d, Y') : \Carbon\Carbon::parse($info->created_at)->format('M d, Y') }}
                                        </p>
                                    </div>
                                    <div class="donate flex gap-10 align-items-center">
                                        <i class="ri-calendar-todo-line"></i>
                                        <p class="info">{{ $info->category->title }}</p>
                                    </div>

                                </div>
                                <h4 class="title text-capitalize"><a
                                        href="{{ $info->category->slug == 'general' || $info->category->slug == 'news' ? route('news.show', $info->slug) : route('events.show', $info->slug) }}">
                                        {{ $info->title }}
                                    </a></h4>
                                <p class="subtitle">{{ $info->excerpt }}</p>
                            </div>
                        </div>
                    </div>
                </div>
                @empty
                @endforelse

            </div>
        </div>
    </section>
    <!-- News-END -->
    <!-- favorite Area S t a r t -->

    <div class="favourite-section section-padding" style="padding-top: 0;">
        <div class="container">
            <div class="row">
                @if (isset($donors) && $donors->count() > 0)

                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
                    <div class="text-center">
                        <span class="slider-title">Our Donors</span>
                        <div class="slider-line"></div>
                    </div>
                    <div class="favourite-slider">
                        @foreach ($donors as $donor)
                        <div class="img-container">
                            <a href="{{ $donor->url }}" target="_blank">
                                <img src="{{ $donor->image && file_exists('storage/' . $donor->image)
                                                ? asset('storage/' . $donor->image)
                                                : asset('assets/images/no-img.jpg') }}"
                                    alt="image of {{ $donor->title }}">
                            </a>
                        </div>
                        @endforeach
                    </div>
                </div>
                @endif
                @if (isset($partners) && $partners->count() > 0)

                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
                    <div class="text-center">
                        <span class="slider-title">Partners </span>
                        <div class="slider-line"></div>
                    </div>
                    <div class="favourite-slider">
                        @foreach ($partners as $partner)
                        <div class="img-container">
                            <a href="{{ $partner->url }}" target="_blank">
                                <img src="{{ $partner->image && file_exists('storage/' . $partner->image)
                                                ? asset('storage/' . $partner->image)
                                                : asset('assets/images/no-img.jpg') }}"
                                    alt="image of {{ $partner->title }}">
                            </a>
                        </div>
                        @endforeach
                    </div>
                </div>
                @endif

            </div>

        </div>

    </div>
    </div>
    <!-- End-of favorite -->
    @endsection