@extends('landing.layouts.app')
@section('title')
    {{__('messages.subscription_plans.payment_type')}}
@endsection
@section('page_css')
    {{--    <link href="{{asset('assets/css/landing/landing.css')}}" rel="stylesheet" type="text/css"/>--}}
    <link rel="stylesheet" href="{{ asset('web_front/css/selectize.min.css') }}">
    <link href="{{ mix('assets/css/selectize-input.css') }}" rel="stylesheet" type="text/css"/>
{{--    <link href="{{mix('landing_front/css/choose-plan.css')}}" rel="stylesheet" type="text/css">--}}
    <link href="{{ asset('landing_front/css/jquery.toast.min.css') }}" rel="stylesheet" type="text/css"/>
@endsection
@section('content')

    @php
        $cpData = getCurrentPlanDetails();
        $planText = ($cpData['isExpired']) ? __('messages.new_change.current_expired_plan')  :  __('messages.new_change.current_plan') ;
        $currentPlan = $cpData['currentPlan'];
        $getCurrentPlanAdminCurrencySymbol = getAdminCurrencySymbol($currentPlan->currency);
    @endphp

    <div class="choose-payment-plan-page">
        <!-- start pchoose-payment-plan section -->
        <section class="py-100">
            <div class="container">
                @include('flash::message')
                <div class="row justify-content-center">
                    @if(currentActiveSubscription()->ends_at >= \Carbon\Carbon::now())
                        <div class="col-xxl-5 col-lg-6 mb-4">
                            <div class="card plan-card-detail h-100 card-xxl-stretch mx-lg-2">
                                <div class="card-header border-0 px-0 bg-transparent">
                                    <h3 class="card-title align-items-start flex-column">
                                        <span class="fw-bolder text-primary fs-3">{{$planText}}</span>
                                    </h3>
                                    <hr>
                                </div>
                                <div class="card-body p-0">
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 fw-bolder">{{ __('messages.subscription_plans.plan_name') }}</h4>
                                        <span class="fs-5 w-50 text-muted">{{$cpData['name']}}</span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.plan_price') }}</h4>
                                        <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">
                                          {{ $getCurrentPlanAdminCurrencySymbol }}
                                        </span>
                                        {{ number_format($currentPlan->price) }}
                                    </span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.start_date') }}</h4>
                                        <span class="fs-5 w-50 text-muted">{{$cpData['startAt']}}</span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.end_date') }}</h4>
                                        <span class="fs-5 w-50 text-muted">{{$cpData['endsAt']}}</span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.used_days') }}</h4>
                                        <span class="fs-5 w-50 text-muted">{{$cpData['usedDays']}} {{ __('messages.prescription.days') }}</span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.remaining_days') }}</h4>
                                        <span class="fs-5 w-50 text-muted">{{$cpData['remainingDays']}} {{ __('messages.prescription.days') }}</span>
                                    </div>
                                    <div class="d-flex align-items-center py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.used_balance') }}</h4>
                                        <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">
                                        {{ $getCurrentPlanAdminCurrencySymbol }}
                                        </span>
                                        {{$cpData['usedBalance']}}
                                    </span>
                                    </div>
                                    <div class="d-flex align-items-center plan-border-bottom py-2">
                                        <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.remaining_balance') }}</h4>
                                        <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">{{ $getCurrentPlanAdminCurrencySymbol }}</span>
                                              {{$cpData['remainingBalance']}}
                                    </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                    @php
                        $newPlan = getProratedPlanData($subscriptionsPricingPlan->id);
                        $getSubscriptionPlanAdminCurrencySymbol = getAdminCurrencySymbol($subscriptionsPricingPlan->currency);
                    @endphp
                    <div class="col-xxl-5 col-lg-6 mb-4">
                        <div class="card plan-card-detail h-100 card-xxl-stretch mx-lg-2">
                            <div class="card-header border-0 px-0 bg-transparent">
                                <h3 class="card-title align-items-start flex-column">
                                    <span class="fw-bolder text-primary fs-3">{{ __('messages.new_change.new_plan') }}</span>
                                </h3>
                                <hr>
                            </div>
                            <div class="card-body p-0">
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 fw-bolder">{{ __('messages.subscription_plans.plan_name') }}</h4>
                                    <span class="fs-5 w-50 text-muted">{{$newPlan['name']}}</span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.plan_price') }}</h4>
                                    <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">
                                           {{ $getSubscriptionPlanAdminCurrencySymbol }}
                                        </span>
                                     {{ number_format($subscriptionsPricingPlan->price) }}
                                    </span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.start_date') }}</h4>
                                    <span class="fs-5 w-50 text-muted">{{ $newPlan['startDate'] }}</span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.subscription_plans.end_date') }}</h4>
                                    <span class="fs-5 w-50 text-muted">{{$newPlan['endDate']}}</span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.bill.total_days') }}</h4>
                                    <span class="fs-5 w-50 text-muted">{{$newPlan['totalDays']}} {{ __('messages.prescription.days') }}</span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.pre_plan')}}</h4>
                                    <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">
                                              {{ $getSubscriptionPlanAdminCurrencySymbol }}
                                        </span>
                                         {{$newPlan['remainingBalance']}}
                                    </span>
                                </div>
                                <div class="d-flex align-items-center py-2">
                                    <h4 class="fs-5 w-50 mb-0 me-3 text-gray-800 fw-bolder">{{ __('messages.new_change.payable_amount')}}</h4>
                                    <span class="fs-5 w-50 text-muted">
                                        <span class="mb-2">
                                           {{ $getSubscriptionPlanAdminCurrencySymbol }}
                                        </span>
                                       {{$newPlan['amountToPay']}}
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>