@extends('web.layouts.container')

@section('content')
    <div class="page-heading">
        <div class="overlay"></div>
        <div class="container">
            <div class="text text-center">
                <h4>{{__('trainingCenters.head')}}</h4>
            </div>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item">
                        <a href="#">{{__('main.home_page')}}</a>
                        <i class="far fa-dot-circle"></i>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">{{$trainingCenters->name}}</li>
                </ol>
            </nav>
        </div>
    </div>
    <section class="profile-lab">
        <div class="container">
            <div class="inner">
                <div class="lab-carousel owl-carousel owl-theme">
                    @if(is_array($trainingCenters->images) && count($trainingCenters->images))
                        @foreach($trainingCenters->images as $image)
                            <div class="item">
                                <img src="{{asset($image)}}">
                            </div>
                        @endforeach
                    @endif
                </div>
                <div class="card-body">
                    <h3>{{$trainingCenters->name}}</h3>
                    <p>{!! $trainingCenters->description !!}</p>
                    <div class="contact-links-sec">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="item">
                                    <div class="icon">
                                        <i class="fab fa-whatsapp"></i>
                                    </div>
                                    <div class="text">
                                        <h6>{{__('main.connect_with_us')}}</h6>
                                        <a href="tel:{{$trainingCenters->phone}}"><p>{{$trainingCenters->phone}}</p></a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="item">
                                    <div class="icon">
                                        <i class="far fa-envelope"></i>
                                    </div>
                                    <div class="text">
                                        <h6>{{__('users.email')}}</h6>
                                        <a href="mailto:{{$trainingCenters->email}}"><p>{{$trainingCenters->email}}</p></a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="item">
                                    <div class="icon">
                                        <i class="fas fa-map-marker-alt"></i>
                                    </div>
                                    <div class="text">
                                        <h6>{{__('users.address')}}</h6>
                                        <p>{{$trainingCenters->address}}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </section>
@endsection

@section('inner_js')

@endsection