@extends('frontLayout.frontlayout')
@section('content')

<section class="breadcame top-space">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="label">
                    <h5>
                    {{$page->breadcrumb_title}}
                    </h5>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="our_service_head">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="head">
                   <h4>
                        {{strtok($page['title']," ")}}
                        <span>{{strstr($page['title']," ")}}</span>
                    </h4>
                    <p>
                        {!! nl2br($page['short_description']) !!}
                    </p>
                </div>
            </div>
        </div>
    </div>
</section>
@php
$decImages = $page['image'] ? json_decode($page['image'], true) : [];
@endphp
<section class="gallery">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="row">
                    @if(isset($decImages) && $decImages)
                    <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12 col-sm-12 col-12">
                        <div class="row">
                            @if(isset($decImages[0]) && $decImages[0] )
                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                <div class="img_area one">
                                    @include('frontend.partials.fileRender', ['file' => $decImages[0], 'size' => "large"])
                                </div>
                            </div>
                            @endif
                            @if(isset($decImages[1]) && $decImages[1] )
                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                <div class="img_area two">
                                    @include('frontend.partials.fileRender', ['file' => $decImages[1], 'size' => "large"])
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>
                    @endif
                    @if(isset($decImages) && count($decImages) > 2 )
                    <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 col-sm-12 col-12">
                        <div class="row">

                            @if(isset($decImages[2]) && $decImages[2] )
                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="img_area three">
                                    @include('frontend.partials.fileRender', ['file' => $decImages[2], 'size' => "large"])
                                </div>
                            </div>
                            @endif
                            @if(isset($decImages[3]) && $decImages[3] )
                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="img_area three">
                                    @include('frontend.partials.fileRender', ['file' => $decImages[3], 'size' => "large"])
                                </div>
                            </div>
                            @endif
                            @if(isset($decImages[4]) && $decImages[4] )
                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                <div class="img_area five">
                                    @include('frontend.partials.fileRender', ['file' => $decImages[4], 'size' => "large"])
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>
                    @endif
                    <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                        <div class="decscribe">
                            {!! nl2br($page['description']) !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@if(isset($history) && ( $history->title || $history->description ) )
<section class="History">
    <div class="container">
        <div class="row">
            @php
            $hisDes = $history->description ? json_decode($history->description, true) : [];
            @endphp
            @if($hisDes)
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="head">
                    <h4>
                        {{$history->title}}  
                    </h4>
                </div>
                
                <div class="history_wrap">
                    <div class="history_inner">
                        @php
                        $numItems = count($hisDes);
                        $count = 1;
                        $i = 0;
                        @endphp
                        @foreach($hisDes as $hd)
                            @if($hd['year'] || $hd['description'])
                                @if ($count%2 == 1)
                                <div class="left">
                                @else
                                <div class="left right">
                                @endif
                                <h4>
                                    {{$hd['year']}}
                                </h4>
                                <p>
                                    {!! nl2br($hd['description']) !!}
                                </p>
                                @if(++$i != $numItems)
                                <div class="img_arrow d-sm-block d-none">
                                    @if ($count%2 == 1)
                                    <img src="{{url('assets/frontend/images/arrow_left.png')}}" alt=".." />
                                    @else
                                    <img src="{{url('assets/frontend/images/arrow_right.png')}}" alt=".." />
                                    @endif
                                </div>
                                @endif
                            @endif
                        </div>
                        @php $count++; @endphp
                        @endforeach
                    </div>
                </div>
            </div>
            @endif
        </div>
    </div>
</section>
@endif

@if(isset($mission) && ( $mission->title || $mission->description || $mission->image) && $mission->is_active == 1 )
<section class="service_left">
    <div class="container">
        <div class="row">
            <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-5 col-sm-5 col-12">
                <div class="left_us">
                    <div class="img_area">
                        @include('frontend.partials.fileRender', ['file' => $mission->image, 'size' => "large"])
                    </div>
                </div>
            </div>
            <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-7 col-sm-7 col-12">
                <div class="right_us">
                    <div class="head">
                        <h4>
                            {{$mission->title}}
                        </h4>
                        <p>
                            {!! nl2br($mission->description) !!}
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endif

@if(isset($team) && $team)
<section class="meet_team">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="head">
                    <h4>
                        {{$team->title}}
                    </h4>
                    <p>
                        {{$team->short_description}}
                    </p>
                </div>
                <div class="member_wrap">
                    <div class="owl-carousel owl-theme" id="teams">
                        @foreach($teams as $t)
                        <div class="item">
                            <div class="member_detail">
                                <div class="member_inner_area">
                                    <div class="img_area">
                                        @include('frontend.partials.fileRender', ['file' => $t['image'], 'size' => "large"])
                                    </div>
                                    <div class="info">
                                        <div class="name">
                                            <h6>
                                                {{$t['name']}}
                                            </h6>
                                            <span>
                                                <i class="fas fa-circle"></i>
                                            </span>
                                            <p>
                                                {{$t['designation']}}
                                            </p>
                                        </div>
                                        <div class="descprt">
                                            <p>
                                            {!! Str::limit(nl2br($t['description']),80,' ') !!}
                                            </p>
                                            <p>
                                                <a href="javascript:;" class="team-detail" data-url="{{route('homepage.teamDetail',['id' => $t['id']])}}" data-modal="team">Read more..</a>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endif

<div class="modal el_modal team fade" id="team" data-bs-backdrop="static" data-bs-keyboard="false">
    <div class="modal-dialog  modal-dialog-centered">
        <div class="modal-content">
        </div>
    </div>
</div>

@endsection