@extends('site.layouts.master')

@section('seoTags')
  @seoTags()
@endsection
@section('title')
<title>@lang('site.Contact_Us')</title>
@endsection
    @php
        $seo = SEO\Models\Page::where('path',URL::full())->first();
    @endphp
@section('metatags')
 @if(!empty($seo))
    <meta name="title" content="{{ $seo->meta_title ?? $seo->title }}">
    <meta name="keywords" content="{{ $seo->meta_keywords }}">
 <meta name="description" content="{{ $seo->description }}">
 @endif
 <link rel="canonical" href="{{str_replace('public/','',url()->current())}}">
<link rel="alternate" hreflang="@if(app()->getLocale() == 'ar'){{'en'}}@else{{'ar'}}@endif"
href="@if(app()->getLocale() == 'en' && str_contains(url()->current(),'/en/')){{str_replace('/en/','/ar/',str_replace('public/','',url()->current()))}}@else{{str_replace('/ar/','/en/',str_replace('public/','',url()->current()))}}@endif">
<link rel="alternate" hreflang="@if(app()->getLocale() == 'ar'){{'ar'}} @else{{'en'}}@endif" href="{{str_replace('public/','',url()->current())}}">
@endsection
@section('content')
<div class="d-none">
    {{ Breadcrumbs::render('Contact Us') }}
