@extends('layouts.app')

@section('styles')

@endsection

@section('title', __('global.meta_title'))
@section('description', __('global.meta_description'))
@section('keywords', __('global.meta_keywords'))

@section('content')
<header class="page-header">
    <div class="video-bg">
        <video src="{{ asset('assets/frontend/videos/contact.mp4') }}" muted loop autoplay></video>
    </div>

    <div class="container">
        <h1 class="mb-5">{{ __('global.contact_us') }}</h1>
        <p>{{ __('global.for_latest_updates_sub') }}</p>
    </div>

    <aside class="left-side">
        <ul class="d-flex flex-column">
            <li class="my-2"><a href="https://www.facebook.com/Sprenty" target="_blank"><i class="fa fa-facebook-square"></i></a></li>
            <li class="my-2"><a href="https://www.instagram.com/sprenty.ge/" target="_blank"><i class="fa fa-instagram"></i></a></li>
            <li class="my-2"><a href="https://www.linkedin.com/company/sprenty/" target="_blank"><i class="fa fa-linkedin"></i></a></li>
            <li class="my-2">
				<a href="https://www.tiktok.com/@sprenty.com" target="_blank">
					<svg xmlns="http://www.w3.org/2000/svg" fill="#ffffff" width="20" height="20" viewBox="0 0 512 512" id="icons"><path d="M412.19,118.66a109.27,109.27,0,0,1-9.45-5.5,132.87,132.87,0,0,1-24.27-20.62c-18.1-20.71-24.86-41.72-27.35-56.43h.1C349.14,23.9,350,16,350.13,16H267.69V334.78c0,4.28,0,8.51-.18,12.69,0,.52-.05,1-.08,1.56,0,.23,0,.47-.05.71,0,.06,0,.12,0,.18a70,70,0,0,1-35.22,55.56,68.8,68.8,0,0,1-34.11,9c-38.41,0-69.54-31.32-69.54-70s31.13-70,69.54-70a68.9,68.9,0,0,1,21.41,3.39l.1-83.94a153.14,153.14,0,0,0-118,34.52,161.79,161.79,0,0,0-35.3,43.53c-3.48,6-16.61,30.11-18.2,69.24-1,22.21,5.67,45.22,8.85,54.73v.2c2,5.6,9.75,24.71,22.38,40.82A167.53,167.53,0,0,0,115,470.66v-.2l.2.2C155.11,497.78,199.36,496,199.36,496c7.66-.31,33.32,0,62.46-13.81,32.32-15.31,50.72-38.12,50.72-38.12a158.46,158.46,0,0,0,27.64-45.93c7.46-19.61,9.95-43.13,9.95-52.53V176.49c1,.6,14.32,9.41,14.32,9.41s19.19,12.3,49.13,20.31c21.48,5.7,50.42,6.9,50.42,6.9V131.27C453.86,132.37,433.27,129.17,412.19,118.66Z"/></svg>
				</a>
			</li>
        </ul>
    </aside>

    <div class="scroll-down"><small>{{ __('global.scroll_down') }}</small><span></span></div>
</header>

<section class="hello">
    <div class="container">
        <div class="row">
            <div class="col-12 wow fadeIn">
                <h6>{{ __('global.fully_responsive_support') }}</h6>
                <h2 data-text="Hellow">{{ __('global.help_us_to_respond_you_quickly') }}</h2>
            </div>
            <div class="col-md-4 wow fadeIn">
                <address>
                    <b>{{ __('global.address') }}</b>
                    <p>{{ __('global.tbilisi_georgia') }}</p>
                </address>
            </div>

            <div class="col-md-4 wow fadeIn" data-wow-delay="0.05s">
                <address>
                    <b>{{ __('global.phone') }}</b>
                    <a href="tel:0 32 2 11 22 01">0 32 2 11 22 01</a>
                </address>
            </div>

            <div class="col-md-4 wow fadeIn" data-wow-delay="0.10s">
                <address>
                    <b>{{ __('global.support') }}</b>
                    <a href="mailto:info@sprenty.com">info@sprenty.com</a>
                </address>
            </div>
        </div>

        <div class="row align-items-center">
            <div class="col-lg-6 wow fadeIn order-lg-2" data-wow-delay="0.05s">
                <form action="{{ route('contact.store') }}" class="row inner mb-5" id="contact" name="contact" method="post">
                    @csrf
                    <div class="form-group col-sm-6 col-12">
                        <label><span>{{ __('global.your_full_name') }}</span></label>
                        <input type="text" name="full_name" required>

                        @error('full_name')
                            <span class="invalid-feedback d-block" role="alert">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>

                    <div class="form-group col-sm-6 col-12">
                        <label><span>{{ __('global.your_phone') }}</span></label>
                        <input type="text" name="phone" id="surname" required>

                        @error('phone')
                            <span class="invalid-feedback d-block" role="alert">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>
                    
                    <div class="form-group col-sm-6 col-12">
                        <label><span>{{ __('global.your_email') }}</span></label>
                        <input type="text" name="email" id="email" required>

                        @error('email')
                            <span class="invalid-feedback d-block" role="alert">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>

                    <div class="form-group col-sm-6 col-12">
                        <label><span>{{ __('global.subject') }}</span></label>
                        <input type="text" name="subject" id="subject" required>

                        @error('subject')
                            <span class="invalid-feedback d-block" role="alert">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>

                    <div class="form-group col-12">
                        <label><span>{{ __('global.your_message') }}</span></label>
                        <textarea name="message" id="message" required></textarea>

                        @error('message')
                            <span class="invalid-feedback d-block" role="alert">
                                {{ $message }}
                            </span>
                        @enderror
                    </div>

                    <div class="form-group col-12">
                        <button class="custom-button-submit" id="submit" type="submit" name="submit">
                            <span class="mb-5">{{ __('global.submit') }}</span>
                        </button>
                    </div>
                </form>
            </div>

            <div class="col-lg-6 wow fadeIn order-lg-1">
                <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d640744.0368761622!2d44.94966478913433!3d41.75343252636231!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x40440cd7e64f626b%3A0x61d084ede2576ea3!2z4YOX4YOR4YOY4YOa4YOY4YOh4YOY!5e0!3m2!1ska!2sge!4v1707471898517!5m2!1ska!2sge" width="100%" height="640" frameborder="0" style="border:0" allowfullscreen></iframe>
            </div>
        </div>
    </div>
</section>
@endsection

@section('scripts')
	
@endsection