@extends('layout.site')
@section('title', __('structure.contact').' - ')
@section('canonical', url('/contato'))

@section('content')
    <div class="section-internal">
        <div class="breadcrumbs"
             style="background-image: url('{{ base_url('assets/site/img/slide/'.$content_text->header) }}'); background-position: center;">
            <div class="container py-5 px-2 breadcrumb">
                <div class="breadcrumb-item"></div>
            </div>
        </div>

        <div class="content page-contact">
            <div class="container-fluid">
                <div class="row justify-content-center">
                    <div class="col-lg-5 ps-lg-5 pe-lg-0 bg-grey-1">
                        <div class="py-4 ps-lg-5">
                            <div class="section-title mt-4">{!!  __('structure.contact-us') !!}</div>
                            <div class="mt-5">
                                <div>
                                    <div class="text-uppercase">{!! __('structure.phone') !!}</div>
                                    <div class="fs-20 lh-sm">+55 (45) 2102-5000</div>
                                    <div class="fs-18 lh-sm"><a
                                            href="https://api.whatsapp.com/send?phone=5545999040021&text="
                                            target="_blank">{!! __('structure.contact-us-whatsapp') !!}</a></div>
                                </div>
                                <div class="mt-4">
                                    <div class="text-uppercase">E-mail</div>
                                    <div class="fs-20 lh-sm"><a href="mailto:reservas@hotelcontinental.rs">reservas@hotelcontinental.rs</a>
                                    </div>
                                </div>
                                <div class="my-4">
                                    <div class="text-uppercase">{!! __('structure.address') !!}</div>
                                    <div class="fs-20 lh-sm">
                                        Av. Paraná, 1089 - Centro<br>
                                        Foz do Iguaçu - PR, 85852-000
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-7 px-0">
                        <div id="map_canvas"></div>
                    </div>
                </div>

                <form action="" id="contatoform">
                    @csrf
                    <div class="row justify-content-center py-5">
                        <div class="col-lg-6 text-center">
                            <div class="section-title">{!!  __('structure.send-a-message') !!}</div>
                            <div class="row mt-4">
                                <div class="col-lg-6 mt-3">
                                    <input type="text" name="name" id="name" placeholder="{!! __('structure.name') !!}"
                                           class="form-control" required>
                                </div>
                                <div class="col-lg-6 mt-3">
                                    <input type="email" name="email" id="email" placeholder="E-mail" class="form-control" required>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-6 mt-3">
                                    <input type="text" name="phone" id="phone" placeholder="{!! __('structure.phone') !!}"
                                           class="form-control">
                                </div>
                                <div class="col-lg-6 mt-3">
                                    <input type="text" name="whats" id="whats" placeholder="WhatsApp" class="form-control">
                                </div>
                            </div>
                            <div class="row ">
                                <div class="col-lg-12 mt-3">
                                <textarea name="message" id="message" rows="4" placeholder="{!! __('structure.message') !!}"
                                          class="form-control"></textarea>
                                </div>
                            </div>

                            <div class="alert return alert-success mt-4" style="display: none">

                            </div>

                            <div class="row  mb-4 justify-content-center">
                                <div class="col-lg-4 mt-3">
                                    <input type="button" value="{!! __('structure.send-message') !!}" class="btn  btn-send-contact  py-3 btn-success w-100">
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

    </div>
@endsection

@section('script')
<script src='https://api.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.js'></script>
<link href='https://api.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.css' rel='stylesheet' />
    <script src="{{ asset('assets/site/js/maps.js') }}"></script>
@endsection