@extends('front.layout')
@section('title')
{{$boiler->MetaTitle}}
@endsection
@section('description')
{{$boiler->MetaDescription}}
@endsection
@include('front/common/meta')
@section('content')
@if(!empty($boiler)) 

<section class="page-banner service-details boller-installation bg-overlay" style="background-image: url({{asset(Config("params.media_path.large").$boiler->HeaderImageName)}})">
            <div class="container page-inner-box text-white pt-5">
                <div class="row justify-content-between">
                    <div class="col-lg-7">
                        
                        <h3 class="mb-lg-4 h1">{{$boiler->Title}}</h3>
                          <?php echo $boiler->short_description; ?>
                        
                         <p class="mt-lg-5 mt-3 banner-logos">
                            <a href="#">
                                <img src="{{ asset('/front/images/trustpilot-reviews-logo.png') }}" class="trustpilot-logo img-fluid mr-2" alt="">
                            </a>
                            <a href="#">
                                <img src="{{ asset('/front/images/Gas-Safe-Logo.png') }}" class="img-fluid safe-logo ml-2" alt="Gas Safe Registered">
                            </a>
                        </p>
                        

                    </div>
                    <div class="col-lg-5">
                        <div class="callback-form p-4">
                            @include('front/common/request_call_back')
                        </div>
                    </div>
                </div>
            </div>
        </section>


<section class="py-lg-5 py-3">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-9 text-center emblem">
                        <h1 class="mb-lg-4 text-primary">{{$boiler->HeaderTitle}}</h1>
                         <?php echo $boiler->Content; ?>
                    </div>
                </div>
            </div>
        </section>


@if(!empty($sec3) )
<section class="py-lg-5 py-3">
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center">
                <h2 class="h1 text-primary ">{{$sec3->Title}}</h2>
                <p class="text-center pb-4"><img src="front/images/trustpilot-logo.svg" width="250" height="61" alt="" ></p>
                 <script src="https://apps.elfsight.com/p/platform.js" defer></script>
                <div class="elfsight-app-7d15d6d0-c59a-499b-80e2-af99c88b68b9"></div>
            </div>
        </div>
    </div>
</section>
@endif


<section class="py-lg-5 bg-overlay text-white py-3" style="background-image: url({{ asset('/front/images/engineer_installation_repair_boiler.jpg') }});">
            <div class="container">
                <div class="row text-center justify-content-center">
                    <div class="col-lg-9">
                        <?php echo $boiler->Content2;?>
                    </div>

                </div>
            </div>
        </section>
@endif
@if(!empty($sec5) )

<section class="py-lg-5 py-3 clients text-center">
            <div class="container">
                <div class="row no-gutters justify-content-center">
                    <div class="col-md-8 text-center px-md-5">
                        <h3 class="text-primary mb-lg-4">{{$sec5->Title}}</h3>
                    </div>
                    <?php echo $sec5->Content;?>
                
                </div>
            </div>
        </section>
@endif
@if(!empty($sec6) )

 <section class="how-it-work py-lg-5 bg-overlay text-white py-3" style="background-image: url({{asset(Config("params.media_path.large").$sec6->ImageName)}});">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-10 text-center">
                        <h3 class="h1 mb-lg-4">{{$sec6->Title}}</h3>
                    </div>
                </div>
                <?php echo $sec6->Content;?>
            </div>
        </section>
@endif

@if(!empty($sec7) )

<section class="py-lg-5 py-3">
            <div class="container">
                <div class="row justify-content-center">
                     <?php echo $sec7->Content;?>
                </div>
            </div>
        </section>
@endif

@if(!empty($boiler->faqTitle) || !empty($boiler->faqText))
<section class="faq-section bg-overlay text-white py-3 py-lg-5 mt-0" style="background-image: url({{ asset('/front/images/faqs.jpg') }});">
    <div class="container pt-lg-5 position-relative z-index11">
        <div class="accordion wow fadeInUp faq-accordion" id="faqAccordion">
            <div class="row py-5 align-items-center">
                <div class="col-md-6">
                    <h3 class="h2 ff-sinkin-sans text-uppercase mb-lg-4"><?php echo $boiler->faqTitle; ?></h3>
                     <p><?php echo $boiler->faqText; ?></p>

                </div>
                <div class="col-md-6">
                    <div class="row">
                        @if (count($faqs) > 0)
                        @foreach($faqs as $faq)
                        <div class="col-md-12">
                            <div class="faq-header bg-primary text-white border-0 p-2">
                                <h4 class="mb-0 collapsed" data-toggle="collapse" data-target="#collapse{{$faq->id}}" aria-expanded="false" aria-controls="collapse{{$faq->id}}">{{$faq->title}}</h4>
                            </div>
                            <div id="collapse{{$faq->id}}" class="collapse faq-body" data-parent="#faqAccordion">
                                <?php echo $faq->description ?>
                            </div>
                        </div>
                        @endforeach
                        @endif

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</section>
@endif



@endsection