@extends('layouts.public')

@section('title') {{trans('seo.title.contact')}} @endsection
@section('description')  @endsection

@section('content')
<section class="morepage-banner-wrapper contact">
	<div class="container">
		<div class="morepage-banner">
			<div class="group-icons"><i class="icons flaticon-anchor-1"></i></div>
			<h2 class="title">Kontakt</h2>
			<ol class="breadcrumb">
				<li><a href="{{route('public.index')}}" class="link">Naslovna</a></li>
				<li class="active"><a href="#" class="link">Kontakt</a></li>
			</ol>
		</div>
	</div>
</section>
<section class="page-main padding-top-100 padding-bottom-100">
	<div class="container">
		<div class="main-content">
			<div class="row contact-info">
				<div class="col-sm-3 col-xs-12">
					<div class="contact-info-item"><i class="icons fa fa-map-marker "></i>
						<p class="title">Adresa</p>
						<p class="text">Ulica uvala Vira 5, 21450 Hvar</p>
					</div>
				</div>
				<div class="col-sm-3 col-xs-12">
					<div class="contact-info-item"><i class="icons fa fa-envelope"></i>
						<p class="title">Email</p>
						<p class="">info@zuvela.hr</p>
					</div>
				</div>
				<div class="col-sm-3 col-xs-12">
					<div class="contact-info-item"><i class="icons fa fa-id-card-o"></i>
						<p class="title">OIB</p>
						<p class="text">67047530380</p>
					</div>
				</div>
				<div class="col-sm-3 col-xs-12">
					<div class="contact-info-item"><i class="icons fa fa-credit-card"></i>
						<p class="title">IBAN</p>
						<p class="text">HR2924020061100760744</p>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<div class="contact-map">
	<div id="googleMap"></div>
</div>
<section class="contact-form-wrapper padding-top-100 padding-bottom-100">
	<div class="container">
		<div class="main-title-2">
			<div class="icons">//</div>
			<h2 class="title">Pošaljite upit</h2>
		</div>
		<div class="main-content">
			{!! Form::open(['route' => 'public.mail', 'class' => 'contact-form']) !!}
			<div class="row">
				<div class="col-sm-4">
					<div class="form-group">
						{!! Form::text('name', null, ['placeholder' => 'Vaše ime *', 'class' => 'form-control', 'required']) !!}
					</div>
				</div>
				<div class="col-sm-4">
					<div class="form-group">
						{!! Form::email('email', null, ['placeholder' => 'E-mail *', 'class' => 'form-control', 'required']) !!}
					</div>
				</div>
				<div class="col-sm-4">
					<div class="form-group">
						{!! Form::text('phone', null, ['placeholder' => 'Telefon *', 'class' => 'form-control', 'required']) !!}
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-12">
					<div class="form-group">
						{!! Form::textarea('message', null, ['placeholder' => 'Poruka *', 'class' => 'form-control form-textarea', 'required']) !!}
					</div>
				</div>
			</div>
			<br>
			{!! Captcha::display() !!}
			@if($errors->has('g-recaptcha-response'))
			<span class="help-block" style="color: #ed421c">
				<strong>{{ $errors->first('g-recaptcha-response') }}</strong>
			</span>
			@endif
			<br>
			<button type="submit" class="btn btn-maincolor">Pošalji</button>
			{!! Form::close() !!}
		</div>
		<div class="bg-images-pc"><img src="/vendor/images/more-image/chef-4.png" alt="" class="img-responsive"></div>
	</div>
</section>
@endsection

@section('styles')
<style type="text/css">
	.g-recaptcha div {
		margin: 0 auto;
	}
</style>
@endsection

@section('scripts')
{!! Captcha::script() !!}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCRNqNyB3yghl6TCUOTv5guzQoYdslgwqI"></script>
<script src="/vendor/js/pages/contact.js?v=2"></script>
@endsection