@extends('frontend.layouts.app')

@section('title', app_name() . ' | ' . __('navs.general.home'))

@section('content')
    <div class="row justify-content-center align-items-center"
         style="padding-bottom: 20px;  margin-top: 50px;  text-align: center;">
        <p class="g_et_al_header1 contact_title">Subscription plans and pricing</p>
        <!--col-->
    </div><!--row-->
    <div class="subscription_container">
        <div class="row">
            <div class="col-sm-6 col-md-6 col-lg-3">
                <div class="pricing_col">
                    <div class="pricing_title">
                        Free
                    </div>
                    <div class="price_amount">
                        ${{__('strings.frontend.pricing_labels.free.price')}}
                    </div>
                    <div class="plan_benefits">
                        {!!__('strings.frontend.pricing_labels.free.tagline_1')!!}
                    </div>
                    <div class="plan_features">{!!__('strings.frontend.pricing_labels.free.tagline_2')!!}</div>

                    <ul class="plan_lists">
                        {!!__('strings.frontend.pricing_labels.free.feature_list')!!}
                    </ul>
                    <a href="{{route('frontend.auth.register')}}" class="btn signup-btn">Sign Up</a>
                </div>
            </div>
            <div class="col-sm-6 col-md-6 col-lg-3">
                <div class="pricing_col">
                    <div class="pricing_title">Student
                    </div>
                    <div class="price_amount">
                        ${{__('strings.frontend.pricing_labels.student.price')}}
                    </div>
                    <div class="plan_benefits">
                        {!!__('strings.frontend.pricing_labels.student.tagline_1')!!}
                    </div>
                    <div class="plan_features">{!!__('strings.frontend.pricing_labels.student.tagline_2')!!}</div>

                    <ul class="plan_lists">
                        {!!__('strings.frontend.pricing_labels.student.feature_list')!!}
                    </ul>
                    <a href="{{route('frontend.auth.register')}}" class="btn signup-btn">Sign Up</a>
                </div>
            </div>
            <div class="col-sm-6 col-md-6 col-lg-3">
                <div class="pricing_col">
                    <div class="pricing_title">
                        Researcher
                    </div>
                    <div class="price_amount">
                        ${{__('strings.frontend.pricing_labels.researcher.price')}}
                    </div>
                    <div class="plan_benefits">
                        {!! __('strings.frontend.pricing_labels.researcher.tagline_1')!!}
                    </div>
                    <div class="plan_features">{!!__('strings.frontend.pricing_labels.researcher.tagline_2')!!}</div>

                    <ul class="plan_lists">
                        {!!__('strings.frontend.pricing_labels.researcher.feature_list')!!}
                    </ul>
                    <a href="{{route('frontend.auth.register')}}" class="btn signup-btn">Sign Up</a>
                </div>
            </div>
            <div class="col-sm-6 col-md-6 col-lg-3">
                <div class="pricing_col">
                    <div class="pricing_title">
                        Lab
                    </div>
                    <div class="price_amount">
                        ${{__('strings.frontend.pricing_labels.lab.price')}}
                    </div>
                    <div class="plan_benefits">
                        {!!__('strings.frontend.pricing_labels.lab.tagline_1')!!}
                    </div>
                    <div class="plan_features">{!!__('strings.frontend.pricing_labels.lab.tagline_2')!!}</div>

                    <ul class="plan_lists">
                        {!!__('strings.frontend.pricing_labels.lab.feature_list')!!}
                    </ul>
                    <a href="{{route('frontend.auth.register')}}" class="btn signup-btn">Sign Up</a>
                </div>
            </div>

        </div>
        <div class="row col-md-12" style="">
            <p class="terms_para">
                <a href="#" style="display: inline-block; z-index: 99999999999999999999; position: relative;"
                   data-toggle="modal" data-target="#disclaimer">Terms and
                    conditions</a>
            </p>
        </div>
    </div>

@endsection

@section('dialogs')


    <div id="disclaimer" class="modal fade" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="additemtitle">Terms and conditions</h4>

                </div>
                <div class="modal-body">


                </div>
            </div>
        </div>
    </div>
@endsection