@extends('public.core.core')
@section('title')
    Anasayfa
@endsection
@section('csrf_token')
    <meta name="csrf-token" content="{{ csrf_token() }}">
@endsection
@section('content')
    <!--====== HERO PART START ======-->
    <section id="home" class="hero-area bg_cover">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-lg-7 col-xl-6 col-md-10">
                    <div class="text-center hero-content">
                        <h1 class="mb-30 wow fadeInUp" data-wow-delay=".2s"> Projeleriniz İçin En İyi Teklifi Bulun</h1>
                        <p class="wow fadeInUp" data-wow-delay=".4s">Dekorasyon ve tasarım projeleriniz için doğru teklifi
                            arıyorsanız, Dekorist İstanbul doğru adresiniz. İhtiyacınızı yayınlayın, alanında uzman
                            firmalardan gelen teklifleri karşılaştırın ve projeniz için en uygun çözümü seçin.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--====== HERO PART END ======-->
    <!--====== SEARCH PART START ======-->
    <div class="search-area">
        <div class="container">
            <div class="search-wrapper">
                <form action="{{ route('search') }}" method="GET">
                    <div class="row justify-content-center">
                        <div class="col-lg-3 col-sm-5 col-10">
                            <div class="search-input">
                                <label for="keyword"><i class="lni lni-search-alt theme-color"></i></label>
                                <input type="text" name="keyword" id="keyword" placeholder="Ürün anahtar kelimesi">
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-5 col-10">
                            <div class="search-input">
                                <label for="category"><i class="lni lni-grid-alt theme-color"></i></label>
                                <select name="cat_id" id="category">
                                    @foreach ($categories as $category)
                                        <option value="{{ $category->id }}">{{ $category->title }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-5 col-10">
                            <div class="search-input">
                                <label for="location"><i class="lni lni-map-marker theme-color"></i></label>
                                <select name="city" id="location">
                                    @foreach ($cities as $city)
                                        <option value="{{ $city }}">{{ $city }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-2 col-sm-5 col-10">
                            <div class="search-btn">
                                <button type="submit" class="main-btn btn-hover">Ara <i
                                        class="lni lni-search-alt"></i></button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!--====== SEARCH PART END ======-->
    <!--====== TESTIMONIAL PART START ======-->
    <section class="testimonial-area pt-40 pb-40">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-xl-6 col-lg-7 col-md-10">
                    <div class="text-center section-title mb-60">
                        <h2>Öne Çıkan Firmalar</h2>
                        <p>Öne çıkan firmalar listesinden ihtiyacınıza uygun firma ile iletişime geçebilirsiniz.</p>
                    </div>
                </div>
            </div>

            <div class="testimonial-wrapper">
                <div class="row testimonial-carousel" id="companies_list">
                    @foreach ($advices as $company)
                        <div class="col-lg-4">
                            <div class="single-testimonial">
                                <div class="testimonial-top">
                                    <div class="testimonial-info">
                                        <div class="image">
                                            <img src="/storage/site/{{ $company->image }}" style="border-radius:12px"
                                                alt="{{ $company->company_name }} Şirket Logosu">
                                        </div>
                                        <div class="meta">
                                            <h6>{{ $company->fname . ' ' . $company->lname }}</h6>
                                            <p>{{ $company->company_name }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="content">
                                    <p>{{ $company->description }}</p>
                                </div>
                                <div class="text-right mt-4">
                                    <a href="javascript:void(0)" itemid="{{ $company->user_id }}"
                                        id="{{ $company->user_id }}" class="fw-bold" style="color:#FF6B6B"><i
                                            class="lni lni-angle-double-right"></i> Detay</a>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </section>

    <!--====== TESTIMONIAL PART ENDS ======-->


    <!--====== LATEST PRODUCT PART START ======-->
    <section class="latest-product-area pt-0 pb-40">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-xl-6 col-lg-7 col-md-10">
                    <div class="text-center section-title mb-60">
                        <h2>İlanlar</h2>
                    </div>
                </div>
            </div>

            <div class="row">
                @foreach ($ads as $ad)
                    <div class="col-xl-4 col-lg-6 col-md-6">
                        <div class="single-product">
                            <div class="product-img">
                                <a href="{{ route('detail', ['number' => $ad->ad_number, 'slug' => $ad->slug]) }}">
                                    <img src="/storage/ad_img/{{ $ad->ad_number }}/{{ $ad->adImages->random()->path }}"
                                        alt="{{ $ad->title }} İlan Fotoğrafı">
                                </a>
                            </div>
                            <div class="product-content">
                                <h3 class="name"><a
                                        href="{{ route('detail', ['number' => $ad->ad_number, 'slug' => $ad->slug]) }}">{{ $ad->title }}</a>
                                </h3>
                                <span class="update">Son Güncelleme:
                                    {{ date('d-m-Y', strtotime($ad->updated_at)) }}</span>
                                <ul class="address">
                                    <li>
                                        <a href="javascript:void(0)"><i class="lni lni-calendar"></i>
                                            {{ date('d-m-Y', strtotime($ad->created_at)) }}</a>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)"><i class="lni lni-map-marker"></i>
                                            {{ $ad->city }}</a>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)"><i class="lni lni-user"></i>
                                            {{ $ad->user->fname }}</a>
                                    </li>
                                    <li>
                                        <a href="{{ route('category', ['slug' => $ad->category->slug]) }}"><i
                                                class="lni lni-package"> </i>
                                            {{ Str::limit($ad->category->title, 18, '...') }}</a>
                                    </li>
                                </ul>
                                <div class="product-bottom">
                                    <h3 class="price">@if($ad->price != "0"){{ number_format($ad->price, 2, ',', '.') }} ₺ @else Belirtilmedi @endif </h3>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
                <div class="col-12 text-center">
                    <a href="{{ route('all') }}" class="main-btn btn-hover">Tümünü Gör</a>
                </div>
            </div>
        </div>
    </section>
    <!--====== LATEST PRODUCT PART ENDS ======-->

    <!--====== VIDEO PART START ======-->
    <section class="video-area">
        <div class="video-wrapper img-bg">
            <div class="container">
                <div class="text-center video-content">
                    <h1 class="text-white mb-30">Dekoristbul sayesinde tek tıkla işlerinizi çözün</h1>
                    <a style="display: none" href="#" class="glightbox video-btn"><i class="lni lni-play"></i></a>
                </div>
            </div>
        </div>

        <div class="container" style="display: none">
            <div class="count-up-wrapper">
                <div class="row">

                    <div class="col-lg-3 col-sm-6">
                        <div class="single-counter">
                            <div class="icon">
                                <i class="lni lni-layers"></i>
                            </div>
                            <span class="count">34864</span>
                            <span>Regular Ads</span>
                        </div>
                    </div>

                    <div class="col-lg-3 col-sm-6">
                        <div class="single-counter">
                            <div class="icon">
                                <i class="lni lni-map-marker"></i>
                            </div>
                            <span class="count">867</span>
                            <span>Locations</span>
                        </div>
                    </div>

                    <div class="col-lg-3 col-sm-6">
                        <div class="single-counter">
                            <div class="icon">
                                <i class="lni lni-users"></i>
                            </div>
                            <span class="count">56743</span>
                            <span>Regular Members</span>
                        </div>
                    </div>

                    <div class="col-lg-3 col-sm-6">
                        <div class="single-counter">
                            <div class="icon">
                                <i class="lni lni-briefcase"></i>
                            </div>
                            <span class="count">4583</span>
                            <span>Premium Ads</span>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section>
    <!--====== VIDEO PART ENDS ======-->

    <!--====== SERVICE PART START ======-->
    <section class="service-area pt-140 pb-110">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-xl-6 col-lg-7 col-md-10">
                    <div class="text-center section-title mb-60">
                        <h1>Neden Bizi Seçmelisiniz</h1>
                        <p>İhtiyaçlarınızı , sektördeki en yenilikçi ve işlevsel çözümlerle destekleyerek hayalinizdeki
                            tasarımları gerçeğe dönüştürmenize yardımcı oluyoruz.</p>
                    </div>
                </div>
            </div>
            <div class="row justify-content-center">
                @foreach ($banners as $banner)
                    <div class="col-lg-4 col-md-6 col-sm-8 col-11">
                        <div class="single-service">
                            <div class="icon">
                                {!! $banner->icon !!}
                            </div>
                            <div class="service-content">
                                <h3>{{$banner->title}}</h3>
                                <p>{{$banner->description}}</p>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </section>

    <!--====== SERVICE PART ENDS ======-->
    <!--====== FEATURE PRODUCT PART START ======-->
    <section class="feature-product-area bg_cover">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-lg-6 col-md-10">
                    <div class="text-center section-title mb-60">
                        <h1>En Çok Görüntülenenler</h1>
                    </div>
                </div>
            </div>
            <div class="product-carousel-wrapper">
                <div class="row feature-product-carousel">
                    @foreach ($ads_for_populars as $ad)
                        <div class="col-lg-4 col-md-6">
                            <div class="single-product">
                                <div class="product-img">
                                    <a href="{{ route('detail', ['number' => $ad->ad_number, 'slug' => $ad->slug]) }}"><img
                                            src="/storage/ad_img/{{ $ad->ad_number }}/{{ $ad->adImages->random()->path }}"
                                            alt="{{ $ad->title }} İlan Fotoğrafı"></a>
                                </div>

                                <div class="product-content">
                                    <div class="rating-wrapper">
                                        <h6 class="price theme-color">@if($ad->price != "0"){{ number_format($ad->price, 2, ',', '.') }} ₺ @else Belirtilmedi @endif</h6>
                                    </div>
                                    <h3 class="name"><a
                                            href="{{ route('detail', ['number' => $ad->ad_number, 'slug' => $ad->slug]) }}">{{ $ad->category->title }}</a>
                                    </h3>
                                    <p class="sort-des">{{ $ad->title }}
                                    </p>
                                    <div class="product-bottom">
                                        <a href="javascript:void(0)" class="address-link"><i
                                                class="lni lni-map-marker"></i> {{ $ad->city }}</a>

                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>
            </div>
        </div>
    </section>
    <!--====== FEATURE PRODUCT PART ENDS ======-->

    <!--====== SUBSCRIBE PRODUCT PART START ======-->
    <section class="subscribe-area">
        <div class="container">
            <div class="subscribe-wrapper bg_cover">
                <div class="row align-items-center">
                    <div class="col-lg-7">
                        <div class="subscribe-content section-title">
                            <h1 class="text-white">Bültenimize Abone Olun</h1>
                            <p class="text-white">Size özel hazıraldığımız farklı sektörlerle alakalı bültenimize abone
                                olun
                            </p>
                        </div>
                    </div>
                    <div class="col-lg-5">
                        <div class="subscribe-form-wrapper">
                            <form action="#" class="subscribe-form">
                                <input type="email" name="email" id="sub-email-input"
                                    placeholder="Mail Adresinizi Giriniz">
                                <button type="button" id="sub-email-button"><i
                                        class="lni lni-telegram-original"></i></button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--====== SUBSCRIBE PRODUCT PART ENDS ======-->
    <div class="modal fade" id="offerModal" tabindex="-1" aria-labelledby="offerModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title fs-5 mx-auto" id="offerModalLabel">Firma Kartı</h3>
                    <button type="button" data-bs-dismiss="modal" aria-label="Close"><i
                            class="lni lni-close"></i></button>
                </div>
                <div class="modal-body pb-0">
                    <div class="mb-5">
                        <div class="single-testimonial">
                            <div class="testimonial-top">
                                <div class="testimonial-info">
                                    <div class="image w-100" style="text-align: center;">
                                        <img id="company_image"
                                            style="width: 120px; border-radius: 24px; display: inline-block;"
                                            src="" alt="Ahmet Altaş Şirket Logosu">
                                    </div>
                                    <div class="meta text-center">
                                        <h6 id="company_full_name"></h6>
                                        <p id="company_name"></p>
                                    </div>
                                </div>
                            </div>
                            <div class="content mt-4 text-center">
                                <p id="company_content">
                                </p>
                            </div>
                            <div class="row px-5 mt-4">
                                @auth
                                    @if (Auth()->User()->role == 'personal')
                                        <div class="col-6">
                                            <div class="text-start">
                                                <a href="" id="company_phone"
                                                    class="status-btn btn-warning text-white p-2 px-3"
                                                    style="font-size: 14px;border-radius:30px"><i class="bi bi-send"></i>
                                                    Mesaj</a>
                                            </div>
                                        </div>
                                        <div class="col-6">
                                            <div class="text-right">
                                                <a href="" id="company_phone" class="main-btn p-2 px-5"
                                                    style="font-size: 14px"><i class="lni lni-phone"></i> Ara</a>
                                            </div>
                                        </div>
                                    @else
                                        <div class="col-12">
                                            <div class="text-right">
                                                <a href="" id="company_phone" class="main-btn p-2 px-5 w-100"
                                                    style="font-size: 14px"><i class="lni lni-phone"></i> Ara</a>
                                            </div>
                                        </div>
                                    @endif
                                @else
                                    <div class="col-12">
                                        <div class="text-right">
                                            <a href="" id="company_phone" class="main-btn p-2 px-5 w-100"
                                                style="font-size: 14px"><i class="lni lni-phone"></i> Ara</a>
                                        </div>
                                    </div>
                                @endauth
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('extra_js')
    <script src="/assets/js/subscribe.js"></script>
    <script src="/assets/js/index.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
        integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous">
    </script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
        integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy" crossorigin="anonymous">
    </script>
@endsection