@php
    $addr = __('public.contact.office_address');
    $mapsUrl = __('public.contact.maps_url');
    $phone = __('public.contact.office_phone');
    $email = __('public.contact.office_email');
    $telHref = $phone ? 'tel:' . preg_replace('/[^0-9+]/', '', $phone) : '#';
@endphp
@extends('layouts.public')
@section('meta')
    @include('includes.seo-meta', [
        'slug' => 'contact',
        'path' => '/contact',
        'defaults' => [
            'title' => __('public.pages.contact_title'),
            'description' => __('public.contact_subtitle'),
        ],
    ])
    @push('json_ld')
        @include('includes.json-ld-graphs', [
            'graphs' => [
                schema_breadcrumb([
                    ['name' => __('public.breadcrumb.home'), 'url' => schema_absolute_url('/')],
                    ['name' => __('public.breadcrumb.contact'), 'url' => schema_absolute_url('/contact')],
                ]),
            ],
        ])
    @endpush
@endsection
@section('content')
    @include('includes.corano-breadcrumb', [
        'crumbs' => [
            ['label' => __('public.breadcrumb.contact')],
        ],
    ])

    <div class="contact-area section-padding">
        <div class="container">
            <div class="section-title text-center">
                <h1 class="title">{{ __('public.contact.hero_title') }}</h1>
                <p class="sub-title">{{ __('public.contact.hero_intro') }}</p>
            </div>

            <div class="row contact-info-boxes">
                <div class="col-md-4">
                    <div class="contact-info-box">
                        <div class="contact-info-icon"><i class="fas fa-map-marker-alt"></i></div>
                        <h4>{{ __('public.address') }}</h4>
                        <p>{{ __('public.contact.address_description') }}</p>
                        <p class="contact-info-value">{!! nl2br(e($addr)) !!}</p>
                        <a href="{{ $mapsUrl }}" target="_blank" rel="noopener">{{ __('public.contact.open_in_maps') }}</a>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contact-info-box">
                        <div class="contact-info-icon"><i class="fas fa-phone"></i></div>
                        <h4>{{ __('public.phone') }}</h4>
                        <p>{{ __('public.contact.phone_description') }}</p>
                        <p class="contact-info-value"><a href="{{ $telHref }}">{{ $phone }}</a></p>
                        <span>{{ __('public.contact.schedule_label') }} {{ __('public.contact.schedule_hours') }}</span>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contact-info-box">
                        <div class="contact-info-icon"><i class="fas fa-envelope"></i></div>
                        <h4>{{ __('public.email') }}</h4>
                        <p>{{ __('public.contact.email_description') }}</p>
                        <p class="contact-info-value"><a href="mailto:{{ $email }}">{{ $email }}</a></p>
                        <a href="mailto:{{ $email }}">{{ __('public.contact.email_us') }}</a>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-6">
                    <div class="contact-message">
                        <h4 class="contact-title">{{ __('public.contact.form_title') }}</h4>
                        <p>{{ __('public.contact.form_intro') }}</p>
                        <form class="contact-form r-form" method="post" action="{{ __url('/contact') }}" id="contact-form" data-action="onContactForm" data-r-form-success="hide" data-success-message="{{ __('public.contact_success') }}">
                            <div class="js-r-form-fields">
                                <div class="row">
                                    <div class="col-sm-6">
                                        <input class="form-control" type="text" name="name" id="contact-name" placeholder="{{ __('public.forms.your_name') }}" required aria-label="{{ __('public.forms.your_name') }}">
                                    </div>
                                    <div class="col-sm-6">
                                        <input class="form-control telephone" type="tel" name="phone" id="contact-phone" autocomplete="tel" maxlength="20" placeholder="{{ __('public.forms.phone') }}" aria-label="{{ __('public.forms.phone') }}">
                                    </div>
                                    <div class="col-12">
                                        <input class="form-control" type="email" name="email" id="contact-email" placeholder="{{ __('public.forms.email') }}" required aria-label="{{ __('public.forms.email') }}">
                                    </div>
                                    <div class="col-12">
                                        <textarea class="form-control" name="message" id="contact-message" rows="5" placeholder="{{ __('public.forms.your_message') }}" required aria-label="{{ __('public.forms.your_message') }}">{{ old('message', request('product') ? __('public.shop.inquire_message', ['product' => request('product')]) : '') }}</textarea>
                                    </div>
                                    <div class="col-12">
                                        <button class="g-recaptcha btn btn-sqr" type="button" data-sitekey="{{ config('services.recaptcha.key') }}" data-callback="onSubmitContactForm" data-action="submit">{{ __('public.forms.send_request') }}</button>
                                    </div>
                                </div>
                            </div>
                            <div class="alert alert-success js-r-form-success-alert d-none mt-3" role="alert"></div>
                        </form>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="contact-info">
                        <h4 class="contact-title">{{ __('public.contact_title') }}</h4>
                        <p>{{ __('public.contact.response_card_text') }}</p>
                        <ul>
                            <li><i class="fas fa-map-marker-alt"></i> {{ $addr }}</li>
                            <li><i class="fas fa-phone"></i> <a href="{{ $telHref }}">{{ $phone }}</a></li>
                            <li><i class="fas fa-envelope"></i> <a href="mailto:{{ $email }}">{{ $email }}</a></li>
                        </ul>
                        <div class="working-time">
                            <h6>{{ __('public.schedule') }}</h6>
                            <p><span>{{ __('public.contact.schedule_label') }}:</span> {{ __('public.contact.schedule_hours') }}</p>
                        </div>
                        <div class="widget-body social-link">
                            <a href="https://www.facebook.com/profile.php?id=100095559760291" target="_blank" rel="noopener noreferrer" aria-label="{{ __('public.contact.facebook') }}"><i class="fab fa-facebook-f"></i></a>
                            <a href="https://www.instagram.com/language.on" target="_blank" rel="noopener noreferrer" aria-label="{{ __('public.contact.instagram') }}"><i class="fab fa-instagram"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection