@extends('backend.master')

@section('title')
    {{ ___('common.Pricing Table 2') }}
@endsection

@section('content')

<div class="page-content">

    {{-- bradecrumb Area S t a r t --}}
    <div class="page-header">
        <div class="row">
            <div class="col-sm-6">
                <h4 class="bradecrumb-title mb-1">{{ ___('common.pricing_table') }}</h1>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="javascript:void(0)">{{ ___('common.home') }}</a></li>
                    <li class="breadcrumb-item">{{ ___('common.pricing_table') }}</li>
                </ol>
            </div>
            <div class="col-sm-6">
                <!-- Bookmark Start-->
                <div class="bookmark">
                    <ul>
                        <li><a href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-inbox"><polyline points="22 12 16 12 14 15 10 15 8 12 2 12"></polyline><path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z"></path></svg></a></li>
                        <li><a href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-message-square"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg></a></li>
                        <li><a href="javascript:void(0)" ><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-command"><path d="M18 3a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3H6a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3V6a3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3h12a3 3 0 0 0 3-3 3 3 0 0 0-3-3z"></path></svg></a></li>
                        <li><a href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-layers"><polygon points="12 2 2 7 12 12 22 7 12 2"></polygon><polyline points="2 17 12 22 22 17"></polyline><polyline points="2 12 12 17 22 12"></polyline></svg></a></li>
                        <li><a href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-star bookmark-search"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></a></li>
                    </ul>
                </div>
                <!-- Bookmark Ends-->
            </div>
        </div>
    </div>
    {{-- bradecrumb Area E n d --}}


    <div class="pricing-container">
        <div class="row justify-content-center">
            <div class="col-xl-7">
                    <div class="pricing-header d-flex flex-column justify-content-center align-items-center">
                    <p>{{ ___('common.simple_pricing_table') }}</p>
                    <h1>{{ ___('common.flexible_pricing_that_scales_with_your_business') }}</h1>

                    <div class="btn-switch-content">
                    <div class="btn-switch">
                        <input type="radio" id="active-switch" name="switch-one" value="active-switch" checked />
                        <label for="active-switch" class="active-switch">
                          {{ ___('common.monthly') }}
                        </label>
                        <input type="radio" id="unactive-switch" name="switch-one" value="unactive-switch" />
                        <label for="unactive-switch" class="unactive-switch">
                          {{ ___('common.yearly') }}
                        </label>
                    </div>
                    </div>
                </div>
            </div>
        </div>



      <div class="pricing-table-body">
        <div class="pricing-list">
          <ul>
            <li>
              <div class="top-box">
                <ul>
                  <li>
                    <h1>{{ ___('common.lite') }}</h1>
                  </li>
                  <li>
                    <p>{{ ___('common.hit_the_ground_running') }}</p>
                  </li>
                  <li>
                    <h2><span>£39</span>/Month</h2>
                  </li>
                  <li>
                    <div class="btn-container">
                      <button type="button" class="btn-pricing-list"><span>{{ ___('common.start_free_trail') }}</span></button>
                    </div>
                  </li>
                </ul>
              </div>
            </li>
            <li>
              <div class="facility-detail">
                <ul>
                  <li><i class="fa-regular fa-circle-check"></i>Sell on your own terms</li>
                  <li><i class="fa-regular fa-circle-check"></i>Website, marketing tools &
                    automations</li>
                  <li><i class="fa-regular fa-circle-check"></i>Bandwidth & storage is included</li>
                  <li><i class="fa-regular fa-circle-check"></i>We’ll get you onboarded</li>
                </ul>
              </div>
            </li>
          </ul>
        </div>

        <div class="pricing-list">
          <ul>
            <li>
              <div class="top-box">
                <ul>
                  <li>
                    <h1>{{ ___('common.basic') }}</h1>
                  </li>
                  <li>
                    <p>{{ ___('common.hit_the_ground_running') }}</p>
                  </li>
                  <li>
                    <h2><span>£69</span>/Month</h2>
                  </li>
                  <li>
                    <div class="btn-container">
                      <button type="button" class="btn-pricing-start"><span>{{ ___('common.get_started') }}</span></button>
                    </div>
                  </li>

                </ul>
              </div>
            </li>
            <li>
              <div class="facility-detail">
                <ul>
                  <li><i class="fa-regular fa-circle-check"></i>Sell on your own terms</li>
                  <li><i class="fa-regular fa-circle-check"></i>Website, marketing tools &
                    automations</li>
                  <li><i class="fa-regular fa-circle-check"></i>Bandwidth & storage is included</li>
                  <li><i class="fa-regular fa-circle-check"></i>We’ll get you onboarded</li>
                </ul>
              </div>
            </li>
          </ul>
        </div>

        <div class="pricing-list">
          <ul>
            <li>
              <div class="top-box">
                <ul>
                  <li>
                    <h1>{{ ___('common.plus') }}</h1>
                  </li>
                  <li>
                    <p>{{ ___('common.hit_the_ground_running') }}</p>
                  </li>
                  <li>
                    <h2><span>£59</span>/Month</h2>
                  </li>
                  <li>
                    <div class="btn-container">
                      <button type="button" class="btn-pricing-list"><span>{{ ___('common.talk_to_us') }}</span></button>
                    </div>
                  </li>
                </ul>
              </div>
            </li>
            <li>
              <div class="facility-detail">
                <ul>
                  <li><i class="fa-regular fa-circle-check"></i>Sell on your own terms</li>
                  <li><i class="fa-regular fa-circle-check"></i>Website, marketing tools &
                    automations</li>
                  <li><i class="fa-regular fa-circle-check"></i>Bandwidth & storage is included</li>
                  <li><i class="fa-regular fa-circle-check"></i>We’ll get you onboarded</li>
                </ul>
              </div>
            </li>
          </ul>
        </div>

      </div>

    </div>
  </div>

@endsection