@extends('master', [ 'headerIsLight' => true ])

@section('title', $page->translation->meta_title != '' ? $page->translation->meta_title : $page->translation->name .' | '. config('site.company_name'))
@section('meta_description', $page->translation->meta_description)

@section('content')

    <div class="o-intro">
        <div class="o-intro__header">
            @include('components.pageTitle', ['isInsideIntro' => true])
        </div>
        <div class="o-intro__body">

            <div class="o-contact">
                <div class="o-contact__info">
                    <h2 class="o-contact__header">{{config('site.company_name')}}</h2>

                    <div class="o-contact__card">
                        @include('components.servicePoint', [
                            'button' => null,
                            'cardView' => true
                        ])
                    </div>

                    <div class="o-contact__address">
                        <p>{{config('site.company_address')}}</p>
                        <p>{{config('site.company_zip')}} {{config('site.company_city')}}</p>
                        <p>{{config('site.company_country')}}</p>
                        <p>&nbsp;</p>
                        <p><a href="tel:{{ config('site.company_phone_call') }}">{{ config('site.company_phone_display') }}</a></p>
                        <p><a href="mailto:{{ config('site.company_email') }}">{{ config('site.company_email') }}</a></p>
                    </div>

                    {{-- Optional 2nd address --}}
                    {{--<div class="o-contact__address">--}}
                        {{--<h5>Optional 2nd address</h5>--}}
                        {{--<p>Postbus 1234</p>--}}
                        {{--<p>1234 XX Plaatsnaam</p>--}}
                        {{--<p>Land</p>--}}
                    {{--</div>--}}

                    @if(!empty(config('site.company_kvk')))
                        <div class="o-contact__numbers">
                            <p>
                                <span>@lang('company.chamber_of_commerce'):</span>
                                <span>{{ config('site.company_kvk') }}</span>
                            </p>
                        </div>
                    @endif
                </div>
                <div class="o-contact__form">

                    @if(isset($send))
                        <h2 class="o-contact__header">@lang('contact.send.title')</h2>
                        <p>@lang('contact.send.description')</p>
                    @else
                        <h2 class="o-contact__header">@lang('contact.form_title')</h2>
                        @include('organisms.forms.contact')
                    @endif
                </div>
            </div>

        </div>
    </div>

    @include('organisms.components')

    <div class="o-block">
        <div class="l-contain">
            <h3 class="c-heading  c-heading--indent  u-spacing-mt5  u-spacing-mb5">@lang('contact.map_heading')</h3>
            <div class="o-map  js-google-map" id="map" style="height: 576px; max-height: 50vh"
                 data-google-lat="{{ !empty(config('site.google_maps_lat')) ? config('site.google_maps_lat') : '51.257929' }}"
                 data-google-lng="{{ !empty(config('site.google_maps_long')) ? config('site.google_maps_long') : '5.595330' }}"
            ></div>
        </div>
    </div>

    @include('organisms.calloutBar')

@endsection