@extends('site.layouts.master')

@section('title', 'Select Server Base on your Package')
@section('description', env('APP_NAME').' system allows you to send spoof SMS messages , use wallet and submit the PDF. You can access these services base on our package')

@section('content')
        <div id="content" class="pt-3 pt-sm-4 pt-md-0">
        <div class="breadcrum">
            <div class="bg-img pb-0">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-6 p-3 p-md-5 d-flex flex-column justify-content-center">
                            @if(in_array('SMS',$services))
                                <div
                                    class="pricing-item bg-line-dark p-3 px-4 px-sm-5 bora-20 d-flex align-items-center gap-3">
                                    <div>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="5em" height="5em"
                                             viewBox="0 0 48 48">
                                            <path fill="none" stroke="#ffffff80" stroke-linecap="round"
                                                  stroke-linejoin="round"
                                                  d="M12.335 14.005h23.128m-23.128 6.292h16.027m-16.027 6.291h8.926M38.858 5.5H9.142c-2.2 0-4 1.8-4 4v33l7.418-7.418h26.298c2.2 0 4-1.8 4-4V9.5c0-2.2-1.8-4-4-4"/>
                                        </svg>
                                    </div>
                                    <a class="button button-blue-hover text-white text-button w-100"
                                       href="{{route('send-sms')}}">
                                        <span> <span></span></span><span class="bg-blue w-100 justify-content-center">Go to SMS</span>
                                    </a>
                                </div>
                            @endif
                            @if(in_array('PDF',$services))
                                <div
                                    class="pricing-item bg-line-dark p-3 px-4 px-sm-5 bora-20 d-flex align-items-center gap-3 mt-3">
                                    <div>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="5em" height="5em"
                                             viewBox="0 0 24 24">
                                            <path fill="#ffffff80"
                                                  d="M8.267 14.68c-.184 0-.308.018-.372.036v1.178c.076.018.171.023.302.023c.479 0 .774-.242.774-.651c0-.366-.254-.586-.704-.586m3.487.012c-.2 0-.33.018-.407.036v2.61c.077.018.201.018.313.018c.817.006 1.349-.444 1.349-1.396c.006-.83-.479-1.268-1.255-1.268"/>
                                            <path fill="#ffffff80"
                                                  d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zM9.498 16.19c-.309.29-.765.42-1.296.42a2 2 0 0 1-.308-.018v1.426H7v-3.936A7.6 7.6 0 0 1 8.219 14c.557 0 .953.106 1.22.319c.254.202.426.533.426.923c-.001.392-.131.723-.367.948m3.807 1.355c-.42.349-1.059.515-1.84.515c-.468 0-.799-.03-1.024-.06v-3.917A8 8 0 0 1 11.66 14c.757 0 1.249.136 1.633.426c.415.308.675.799.675 1.504c0 .763-.279 1.29-.663 1.615M17 14.77h-1.532v.911H16.9v.734h-1.432v1.604h-.906V14.03H17zM14 9h-1V4l5 5z"/>
                                        </svg>
                                    </div>
                                    <a class="button button-blue-hover text-white text-button w-100"
                                       href="{{route('select-pdf')}}">
                                        <span> <span></span></span><span class="bg-blue w-100 justify-content-center">Go to PDF</span>
                                    </a>
                                </div>
                            @endif
                            @if(in_array('Wallet',$services))
                                <div
                                    class="pricing-item bg-line-dark p-3 px-4 px-sm-5 bora-20 d-flex align-items-center gap-3 mt-3">
                                    <div>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="5em" height="5em"
                                             viewBox="0 0 24 24">
                                            <g fill="none" stroke="#ffffff80" stroke-width="1.5">
                                                <path
                                                    d="M19 20H5a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2Z"/>
                                                <path fill="#ffffff80" stroke-linecap="round" stroke-linejoin="round"
                                                      d="M16.5 14a.5.5 0 1 1 0-1a.5.5 0 0 1 0 1"/>
                                                <path
                                                    d="M18 7V5.603a2 2 0 0 0-2.515-1.932l-11 2.933A2 2 0 0 0 3 8.537V9"/>
                                            </g>
                                        </svg>
                                    </div>
                                    <a class="button button-blue-hover text-white text-button w-100"
                                       href="{{route('wallet/dashboard')}}">
                                        <span> <span></span></span><span class="bg-blue w-100 justify-content-center">Go to Wallet</span>
                                    </a>
                                </div>
                            @endif
                        </div>
                        <div class="col-lg-6 bg-dark p-3 p-md-5">
                            <div class="pricing-item bg-line-dark p-40 bora-20">
                                <h1 class="heading5 text-white">{{$package->name}}</h1>
                                <h2 class="body3 text-placehover mt-12">{{$package->remarks}}</h2>
                                <div class="price d-flex mt-3">
                                    <h3 class="heading2 text-white">${{$package->price}}</h3>
                                    <h4 class="heading3 text-white">/per month</h4>
                                </div>
                                <div class="list-feature d-flex flex-column gap-12 mt-3">
                                    <div class="item flex-item-center gap-16">
                                        <i class="ph fs-12 text-white p-8 bora-50 {{in_array('SMS',$services) ? 'bg-purple ph-check' : 'bg-secondary ph-x'}}"></i>
                                        <div
                                            class="feature {{in_array('SMS',$services) ? 'text-white' : 'text-placehover'}}">
                                            SMS Service
                                        </div>
                                    </div>
                                    <div class="item flex-item-center gap-16">
                                        <i class="ph fs-12 text-white p-8 bora-50 {{in_array('PDF',$services) ? 'bg-purple ph-check' : 'bg-secondary ph-x'}}"></i>
                                        <div
                                            class="feature {{in_array('PDF',$services) ? 'text-white' : 'text-placehover'}}">
                                            PDF Service
                                        </div>
                                    </div>
                                    <div class="item flex-item-center gap-16">
                                        <i class="ph fs-12 text-white p-8 bora-50 {{in_array('Wallet',$services) ? 'bg-purple ph-check' : 'bg-secondary ph-x'}}"></i>
                                        <div
                                            class="feature {{in_array('Wallet',$services) ? 'text-white' : 'text-placehover'}}">
                                            Wallet Service
                                        </div>
                                    </div>
                                </div>
                                <form id="create_invoice">
                                    <input type="hidden" value="{{$package->price}}" id="amount">
                                    <input type="hidden" value="{{$package->id}}" id="package_id">
                                    <div class="body3 text-placehover mt-12"><span
                                            class="text-danger fw-bold">Note: </span>At the end of the month, this
                                        package will expire.
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="visually-hidden p-0 m-0">


        <p>{{$package->name}}e</p>
        <p>Select Server Base on your Package</p>
        <p>system allows you to send spoof SMS messages , use wallet and submit the PDF. You can access these services
            base on our package</p>
        <p>Our system offers a range of services, allowing you to send spoof SMS messages, manage your wallet, and
            submit PDFs with ease</p>
        <p>Access to these features is based on the package you choose, ensuring that you have the right tools to meet
            your needs. Whether you're looking for SMS customization, secure wallet management, or efficient PDF
            submissions, our flexible packages provide tailored solutions to enhance your experience.</p>
    </div>
@endsection