@extends('layout.mainlayout')

@section('content')

    <main class="page-main">
        <!-- Start Breadcrubms Section -->
        <section class="new-sec breadcrumbs-sec">
            <div class="container">
                <h3 class="page-title">{{trans("web.services_providers")}}</h3>
                <i class="ri-arrow-down-s-line icon"></i>
            </div>
        </section>
        <!-- End Breadcrubms Section -->
        <!-- Start Search Form -->
        <section class="new-sec search-sec">
            <div class="container">
                <form class="form">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="{{trans('web.search_providers')}}" name="q" value="{{ !empty(app('request')->input('q')) ? app('request')->input('q') : ''}}">
                        <button class="btn search-btn">
                            <i class="ri-search-line"></i>
                        </button>
                    </div>
                </form>
            </div>
        </section>
        <!-- End Search Form -->
        <!-- Start Companies Section -->
        <section class="new-sec companies-sec">
            <div class="container">
                <div class="sec-tabs">
                    <button class="btn tab-btn web-providers-cities {{ empty(app('request')->input('city_id')) ? 'active' : ''}}" value="">{{trans('web.all')}}</button>
                    @foreach($cities as $city)
                        <button class="btn tab-btn web-providers-cities {{ app('request')->input('city_id') == $city->CITY_ID ? 'active' : ''}}" value="{{ $city->CITY_ID }}">@if(app('translator')->getLocale() == "ar"){{$city->ARABIC_NAME}}@else{{$city->ENG_NAME}}@endif</button>
                    @endforeach
                </div>
                <div class="companies">
                    <div class="row">
                        @foreach($hospitals as $hospital)
                            <div class="col-sm-6 col-lg-4">
                                <div class="single-box">
                                    <div class="box-image">
                                        <img src="{{$hospital->WEBSITE_LOGO}}" alt="Cmpany Name">
                                    </div>
                                    <div class="box-info">
                                        <h3><a class="company-name" style="color: black" @if(empty($hospital->EXTERNAL_LINK)) href="/{{$hospital->ID}}/lab?type=1" @else href="{{$hospital->EXTERNAL_LINK}}" @endif>@if(app('translator')->getLocale() == "ar"){{$hospital->WEBSITE_NAME_AR}}@else{{$hospital->WEBSITE_NAME_EN}}@endif</a></h3>
                                        <div class="company-rate" style="display: none">
                                            <i class="ri-star-fill icon"></i>
                                            <i class="ri-star-fill icon"></i>
                                            <i class="ri-star-fill icon"></i>
                                            <i class="ri-star-fill icon"></i>
                                            <i class="ri-star-line icon"></i>
                                        </div>
                                        <p class="location" style="display: flow-root;">
                                            <span class="value"><i class="ri-map-pin-line icon"></i>@if(app('translator')->getLocale() == "ar"){{$hospital->CITYSTATE->ARABIC_NAME}}@else{{$hospital->CITYSTATE->ENG_NAME}}@endif<br></span>
                                            <span lat="{{$hospital->GPS_LATITUDE}}" long="{{$hospital->GPS_LONGITUDE}}" class="km location-info"></span>
                                        </p>
                                        <a @if(empty($hospital->EXTERNAL_LINK)) href="/{{$hospital->ID}}/lab?type=1" @else href="{{$hospital->EXTERNAL_LINK}}" @endif class="btn more-btn">
                                            {{trans('web.know_more')}}
                                            <span class="icon">@if(app('translator')->getLocale() == 'ar') &#10229;@else &#10230;@endif</span>
                                        </a>
                                    </div>
                                </div>
                            </div>

                        @endforeach

                    </div>
                    <div class="btns">
                       {{-- <a href="#" class="btn more-btn">
                            Load more
                            <i class="ri-restart-line icon"></i>
                        </a>--}}
                    </div>
                </div>
            </div>
        </section>
        <!-- End Companies Section -->
        <!-- 
        <section class="new-sec cta-solutions-sec">
            <div class="container">
                <div class="sec-content">
                    <img src="img/solution-circles.png" alt="Circles">
                    <h5 class="subtitle">{{trans('web.we_will_offer')}}</h5>
                    <h3 class="sec-title">{{trans('web.lets_gets_to_know')}}</h3>
                    <p class="sec-desc">{{trans('web.contact_our_sales')}}</p>
                    <a href="/contact" class="btn cta-btn contact-btn-provider" style="min-inline-size: max-content;">
                        {{trans('web.contact_us')}}<span class="icon">@if(app('translator')->getLocale() == 'ar') &#10229;@else &#10230;@endif</span>
                    </a>
                </div>
            </div>
        </section>
      End CTA Solution Section -->
    </main>

@endsection