@php
    $captcha = rand(1000, 9999);
    session(['captcha' => $captcha]);
@endphp
@extends('layout.mainlayout')
{{--<style>
* {
    direction: ltr;
    text-align: left;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: system-ui;
}
.breadcrumbs-sec {
    padding: 2rem 0;
    border-bottom: 1px solid #DADADA;
    text-align: center;
}
.breadcrumbs-sec .page-title {
    font-size: 2rem;
    font-family: system-ui;
    margin-bottom: 1rem;
    text-align:center;
}
.breadcrumbs-sec .icon {
    color: #242D3C;
    font-size: 1.3rem;
}

.details-sec .single-detail .box-title {
    color: #242D3C;
    font-size: 1.2rem;
    font-family: system-ui;
    margin-bottom: 1rem;
    font-weight: 700;
}
.details-sec .single-detail .box-desc {
    font-size: .9rem;
    margin-bottom: 0.5rem;
}
.single-detail .box-desc .desc-title {
    color: #242D3C;
}
.form-sec {
    padding: 5rem 0;
    background-color: #FAFAFC;
}
.form-sec .subtitle {
    text-transform: uppercase;
    font-size: .9rem;
    margin-bottom: 0;
    color: #7C818A;
}
.sec-content .sec-title {
        font-family: system-ui;

    font-size: 2.2rem;
    color: #242D3C;
    margin-bottom: 1.5rem;
}
.sec-title .pink {
    color: var(--blazma-text);
}
.form-sec .sec-title * {
    font-size: 2.2rem;
        font-family: system-ui;

    line-height: 1.5;
    margin-bottom: 2.5rem;
}
.social-links {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 2rem;
}
.sec-form .form {
    max-width: 800px;
    margin: 0 auto;
}
.sec-form .form .twice {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sec-form .form input, .sec-form .form textarea {
    padding: .1rem 1rem;
}
.contacts .form .form-group {
    margin-bottom: 1.2rem;
}
.form .twice .form-group:first-child {
    margin-right: 2%;
}
.form .twice .form-group {
    width: 49%;
}
.contacts .form .form-group {
    margin-bottom: 1.2rem;
}
.form .send-btn {
    background: linear-gradient(140.37deg, var(--blazma-pastel) -59.16%, var(--blazma-primary) 49.95%);
    color: #fff;
    border-radius: 2rem;
    padding: 0.4rem 1.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}
.form .send-btn .icon {
    margin-left: 0.7rem;
}
.form .twice .form-group {
    width: 49%;
}
.form-group .note {
    max-width: 100%;
    font-size: 0.7rem;
    margin-bottom: 0;
    padding-left: 115px;
}
.form-group .form-control {
    border: 1px solid #DADADA;
    border-radius: 2rem;
    font-size: 1rem;
    width: 100%;
    background-color: transparent;
    padding: 0.5rem 1rem;
}

.form-group textarea.form-control {
    max-width: 100%;
    height: 130px;
    resize: none;
    border-radius: 1rem;
}
.social-links .link {
    color: #242D3C;
    font-size: 1.5rem;
    margin: 0 0.5rem;
    text-decoration: none;
}
@media (max-width: 991px) {
    .form-group .note {
    max-width: 100%;
    font-size: 0.7rem;
    margin-bottom: 0;
    padding-left: 0px;
}
.form .twice .form-group {
    width: 100%;
}
}

</style>--}}
@section('content')

                    <section class="new-sec breadcrumbs-sec">
                        <div class="container" style="text-align: center;">
                        <h3 class="page-title">{{trans('web.contact_us')}}</h3>
                        <i class="fa fa-angle-down icon"></i>

                        </div>
                    </section>
                    @if(!empty($msg))
                    <section>
                        <div class="row">
                            <div class="col-12">
                            <p class=" alert alert-success text-center">{{$msg}}</p>
                            </div>
                        </div>
                    </section>
                    @endif
                    @if(!empty($errors))
                    <section>
                        <div class="row">
                            <div class="col-12">
                                @foreach($errors as $error)
                                    <p class=" alert alert-danger text-center">{{$error}}</p>
                                @endforeach
                            </div>
                        </div>
                    </section>
                    @endif

                    <section class="new-sec details-sec">
                    @if(empty(config('services.PROFILE_ID')))
                    <div class="banner d-flex align-items-center">

                      <div class="map">
                      </div>

      <div class="row flex flex-column right">
              <div class="single-detail">
                <h3 class="box-title">{{trans('web.get_in_touch')}}</h3>
                @if(empty(config('services.PROFILE_ID')))
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> support@blazma.com</p>
                @elseif(config('services.PROFILE_ID') == 18)
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@acl.com.sa</p>
                @elseif(config('services.PROFILE_ID') == 43)
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@raidx.com</p>
                  @elseif(config('services.PROFILE_ID') == 44)
                      <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@clab.sa</p>

                  @endif
              </div>
              <div class="single-detail">
                <h3 class="box-title">{{trans('web.work_with_us')}}</h3>
                @if(empty(config('services.PROFILE_ID')))
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> support@blazma.com</p>
                @elseif(config('services.PROFILE_ID') == 18)
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@acl.com.sa</p>
                @elseif(config('services.PROFILE_ID') == 43)
                <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@raidx.com</p>
                  @elseif(config('services.PROFILE_ID') == 44)
                      <p class="box-desc"><span class="desc-title">{{trans('web.support')}}:</span> info@clab.sa</p>
                @endif
              </div>
              <div class="single-detail">
                <h3 class="box-title">{{trans('web.offices')}}</h3>
                @if(empty(config('services.PROFILE_ID')))
                <p class="box-desc">7 Neenawa Street, 4th Cir. Governorate, Amman Jordan</p>
                <p class="box-desc">Anas Ibn Malik Rd, As Sahafah, Riyadh 13321, Saudi Arabia</p>
                @elseif(config('services.PROFILE_ID') == 18)
                <p class="box-desc">Prince Muhammad Ibn Abd Al Aziz, As Sulimaniyah, Riyadh 12223, Saudi Arabia</p>
                @elseif(config('services.PROFILE_ID') == 43)
                <p class="box-desc">Yanbouh, Dhahrat Laban, Riyadh 13784</p>
                  @elseif(config('services.PROFILE_ID') == 44)
                      <p class="box-desc">Al Janadriyyah ,Riyadh , Khurais Road</p>
                @endif
              </div>
            </div>
          </div>
                    @endif
                    </div>
                    </section>

      <section class="new-sec form-sec contacts">
        <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" @if(!empty($profile) && $profile->COLOR) style="color:{{$profile->COLOR}}" @endif>{{trans('web.get_started')}}!</span></h3>
                @if(!empty($profile))
                <p class="sec-desc">{{!empty(app('translator')->getLocale()) && app('translator')->getLocale() == "en" ? $profile->FOOTER_DESC_EN : $profile->FOOTER_DESC_AR}}</p>
                @else
                <p class="sec-desc">{{trans('web.find_out')}}</p>
                @endif
                <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="form-group" style="display: flex; justify-content: center;">
                    <div class="g-recaptcha" data-sitekey="6Le_lR4rAAAAAFCgx7Fc5E6_aDG_zTJW_eqlkMiG"></div>
                    </div>
                       <div class="form-group notes" style="display: flex; justify-content: center;">
                           <p class="note">{{trans('web.pressing_the_button')}}</p>
                       </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">--}}
{{--                    </div>--}}
                    </div>
                  </div>
                </form>
              </div>
            </div>
          </div>


                </div>
                </section>
   @endsection
   <script>
if ( window.history.replaceState ) {
  window.history.replaceState( null, null, window.location.href );
}
</script>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>