@extends('frontend_eng.layouts.app')
@section('title', 'Services')
@section('meta', 'Welcome to Om Hospital and Research Center PVt. Ltd.')
@section('content')

    <!-- BREADCRUMB
               ============================================= -->
    <div id="breadcrumb" class="division">
        <div class="container">
            <div class="row">
                <div class="col">
                    <div class=" breadcrumb-holder">
                        <h4 class="h4-sm text-white">Our Services</h4>
                        <!-- Breadcrumb Nav -->
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ route('homepage') }}" class="text-white">Home</a>
                                </li>
                                <li class="breadcrumb-item active text-white" aria-current="page">Service</li>
                            </ol>
                        </nav>
                    </div>
                    <!-- Title -->
                </div>
            </div>
        </div> <!-- End row -->
    </div> <!-- End container -->
    <div class="slider-overlay"></div>

    @if ($services->isNotEmpty())
        <!-- START SECTION BLOG -->
        <section class="bg_gray">
            <div class="container">
                <div class="row py-3">
                    <div class="col-lg-12 col-md-12 col-12">
                        <p class="text-center">
                            With over 37 clinical specialties OMHRC offers the advantage of integrated medical care in a
                            multidisciplinary setting provided by highly qualified doctors, nurses and healthcare
                            professionals. We offer comprehensive specialist services combined with advance medical
                            technology. We aim to maintain our legacy as a hub by providing complex procedures and quality
                            caresuch as ICU, NICU, Orthopedic surgeries and IVF and fertility treatment.
                        </p>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-12 py-2">
                        <h1 class="text-h1 text-uppercase  text-center">
                            List of All Services
                        </h1>
                    </div>
                </div>
                <div class="row justify-content-center">
                    @foreach ($services as $service)
                        <div class="col-lg-3 col-md-6 col-12 py-2">
                            <div class="blog_post box_shadow1 animation" data-animation="fadeInUp"
                                data-animation-delay="0.02s">
                                <div class="blog_img">
                                    <a href="{{ route('service.detail', $service->slug) }}">
                                        <img src="{{ $service->image ? asset($service->image_path) : asset('assets/images/download.png') }}"
                                            alt="blog_small_img1">
                                    </a>
                                </div>
                                <div class="blog_content bg-white">
                                    <h6 class="blog_title"><a
                                            href="{{ route('service.detail', $service->slug) }}">{{ $service->name }}</a>
                                    </h6>
                                    {{-- <p>{!!Str::limit($service->content,100)!!}</p>
                            <a href="{{route('service.detail',$service->slug)}}" class="text-capitalize">Read More</a> --}}
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </section>
        <!-- END SECTION BLOG -->
    @else
        <!-- START SECTION BLOG -->
        <section class="bg_gray">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-12 py-2">
                        <h4 class="">
                            No data is available at the moment.
                        </h4>
                    </div>
                </div>
            </div>
        </section>
        <!-- END SECTION BLOG -->
    @endif
@endsection