@extends('layout.mainlayout')

@section('content')
  @php
    $locale = app('translator')->getLocale() ?? 'en';
        $currency_code = '<img src="/img/sar.svg" alt="SAR" style="height: 1em; width: auto; display: inline-block; vertical-align: middle;margin-left:2px;margin-right:2px">';

        if (isset($global_symbol['from_website']) && $global_symbol['from_website']){
            if ($locale == 'en'){
              if(isset($global_symbol['is_html']) && $global_symbol['is_html']){
                  $currency_code = '<img src="/img/sar.svg" alt="SAR" style="height: 1em; width: auto; display: inline-block; vertical-align: middle;margin-left:2px;margin-right:2px">';
              }elseif($global_symbol['currency']){
                  $currency_code = $global_symbol['currency_ar'];
              }
            }else{
               if(isset($global_symbol['is_html_ar']) && $global_symbol['is_html_ar']){
                  $currency_code = '<img src="/img/sar.svg" alt="SAR" style="height: 1em; width: auto; display: inline-block; vertical-align: middle;margin-left:2px;margin-right:2px">';
              }elseif($global_symbol['currency']){
                  $currency_code = $global_symbol['currency_ar'];
              }
            }
        }
  @endphp
  <main class="page-main">
    <!-- Start Breadcrubms Section -->
    <section class="new-sec breadcrumbs-sec">
      <div class="container">
        <h3 class="page-title">{{trans('web.pricing')}}</h3>
        <i class="ri-arrow-down-s-line icon"></i>
      </div>
    </section>
    <!-- End Breadcrubms Section -->
    <!-- Start Provider info Sec -->
    <section class="new-sec pricing-sec">
      <div class="container">
        <div class="sec-header text-center">
          <h5 class="subtitle">{{trans('web.our_pricing')}}</h5>
          <h2 class="title">{{trans('web.choose_your_plan')}}</h2>
          <p class="desc">{!!trans('web.pricing_desc')!!}</p>
        </div>
        <div class="pricings">
          <div class="row">
            <div class="col-0 col-lg-3 clm">
              <div class="single-column">
                <div class="bottom-clm">
                  <h4 class="features-title">{{trans('web.pricing_list_of_products')}}</h4>
                  <p class="feature">{{trans('web.blazma_lis')}}</p>
                  <p class="feature">{{trans('web.pricing_smart_report')}}</p>
                  <p class="feature">{{trans('web.pricing_lab_website')}}</p>
                  <p class="feature">{{trans('web.pricing_mobile_application')}}</p>
                  <p class="feature">{{trans('web.pricing_kiosk')}}</p>
                  <h4 class="features-title">{{trans('web.pricing_package_includes')}}</h4>
                  <p class="feature">{{trans('web.pricing_free_patients')}}</p>
                  <p class="feature">{{trans('web.pricing_free_smart')}}</p>
                  <p class="feature">{{trans('web.pricing_lab_devices')}}</p>
                  <p class="feature">{{trans('web.pricing_lis_users')}}</p>
                  <p class="feature">{{trans('web.pricing_sms')}}</p>
                  <p class="feature">{{trans('web.pricing_version')}}</p>
                  <p class="feature">{{trans('web.pricing_support')}}</p>
                  <p class="feature">{{trans('web.pricing_dedicated')}}</p>
                  <p class="feature">{{trans('web.pricing_server_hosting')}}</p>
                  <h4 class="features-title">{{trans('web.pricing_extra_fee')}}</h4>
                  <p class="feature">{{trans('web.pricing_per_visit')}}</p>
                  <p class="feature">{{trans('web.pricing_per_test')}}</p>
                  <p class="feature">{{trans('web.pricing_per_smart')}}</p>
                  <p class="feature">{{trans('web.pricing_additional_device')}}</p>
                  <p class="feature">{{trans('web.pricing_extra_users')}}</p>
                </div>
              </div>
            </div>
            <div class="col-4 col-lg-3 clm">
              <div class="single-column">
                <div class="top-clm">
                  <h3 class="pricing-title">{{trans('web.pricing_basic')}}</h3>
                  <p class="price"><span class="ryal"> {!! $currency_code !!}</span><span class="num">6,000</span></p>
                  <p class="type">/{{trans('web.pricing_monthly')}}</p>
                  <a class="btn get-started-btn" href="/contact">
                    <span>{{trans('web.get_started')}}</span>
                    <span class="icon d-none d-lg-inline-block">&#10230;</span>
                  </a>
                </div>
                <div class="bottom-clm">
                  <h4 class="empty">empty</h4>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"></p>
                  <p class="check"></p>
                  <h4 class="empty">empty</h4>
                  <p class="text">4,000</p>
                  <p class="text">4,000</p>
                  <p class="text">3</p>
                  <p class="text">10</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">N/A</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <h4 class="empty">empty</h4>
                  <p class="text">{!! $currency_code !!} 2.50</p>
                  <p class="text">{!! $currency_code !!} 0.10</p>
                  <p class="text">{!! $currency_code !!} 0.75</p>
                  <p class="text">{!! $currency_code !!} 5,000</p>
                  <p class="text">{!! $currency_code !!} 200</p>
                </div>
              </div>
            </div>
            <div class="col-4 col-lg-3 clm">
              <div class="single-column active">
                <div class="top-clm">
                  <h3 class="pricing-title">{{trans('web.pricing_plus')}}</h3>
                  <p class="price"><span class="ryal">{!! $currency_code  !!}</span><span class="num">10,000</span></p>
                  <p class="type">/{{trans('web.pricing_monthly')}}</p>
                  <a class="btn get-started-btn" href="/contact">
                    <span>{{trans('web.get_started')}}</span>
                    <span class="icon d-none d-lg-inline-block">&#10230;</span>
                  </a>
                </div>
                <div class="bottom-clm">
                  <h4 class="empty">empty</h4>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <h4 class="empty">empty</h4>
                  <p class="text">10,000</p>
                  <p class="text">10,000</p>
                  <p class="text">5</p>
                  <p class="text">20</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">N/A</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <h4 class="empty">empty</h4>
                  <p class="text">{!! $currency_code !!} 2.00</p>
                  <p class="text">{!! $currency_code !!} 0.10</p>
                  <p class="text">{!! $currency_code !!} 0.50</p>
                  <p class="text">{!! $currency_code !!} 5,000</p>
                  <p class="text">{!! $currency_code !!} 200</p>
                </div>
              </div>
            </div>
            <div class="col-4 col-lg-3 clm">
              <div class="single-column">
                <div class="top-clm">
                  <h3 class="pricing-title">{{trans('web.pricing_unlimited')}}</h3>
                  <p class="price"><span class="ryal">{!! $currency_code !!}</span><span class="num">20,000</span></p>
                  <p class="type">/{{trans('web.pricing_monthly')}}</p>
                  <a class="btn get-started-btn" href="/contact" id="nada">
                    <span>{{trans('web.get_started')}}</span>
                    <span class="icon d-none d-lg-inline-block">&#10230;</span>
                  </a>
                </div>
                <div class="bottom-clm">
                  <h4 class="empty">empty</h4>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <p class="check"><i class="ri-check-fill"></i></p>
                  <h4 class="empty">empty</h4>
                  <p class="text">0</p>
                  <p class="text">{{trans('web.unlimited')}}</p>
                  <p class="text">7</p>
                  <p class="text">{{trans('web.unlimited')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <p class="text">{{trans('web.pricing_free')}}</p>
                  <h4 class="empty">empty</h4>
                  <p class="text">{!! $currency_code !!} 1.00</p>
                  <p class="text">{!! $currency_code !!} 0.10</p>
                  <p class="text">{!! $currency_code !!} 0.00</p>
                  <p class="text">{!! $currency_code !!} 5,000</p>
                  <p class="text">N/A</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- End Provider info Sec -->
      <!-- Start Banner Section  -->
      <section class="new-sec product-sec" style="padding:0;background:#FAFAFC">
      <div class="banner d-flex align-items-center">
      <img src="img/left-banner.png" class="float-img left" alt="Blazma Website">
      <div class="container">
        <div class="sec-content text-center" >
          <h2 class="sec-title" style="font-weight: bold;">{!! trans('web.pricing_join_section') !!}</h2>

          <a href="/contact" class="btn demo-btn">
            {{trans('web.get_started')}}
            <span class="icon">&#10230;</span>
          </a>
        </div>
      </div>
      <img src="img/right-banner.png" class="float-img right" alt="Blazma Website">
      </div>
    </section>
    <!-- ُEnd Banner Section  -->
    <!-- Start Common Question -->
    <section class="new-sec common-sec">
      <div class="container">
        <div class="row">
          <div class="col-lg-4">
            <div class="sec-header">
              <h5 class="subtitle">{{trans('web.common_questions')}}</h5>
              <h2 class="title">{{trans('web.faq_title')}}</h2>
              <p class="desc">{{trans('web.pricing_faq_answer')}}</p>
              <a href="/faqs" class="btn more-btn">
                {{trans('web.view_full_faq')}}
                <span class="icon">&#10230;</span>
              </a>
            </div>
          </div>
          <div class="col-lg-8">
            <div class="questions">
              <div class="accordion" id="accordionExample">
                <div class="card">
                  <div class="card-header" id="headingTwo">
                    <h2 class="mb-0">
                      <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                        <span class="name">{{trans('web.pricing_question1')}}</span>
                        <i class="ri-arrow-down-s-line icon"></i>
                      </button>
                    </h2>
                  </div>
                  <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
                    <div class="card-body">
                      {{trans('web.pricing_answer1')}}
                    </div>
                  </div>
                </div>
                <div class="card">
                  <div class="card-header" id="headingThree">
                    <h2 class="mb-0">
                      <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                        <span class="name">{{trans('web.pricing_question2')}}</span>
                        <i class="ri-arrow-down-s-line icon"></i>
                      </button>
                    </h2>
                  </div>
                  <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
                    <div class="card-body">
                      {{trans('web.pricing_answer2')}}
                    </div>
                  </div>
                </div>
                <div class="card">
                  <div class="card-header" id="headingFour">
                    <h2 class="mb-0">
                      <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
                        <span class="name">{{trans('web.pricing_question3')}}</span>
                        <i class="ri-arrow-down-s-line icon"></i>
                      </button>
                    </h2>
                  </div>
                  <div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordionExample">
                    <div class="card-body">
                      {{trans('web.pricing_answer3')}}
                    </div>
                  </div>
                </div>
                <div class="card">
                  <div class="card-header" id="headingFive">
                    <h2 class="mb-0">
                      <button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collpaseFive" aria-expanded="false" aria-controls="collpaseFive">
                        <span class="name">{{trans('web.pricing_question4')}}</span>
                        <i class="ri-arrow-down-s-line icon"></i>
                      </button>
                    </h2>
                  </div>
                  <div id="collpaseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordionExample">
                    <div class="card-body">
                      {{trans('web.pricing_answer4')}}
                    </div>
                  </div>
                </div>

              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- End Common Question -->
    <!-- Start Testimonial Section -->
    <section class="new-sec testimonials-sec">
      <div class="container">
        <div class="sec-header text-center">
          <h5 class="subtitle">{{trans('web.testimonials')}}</h5>
          <h2 class="sec-title">{!! trans('web.our_clients_comments') !!}</h2>
        </div>
      </div>
      <div class="sec-slider">
        <div id="testimonials" class="splide">
          <div class="splide__track">
            <div class="splide__list">
              <div class="splide__slide">
                <div class="single-testi">
                  <p class="desc">{{trans('web.testimonial_one')}}</p>
                  <div class="testi-footer">
                    <div class="testi-image">
                      <!--<img src="img/testi1.jfif" alt="Testimonial Picture">-->
                    </div>
                    <div class="testi-info">
                    <h3 class="name">Laila Jwan</h3>
                      <span class="tag">{{trans("web.client")}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="splide__slide">
                <div class="single-testi">
                  <p class="desc">{{trans("web.testimonial_two")}}</p>
                  <div class="testi-footer">
                    <div class="testi-image">
                      <!--<img src="img/testi2.jfif" alt="Testimonial Picture">-->
                    </div>
                    <div class="testi-info">
                    <h3 class="name">Ahmad Hazem</h3>
                     <span class="tag">{{trans("web.client")}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="splide__slide">
                <div class="single-testi">
                  <p class="desc">{{trans("web.testimonial_three")}}</p>
                  <div class="testi-footer">
                    <div class="testi-image">
                      <!--  <img src="img/testi3.jfif" alt="Testimonial Picture"> -->
                    </div>
                    <div class="testi-info">
                    <h3 class="name">Salma Khader</h3>
                    <span class="tag">{{trans("web.client")}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="splide__slide">
                <div class="single-testi">
                <p class="desc">{{trans("web.testimonial_foor")}}.</p>
                  <div class="testi-footer">
                    <div class="testi-image">
                     <!--   <img src="img/testi4.jfif" alt="Testimonial Picture"> -->
                    </div>
                    <div class="testi-info">
                    <h3 class="name">Emad Saad</h3>
                                            <span class="tag">{{trans("web.client")}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="splide__slide">
                <div class="single-testi">
                <p class="desc">{{trans("web.testimonial_five")}}</p>
                  <div class="testi-footer">
                    <div class="testi-image">
                     <!-- <img src="img/testi1.jfif" alt="Testimonial Picture">-->
                    </div>
                    <div class="testi-info">
                    <h3 class="name">Huda Mo</h3>
                      <span class="tag">{{trans("web.client")}}</span>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="splide__arrows splide__arrows--ltr">
            <button
                    class="splide__arrow splide__arrow--prev"
                    type="button"
                    aria-label="Previous slide"
                    aria-controls="splide01-track"
            >
              <span class="icon">&#10229;</span>
            </button>
            <button
                    class="splide__arrow splide__arrow--next"
                    type="button"
                    aria-label="Next slide"
                    aria-controls="splide01-track"
            >
              <span class="icon">&#10230;</span>
            </button>
          </div>
        </div>
      </div>
    </section>
    <!-- End Testimonial Section -->
    <!-- Start Form Section -->
    <section class="new-sec form-sec contacts without-back">
      <div class="container">
        <div class="row">
          <div class="col-lg-5">
            <div class="sec-content">
              <h4 class="subtitle">{{trans('web.contact_us')}}</h4>
              <h3 class="sec-title">{{trans('web.let_help')}}<br> <span class="pink">{{trans('web.get_started')}}!</span></h3>
              <p class="sec-desc">{{trans('web.find_out')}}</p>
              <div class="social-links">
                <h5 class="title">{{trans('web.follow_us')}}:</h5>
                <div class="links">
                  @if(empty(config('services.PROFILE_ID')))
                    <a href="https://www.facebook.com/blazmacom"class="link">
                      @elseif(config('services.PROFILE_ID') == 18)
                        <a href="https://www.facebook.com/ACL.laboratory"class="link">
                          @endif
                          <i class="ri-facebook-fill"></i>
                        </a>
                        @if(empty(config('services.PROFILE_ID')))
                          <a href="https://twitter.com/blazmacom" class="link">
                            @elseif(config('services.PROFILE_ID') == 18)
                              <a href="https://twitter.com/Adv_Cell_Lab" class="link">
                                @endif
                                <i class="ri-twitter-fill"></i>
                              </a>
                              @if(empty(config('services.PROFILE_ID')))
                                <a href="https://instagram.com/blazmacom" class="link">
                                  @elseif(config('services.PROFILE_ID') == 18)
                                    <a href="https://www.instagram.com/adv_cell_lab/" class="link">
                                      @endif
                                      <i class="fab fa-instagram "></i>
                                    </a>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-7">
            <div class="sec-form">
              <form class="form" method="post" action="/contact">
                <div class="twice">
                  <div class="form-group">
                    <input type="text" required name="name" class="form-control" placeholder="{{trans('web.name')}}">
                  </div>
                  <div class="form-group">
                    <input type="text" name="company_name" class="form-control" placeholder="{{trans('web.company_name')}}">
                  </div>
                </div>
                <div class="form-group">
                  <input type="email" required name="email" class="form-control" placeholder="{{trans('web.email')}}">
                </div>
                <div class="form-group">
                  <textarea class="form-control" required name="description" placeholder="{{trans('web.anything_else_know')}}" rows="5"></textarea>
                </div>

                <div class="twice">
                  <div class="form-group">
                    <button type="submit" @if(!empty($profile) && $profile->COLOR) style="background:{{$profile->COLOR}}" @endif class="btn send-contact-btn">
                      {{trans('web.send')}} <span class="icon">⟶</span>
                    </button>

                  </div>
                  <div class="form-group notes">
                    <p class="note">{{trans('web.pressing_the_button')}}</p>
                  </div>
                </div>
            </div>
            </form>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- End Form Section -->
    @include('still-have-question')
  </main>
@endsection