@extends('web.layouts.container')

@section('header')
    <div class="inner-header text-center" style="background-image: url({{$image ? asset($image) : asset('assets/web/images/ab3.jpg')}});">
        <h4><span>{{$title ?? __('services.inner_page')}}</span></h4>
    </div>
@endsection

@section('content')

    <section class="ser-det about section-padding">
        <div class="container">
            <div class="d-flex m-auto justify-content-center align-items-center" style="width: 200px; height: auto">
                <img class="w-100"src="{{asset($service_logo)}}" alt="">
            </div>
            <div class="info">
                <div class="side-head">
                    <p>{{__('services.inner_page')}}</p>
                    <h4>{{__('services.what_we_offer')}}</h4>
                </div>
                <p class="text mb-3">{!! $ourService ? $ourService->description : '' !!}</p>
            </div>
        </div>
        <div class="container">
            <div class="ser-gallery">
                <div class="row no-gutters">
                    @if($photos)
                        @foreach($photos as $photo)
                            <div class="col-lg-4">
                                <div class="img large">
                                    <img src="{{asset($photo->photo)}}" alt="">
                                    <a class="icon" data-fancybox="gallery" href="{{asset($photo->photo)}}">
                                        <img src="{{asset('assets/web/')}}/images/focus.svg" alt="">
                                    </a>
                                </div>
                            </div>
                        @endforeach
                    @endif
                </div>
            </div>
            @if($videos && is_array($videos))
                @foreach($videos as $video)
                    <div class="ser-vid section-padding text-center">
                        <a href="{{$video ?? 'https://youtu.be/DzoSrF8MicQ'}}" data-fancybox class="icon">
                            <i class="far fa-play-circle"></i>
                        </a>
                    </div>
                @endforeach
                @elseif($videos)
                <div class="ser-vid section-padding text-center">
                    <a href="{{$videos ?? 'https://youtu.be/DzoSrF8MicQ'}}" data-fancybox class="icon">
                        <i class="far fa-play-circle"></i>
                    </a>
                </div>
            @endif

        </div>
    </section>
@endsection

@section('inner_js')

@endsection