@extends('web.layouts.container')

@section('content')
    <div class="inner_header" style="background-image: url({{asset($work->header_image ?? 'assets/web/images/do_inner.jpg')}});">
        <div class="container">
            <div class="info text-center">
                <h3>{{$work->header_title ?? ''}}</h3>
                <ul>
                    <li>
                        <a href="{{LaravelLocalization::getLocalizedURL(getCurrentLocale(), route('home'), [], true)}}">home</a>
                    </li>
                    <li>
                        <a href="#">{{$work->header_title ?? ''}}</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!--Contents-->
    <main>
        <section class="expected section_padding bg_gray">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-5">
                        <div class="text-center section_title mb-5">
                            <h2 class="titlemb-4"><b>{{$work->first_title ?? ''}}</b></h2>
                            <p>{{stripText($work->first_description ?? '')}}</p>
                        </div>
                    </div>
                </div>
                <div class="img text-center">
                    <img src="{{asset($work->first_image ?? 'assets/web/images/roots-1.png')}}" alt="">
                </div>
            </div>
        </section>
        @if(count($workSections))
            <section class="what_do about-pg">
                <div class="container-fluid p-0">
                    @foreach($workSections as $workSection)
                        @if($loop->odd)
                        <div class="row align-items-center no-gutters">
                            <div class="col-lg-6">
                                <div class="img">
                                    <img src="{{asset($workSection->image)}}" alt="">
                                </div>
                            </div>
                            <div class="col-lg-5">
                                <div class="info">
                                    <div class="text-box">
                                        <h5 class="subtitle color-primary mb-2">What We Do?</h5>
                                        <h2 class="titlemb-4 mb-3"><b>{{$workSection->title}}</b></h2>
                                        <p class="det text-focus-in">{{stripText($workSection->description ?? '')}}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endif
                        @if($loop->even)
                        <div class="row align-items-center no-gutters">
                            <div class="col-lg-5 offset-lg-1 order_2">
                                <div class="info">
                                    <div class="text-box">
                                        <h5 class="subtitle color-primary mb-2">What We Do?</h5>
                                        <h2 class="titlemb-4 mb-3"><b>{{$workSection->title}}</b></h2>
                                        <p class="det text-focus-in">{{stripText($workSection->description ?? '')}}</p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="img">
                                    <img src="{{asset($workSection->image)}}" alt="">
                                </div>
                            </div>
                        </div>
                        @endif
                    @endforeach
                </div>
            </section>
        @endif

        <section class="add_value section_padding bg_gray">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-5">
                        <div class="text-center section_title mb-5">
                            <h2 class="titlemb-4"><b>{{$addValueDetails->add_value_title ?? ''}}</b></h2>
                            <p>{{stripText($addValueDetails->add_value_description ?? '')}}</p>
                        </div>
                    </div>
                </div>
                @if(count($addValues))
                    <div class="content">
                        <div class="row">
                            @foreach($addValues as $addValue)
                                <div class="col-lg-4">
                                    <div class="items">
                                        <div class="img">
                                            <img src="{{asset($addValue->image)}}" alt="">
                                            <div class="info">{{$addValue->title}}</div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                @endif

            </div>
        </section>
        <section class="value">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-7">
                        <div class="text-center section_title">
                            <h5 class="subtitle color-primary mb-2">What We Do?</h5>
                            <h2 class="titlemb-4 text-light"><b>{{$work->second_title ?? ''}}</b></h2>
                            <p class="text-light">{{stripText($work->second_title ?? '')}}</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--Start operations-sec -->
        <section class="operations-sec section_padding">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-5">
                        <div class="text-center section_title mb-5">
                            <h2 class="titlemb-4"><b>{{$operateDetails->operate_title ?? ''}}</b></h2>
                            <p>{{stripText($operateDetails->operate_description ?? '')}}</p>
                        </div>
                    </div>
                </div>
                @if(count($operates))
                    <div class="content mt-5">
                        @foreach($operates as $operate)
                            <div class="oper_card wow zoomIn">
                                <img src="{{asset($operate->image)}}" alt="" class="icon" />
                                <h6 class="title text-white mb-0"><b>{{$operate->title}}</b></h6>
                            </div>
                        @endforeach
                    </div>
                @endif
            </div>
        </section>
    </main>
@endsection

@section('inner_js')

    <script>
        $('.top_nav').addClass('inner_top_nav btn_filter py-3');

        $('.value').css({
            backgroundImage: "url({{asset($work->second_image ?? '')}})"
        })
    </script>

@endsection