</div>
{!! $breadcrumbSchema !!}
    <div class="py-3 bg-f9f9f9">
        <div class="customWidth">
            <div class="contactMain rounded-3 text-center py-2 px-3 d-flex align-items-center">
                <div class="w-100">
                    <h1 class="mb-3 SF40_48Bold SF78_93Medium-lg text-white">@lang('site.Contact_Us')</h1>
                    <p class="mb-0 SF12_14Light SF18_21Light-lg text-white">@lang("site.Let's talk about your preferences")</p>
                </div>
            </div>
            <div class="d-lg-flex justify-content-between pt-4 pb-2">
                <div class="col-lg-6 px-4 @if (app()->getLocale() == 'ar') border-start @else border-end @endif">
                    <p class="SF28_34Medium SF40_48Medium-lg text-3b3b3b my-3">@lang('site.Get in touch')</p>
                    <div class="d-flex justify-content-center justify-content-lg-start align-items-center">
                        <p type="button"
                            class="SF18_21SemiBold SF22_26SemiBold-lg text-center text-red col-6 col-lg-4 px-2 py-3 rounded-2 bg-f1f1f1"
                            id="tab_message">@lang('site.Send a message')
                        </p>
                        <p type="button"
                            class="SF18_21SemiBold SF22_26SemiBold-lg text-center text-707070 col-6 col-lg-4 px-2 py-3 rounded-2"
                            id="tab_complaint">@lang('site.Send a complaint')</p>
                    </div>
                    <div id="content_message">
                        <p class="SF16_19Regular SF20_24Regular-lg text-9b9b9b">@lang('site.For any inquiries, or just to say hello, get in touch and contact us.')</p>
                        @if(isset($y))
                        <div class="alert alert-danger text-center showValidationErrors">
                            {{ $y }}
                        </div>
                        @endif
                        <form method="post" action="{{ route('site.contactMessage') }}" enctype="multipart/form-data"
                            class="submitFormData">
                            @csrf
                            <div class="row">
                                <input type="hidden" id="gtoken" name="gToken">
                                <div class="form-group my-2">
                                    <input type="text" name="name"
                                        class="form-control py-2 bg-transparent profilePlaceholder text-3b3b3b"
                                        placeholder="@lang('site.Full_Name')"
                                        value="{{old('name')}}">
                                </div>
                                <div class="form-group my-2">
                                    <input type="text" name="email"
                                        class="form-control py-2 bg-transparent profilePlaceholder text-3b3b3b"
                                        placeholder="@lang('site.Email_Address')"
                                        value="{{old('email')}}">
                                </div>
                                <div class="form-group my-2">
                                    <input type="text" name="number"
                                        class="form-control py-2 bg-transparent profilePlaceholder text-3b3b3b"
                                        placeholder="@lang('hr.Mobile_Number')"
                                        value="{{old('number')}}">
                                </div>
                                <div class="form-group my-2">
                                    <select name="subject_id"
                                        class="SF16_19Regular text-3b3b3b w-100 px-2 py-2 rounded border-d1d1d1"
                                        style="outline: none">
                                        @foreach ($subjects as $subject)
                                            <option 
                                                value="{{ $subject->id }}" 
                                                {{ old('subject_id') == $subject->id ? 'selected' : '' }}
                                            >
                                                {{ $subject->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group my-2">
                                    <textarea class="form-control profilePlaceholder" name="message" rows="7" placeholder="@lang('site.Write_message')">{{old('message')}}</textarea>
                                </div>
                                @foreach ($errors->all() as $error)
                                    <p class="d-block text-danger">{{ $error }}</p>
                                @endforeach
                                <div>
                                    <a onclick="Captcha('gtoken')"
                                        class="btn bg-red text-white SF18_21Bold w-100 py-2 px-3 my-3">@lang('site.Send_Massage')</a>
                                    <button hidden type="submit" id="doSubmitWithCaptchagtoken"></button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div id="content_complaint" class="d-none">
                        @if(isset($y))
                        <div class="alert alert-danger text-center showValidationErrors2">
                            {{ $y }}
                        </div>
                        @endif
                        <form method="post" enctype="multipart/form-data" action="{{ route('site.complaint') }}"
                            class="submitFormData2">
                            @csrf
                            <div class="row">
                                <input type="hidden" id="gtok" name="gToken">
                                <div class="form-group">
                                    <input hidden type="text" name="type" class="form-control" value="General">
                                </div>
                                <div class="form-group my-2">
                                    <input placeholder="@lang('site.Full_Name')" type="text" name="name"
                                        class="form-control profilePlaceholder" value="{{ old('name') }}">
                                </div>
                                <div class="form-group my-2">
                                    <input placeholder="@lang('hr.Mobile_Number')" type="text" name="mobile"
                                        class="form-control profilePlaceholder" value="{{ old('mobile') }}">
                                </div>
                                <div class="form-group my-2">
                                    <textarea rows="8" class="form-control profilePlaceholder" name="message" placeholder="@lang('site.tell_us2')">{{ old('message') }}</textarea>
                                </div>
                                @foreach ($errors->complaint->all() as $error)
                                    <p class="d-block text-danger">{{ $error }}</p>
                                @endforeach
                                <div>
                                    <a onclick="Captcha('gtok')"
                                        class="btn bg-red text-white SF18_21Bold w-100 py-2 px-3 my-3">@lang('site.Send')</a>
                                    <button hidden type="submit" id="doSubmitWithCaptchagtok"></button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-lg-6 px-4">
                    <p class="SF40_48Medium my-3 text-3b3b3b">@lang('site.Find us')</p>
                    @foreach ($branches as $branch)
                        <div>
                            <p class="tab_font SF22_26SemiBold-lg text-3b3b3b text-uppercase my-3">{{ $branch->name }}</p>
                            <div class="d-flex align-items-center">
                                <img loading="lazy" src="{{ asset('new_theme/marker.svg') }}" alt="marker"
                                    class="p-2 rounded-circle bg-light-blue">
                                <p class="my-0 text-decoration-underline SF18_21Regular SF20_24Regular-lg text-707070 mx-2">
                                    {{ $branch->address }}
                                </p>
                            </div>
                            <div class="d-flex align-items-center my-3">
                                <i class="fa-solid fa-phone-volume p-2 rounded-circle bg-light-blue text-blue"></i>
                                <p class="my-0 text-decoration-underline SF18_21Regular SF20_24Regular-lg text-707070 mx-2">
                                    {{ $branch->phone }}</p>
                            </div>
                            <div class="d-flex align-items-center my-3">
                                <i class="fa-regular fa-envelope p-2 rounded-circle bg-light-blue text-blue"></i>
                                <p class="my-0 text-decoration-underline SF18_21Regular SF20_24Regular-lg text-707070 mx-2">
                                    {{ $branch->email }}</p>
                            </div>
                        </div>
                        @if ($loop->iteration == 1)
                            <div class="line my-4 my-lg-5"></div>
                        @endif
                    @endforeach
                    <div class="line my-4 my-lg-5"></div>
                    <p class="tab_font text-3b3b3b text-uppercase my-3">@lang('site.Social Media')</p>
                    <div class="d-flex justify-content-between col-8 col-lg-4 pb-5">
                        <a href="https://www.facebook.com/nileestatere/" class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i
                                class="fa-brands fa-2x fa-facebook"></i></a>
                        <a href="https://www.instagram.com/nileestatere" class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i
                                class="fa-brands fa-2x fa-instagram"></i></a>
                        <a href="https://www.linkedin.com/company/nileestatere" class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i
                                class="fa-brands fa-2x fa-linkedin"></i></a>
                        <a href="https://www.pinterest.com/nileestatere" class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i class="fa-brands fa-2x fa-pinterest"></i></a>
                        <a href="https://www.youtube.com/@nileestatere"
                            class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i class="fa-brands fa-2x fa-youtube"></i></a>
                        <a href="https://x.com/nileestatere" 
                            class="text-decoration-none text-707070 @if(app()->getLocale() == 'ar') ms-4 @else me-4 @endif"><i class="fa-brands fa-2x fa-x-twitter"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script>
        $('[id^=tab_]').click(function() {
            $('[id^=tab_]').removeClass('bg-f1f1f1 text-red');
            $('[id^=tab_]').addClass('text-707070');
            $(this).removeClass('text-707070');
            $(this).addClass('bg-f1f1f1 text-red');
            id = $(this).attr('id');
            text = id.replace('tab', 'content');
            $('[id^=content_]').addClass('d-none');
            $('[id=' + text + ']').removeClass('d-none');

        });
        // $('#tab_complaint').click(function(){
        //     $('[id^=tab_]').addClass('d-none');
        //     $(this).removeClass('d-none');

        // });
    </script>
@endsection