@extends('master')

@section('seo_title', __('messages.HELP'))
@section('seo_keywords', '')
@section('seo_description', '')

@section('content')

    @include('layout.breadcrumbs', ['page_title' => __('messages.HELP')])

    <meta name="locale" content="{{ app()->getLocale() }}">

    <!-- Contents -->
    <section class="about-area section-padding-80 {{ @$displayTopBarPromotionBanner ? 'section-padding-180' : '' }}">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="section-heading">
                        <h3>@lang('messages.HELP')</h3>
                    </div>

                    <p>
                        @lang('messages.HELP_INTRO_1')<br>
                        @lang('messages.HELP_INTRO_2')
                    </p>
                    <p align="center">
                        <a href="tel:+351 249 196 600" class="btn btn-sm delicious-btn mr-3 mb-2">
                            <i class="fa fa-phone"> </i> +351 249 196 600
                        </a>
                        <a href="mailto:customer@cosmetic2go.com" class="btn btn-sm delicious-btn mr-3 mb-2">
                            <i class="fa fa-envelope-open"></i>
                            customer@cosmetic2go.com
                        </a>

                        <br>
                        <small>(@lang('messages.PORTUGAL_PHONE_MESSAGE'))</small>
                        <br>
                        <small>(@lang('messages.WORLD_PHONE_MESSAGE'))</small>
                    </p>
                    <br>

                    <div class="row">
                        <div class="col-12 col-md-7 mx-auto">
                            <form action="#" method="post" class="form-sugestoes" id="form-help">
                                <div class="form-row">
                                    <div class="form-group col-md-6">
                                        <input type="text" name="nome" id="nome" class="form-control" required="required"
                                               placeholder="@lang('messages.NAME')*">
                                    </div>
                                    <div class="form-group col-md-6">
                                        <input type="email" name="email" id="email" class="form-control" required="required"
                                               placeholder="@lang('messages.YOUR_EMAIL')*">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <input type="text" name="telefone" id="telefone" class="form-control" required="required"
                                           placeholder="@lang('messages.PHONE')*">
                                </div>
                                <div class="form-group">
                                    <input type="text" name="assunto" id="assunto" class="form-control"
                                           placeholder="@lang('messages.SUBJECT')">
                                </div>
                                <div class="form-group">
                                    <textarea name="mensagem" id="mensagem" cols="30" rows="5" class="form-control"
                                              placeholder="@lang('messages.MESSAGE')*" required="required"></textarea>
                                </div>
                                <div class="form-group">
                                    <script async="" src="https://www.google.com/recaptcha/api.js"></script>
                                    <div class="g-recaptcha" data-sitekey="6Le2Id0UAAAAAJiIw7WHtyGKHZEs72r3Nc405Q1Y"></div>
                                </div>
                                <div class="form-group clearfix">
                                    <button type="submit" class="delicious-btn float-right">
                                        @lang('messages.SEND')
                                    </button>
                                </div>
                            </form>
                            <div class="message-help"></div>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </section>

@endsection