@extends('web.layouts.container')

@section('content')
<main>
    <!-- Start pg-header -->
    <section class="pg-header section">
        <div class="container">
            <h1 class="title text-white text-uppercase fw-bold text-center">{{$pages[0]->currentDescription->page_title}}</h1>
        </div>
        <img src="{{ asset($pages[0]->image ?? 'assets/web/images/header-1.png')}}" alt="{{$pages[0]->currentDescription->page_title}}" class="bg"/>
    </section>
    <!-- Start services-pg -->
    <section class="services-pg section">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-6 px-0">
                    <img src="{{ asset($pages[0]->image ?? 'assets/web/images/do_1.png')}}" alt="" class="sec-img"/>
                </div>
                <div class="col-lg-6 px-0">
                    <div class="text_box">
                        <h1 class="title fw-bold mb-4 pb-2 text-uppercase">
                            {!! footerLink($pages[0]->currentDescription->title) !!}
                        </h1>
                        <div class="p">
                            {!! $pages[0]->currentDescription->description !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Start doing-pg -->
    <section class="doing-pg bg-light section">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-6">
                    <div class="text_box">
                        <h1 class="title fw-bold mb-4 pb-2 text-uppercase">
                            {!! footerLink($pages[1]->currentDescription->title, false, false, 2) !!}
                        </h1>
                        <div class="p">
                            {!! $pages[1]->currentDescription->description !!}
                        </div>
                        <ul class="custom_ul">
                            @foreach ($pages[1]->currentDescription->features ?? [] as $item)
                                
                            <li class="li">
                                <div class="num_box">
                                    <div class="num"></div>
                                </div>
                                <div class="txt">
                                    <p class="p">
                                        {{ $item ?? ''}}
                                    </p>
                                </div>
                            </li>
                            @endforeach
                        </ul>

                    </div>
                </div>
                <div class="col-lg-6">
                    <img src="{{ asset($pages[1]->image ?? 'assets/web/images/do_2.png')}}" alt="" class="sec-img"/>
                </div>
            </div>
        </div>
    </section>

     <!-- Start ROUTES & SCHEDULES -->
     <section class="routes-schedules section">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-6">
                    <div class="img_box">
                        <img src="{{ asset($pages[2]->image ?? 'assets/web/images/do_3.jpg')}}" alt=""/ class="rotateY">
                        <img src="{{ asset($pages[2]->currentDescription->image2 ?? 'assets/web/images/do_4.jpg')}}" alt=""/>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="text_box">
                        <h1 class="title fw-bold mb-4 pb-2 text-uppercase">
                            {!! footerLink($pages[2]->currentDescription->title, true, false, 3) !!}
                        </h1>
                        <div class="p">
                            {!! $pages[2]->currentDescription->description !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Start support-sec -->
    <section class="support-sec section">
        <div class="container">
            <div class="row">
                <div class="col-lg-6">
                    <div class="text_box">
                        <h1 class="title fw-bold mb-4 pb-2 text-uppercase">
                            {!! footerLink($pages[3]->currentDescription->title, true, false, 2) !!}
                        </h1>
                        <div class="p">
                            {!! $pages[3]->currentDescription->description !!}
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="row align-items-center">
                        @foreach ($pages[3]->currentDescription->features ?? [] as $i => $item)
                            <div class="col-6">
                                <div class="support_card">
                                    <img src="{{ asset($pages[3]->currentDescription->features_images[$i] ?? 'assets/web/images/icons/support-'.($i+1).'.png')}}" alt="" class="icon filterPrimary m-auto mb-4 d-block"/>
                                    <h5 class="title mb-0">{{ $item ?? ''}}</h5>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Start support-offline -->
    <section class="support-offline section py-0">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-6 px-0">
                    <img src="{{ asset($pages[4]->image ?? 'assets/web/images/do_5.jpg')}}" alt="" class="sec-img"/>
                </div>
                <div class="col-lg-6 px-0">
                    <div class="text_box">
                        <h1 class="title text-white fw-bold mb-4 pb-2 text-uppercase">
                            <span class=" line_prim">{{ $pages[4]->currentDescription->title }}</span>
                        </h1>
                        <div class="p">
                            {!! $pages[4]->currentDescription->description !!}
                        </div>
                        <div class="off_support mt-4">
                            <div class="row">
                                @foreach ($pages[4]->currentDescription->features ?? [] as $i => $item)
                                    <div class="col-lg-6">
                                        <div class="off_supp_item d-flex align-items-center">
                                            <img src="{{ asset($pages[4]->currentDescription->features_images[$i] ?? 'assets/web/images/icons/support-1.png')}}" alt="" class="icon"/>
                                            <div class="txt">
                                                <h5 class="title fw-bold text-white">{{ $item ?? ''}}</h5>
                                                <p class="det">
                                                    {{$pages[4]->currentDescription->features_description[$i] ?? ''}}
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Start support-OPERATIONAL  -->
    <section class="support-operational services-pg section bg-light" id="#p_23">
        <div class="container">
            <h1 class="title text-center fw-bold mb-5 text-uppercase">
                {!! footerLink($operations[0]->currentDescription->page_title) !!}
            </h1>
            <div class="row align-items-center">
                <div class="col-lg-6 px-0">
                    <div class="text_box">
                        <div class="accordion" id="accordionExample">
                            @foreach ($operations as $k=> $page)
                            <div class="accordion-item ">
                                <h2 class="accordion-header" id="heading_{{$page->id}}">
                                    <button class="accordion-button @if($k != 0) collapsed @endif" type="button" data-bs-toggle="collapse" data-bs-target="#collapse_{{$page->id}}" aria-expanded="true" aria-controls="collapse_{{$page->id}}">
                                        {{ $page->currentDescription->title }}
                                    </button>
                                </h2>
                                <div id="collapse_{{$page->id}}" class="accordion-collapse collapse {{ 0 == $k ? 'show' : ''}}" aria-labelledby="heading_{{$page->id}}" data-bs-parent="#accordionExample">
                                    <div class="accordion-body">
                                        <div class="p mb-0">{!! $page->currentDescription->description !!}</div>
                                        <ul class="custom_ul mt-4">
                                            @foreach ($page->currentDescription->features ?? [] as $i => $item)
                                                <li class="li">
                                                    <div class="num_box">
                                                        <div class="num"></div>
                                                    </div>
                                                    <div class="txt">
                                                        <p class="p">
                                                            {{ $item ?? ''}}
                                                        </p>
                                                    </div>
                                                </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 px-0 order-first order-lg-last">
                    <img src="{{ asset($operations[0]->image ?? 'assets/web/images/do_6.png')}}" alt="" class="sec-img"/>
                </div>
            </div>
        </div>
    </section>

</main>
@endsection

@section('inner_js')
@endsection