@extends('frontend.layouts.app')
@section('title-suffix')
    {{ __('contact.title') }}
@endsection
@section('main-content')
    <section class="breadcrumb breadcrumb_bg">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-8">
                    <div class="breadcrumb_iner">
                        <div class="breadcrumb_iner_item">
                            <h2>{{ __('contact.title') }}</h2>
                            <p>{{ __('contact.breadcrumb-1') }}<span>></span>{{ __('contact.breadcrumb-2') }}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>


    <section class="contact-section padding_top">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <h2 class="contact-title">{{ __('contact.body-title-1') }}</h2>
                </div>
                <div class="col-12">
                    <div class="d-sm-block mb-5 pb-4">
                        <iframe
                            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3966.4492536732996!2d1.179620175823558!3d6.204316726788475!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x102159b5e1a614f1%3A0xc4eed47a01c32894!2sRa&#39;am%20Shop!5e0!3m2!1sfr!2stg!4v1710944830727!5m2!1sfr!2stg"
                            class="col-12" height="450" style="border:0;" allowfullscreen="" loading="lazy"
                            referrerpolicy="no-referrer-when-downgrade">
                        </iframe>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-12">
                    <h2 class="contact-title">{{ __('contact.body-title-2') }}</h2>
                </div>
                <div class="col-lg-8">
                    <div class="card shadow">
                        <div class="card-block pad-contact">
                            <form class="form-contact contact_form contactForm" action="{{ route('message.send') }}" method="post"
                                id="contactForm" novalidate="novalidate">
                                @csrf
                                <div class="row" style="margin-top: 30px;">
                                    <div class="col-sm-6">
                                        <div class="form-group">
                                            <input class="form-control" name="name" id="name" type="text" placeholder='{{ __('contact.placeholder-name') }}'>
                                        </div>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="form-group">
                                            <input class="form-control" name="email" id="email" type="email" placeholder = '{{ __('contact.placeholder-email') }}'>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="form-group">
                                            <input class="form-control" name="subject" id="subject" type="text" placeholder='{{ __('contact.placeholder-subject') }}'>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="form-group">
                                            <textarea class="form-control w-100" name="message" id="message" cols="30" rows="9"
                                                placeholder='{{ __('contact.placeholder-message') }}'></textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group mt-3">
                                    <a href="#" class="btn_3 button-contactForm"
                                        onclick="document.getElementById('contactForm').submit();">{{ __('contact.submit-btn') }}</a>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4">
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-home"></i></span>
                        <div class="media-body">
                            <h3>{{ $company->address }}</h3>
                            <p>Lomé, Togo</p>
                        </div>
                    </div>
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-tablet"></i></span>
                        <div class="media-body">
                            <h3><a href="tel:{{ $company->phone1 }}">{{ $company->phone1 }}</a></h3>
                            <p>{{ __('contact.schedule') }}</p>
                        </div>
                    </div>
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-email"></i></span>
                        <div class="media-body">
                            <h3>
                                <a
                                    href="mailto:{{ $company->email1 }}?subject=En%20savoir%20plus">{{ $company->email1 }}</a>
                            </h3>
                            <p>{{ __('contact.lively') }}</p>
                        </div>
                    </div>
                </div>
                <div class="col-12 mb-4"></div>
            </div>
        </div>
    </section>
@endsection