@extends('website.layouts.globalLayout')

@section('content')
<section class="contact-section">
    <div class="container">
        <div class="row mb-5">
            <div class="col-md-12 text-center">
            </div>
        </div>
        <div class="row">
            <div class="col-md-4 d-flex">
                <div class="contact-box flex-fill">
                    <div class="infor-img">
                        <div class="image-circle">
                            <i class="fa fa-phone"></i>
                        </div>
                    </div>
                    <div class="infor-details text-center">
                        <label>Téléphones</label>
                        <p>{{optional(InfosSystem())->telephone}} <br>{{optional(InfosSystem())->green_number}}</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 d-flex">
                <div class="contact-box flex-fill">
                    <div class="infor-img">
                        <div class="image-circle bg-primary">
                            <i class="fa fa-envelope"></i>
                        </div>
                    </div>
                    <div class="infor-details text-center">
                        <label>Email</label>
                        <p>{{optional(InfosSystem())->email}} <br>{{optional(InfosSystem())->support_email}}</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 d-flex">
                <div class="contact-box flex-fill">
                    <div class="infor-img">
                        <div class="image-circle">
                            <i class="fa fa-location-arrow "></i>
                        </div>
                    </div>
                    <div class="infor-details text-center">
                        <label>Adresse</label>
                        <p>Mermoz Sacré coeur. <br> Dakar Sénégal</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="contact-map d-flex">
    <iframe
        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3459.716346058072!2d-95.5565430855612!3d29.872453233633234!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8640cfe4516785ed%3A0x774974592a609121!2s54%20Northwest%20Fwy%20%23558%2C%20Houston%2C%20TX%2077040%2C%20USA!5e0!3m2!1sen!2sin!4v1631855334452!5m2!1sen!2sin"
        allowfullscreen="" loading="lazy"></iframe>
</section>
@include('website.includes.part.footer')
@endsection