<div class="flex-fill">
    <div class="container py-6">
        @include('include.message')
        <div class="row align-items-center">
            <div class="col-12 col-md-5 offset-md-1 text-center text-md-left">
                <h2 class="mb-3 d-inline-block title-bold">{{ __('Simple, transparent pricing') }}</h2>
                <div class="m-auto">
                    <p class="text-muted font-weight-normal font-size-lg">
                        {{ __('Choose a plan that works best for you') }}
                    </p>
                </div>
            </div>
            <div class="col-12 col-md-5 col-md-offset-1 text-center text-md-right">
                <div class="btn-group btn-group-toggle" data-toggle="buttons">
                    <label class="btn btn-outline-primary active" id="plan-month">
                        <input type="radio" name="options" autocomplete="off" checked>{{ __('Monthly') }}
                    </label>
                    <label class="btn btn-outline-primary" id="plan-year">
                        <input type="radio" name="options" autocomplete="off">{{ __('Yearly') }}
                    </label>
                </div>
            </div>
        </div>

        <div class="row flex-column-reverse flex-md-row justify-content-center">
            @foreach ($plans as $plan)
                <div class="col-12 col-md-4 pt-4">
                    <div class="card border-0 shadow-sm rounded h-100 overflow-hidden plan text-center">
                        <div class="card-header">
                            <h5>{{ $plan->name }}</h5>
                        </div>
                        <div class="card-body p-4 d-flex flex-column">
                            @if ($plan->amount_month * 12 > $plan->amount_year)
                                <div class="plan-year d-none">
                                    <div class="ribbon-wrapper ribbon-lg">
                                        <div class="ribbon bg-primary">
                                            {{ __('Save :value%', ['value' => number_format((($plan->amount_month * 12 - $plan->amount_year) / ($plan->amount_month * 12)) * 100, 0)]) }}
                                        </div>
                                    </div>
                                </div>
                            @endif
                            <div class="my-2">
                                @if ($plan->hasPrice())
                                    <div class="plan-preload plan-month d-none d-block">
                                        <div class="h1 mb-1">
                                            <span class="font-weight-bold">
                                                {{ formatMoney($plan->amount_month, $plan->currency) }}
                                            </span>
                                            <span class="pricing-plan-price text-muted">
                                                {{ $plan->currency }}
                                            </span>
                                        </div>
                                    </div>

                                    <div class="plan-year d-none">
                                        <div class="h1 mb-1">
                                            <span class="font-weight-bold">
                                                {{ formatMoney($plan->amount_year, $plan->currency) }}
                                            </span>
                                            <span class="pricing-plan-price text-muted">
                                                {{ $plan->currency }}
                                            </span>
                                        </div>
                                    </div>
                                @else
                                    <div class="plan-preload plan-month d-none d-block">
                                        <h1 class="mb-1">
                                            <span class="font-weight-bold text-uppercase">
                                                {{ __('Free') }}
                                            </span>
                                        </h1>
                                    </div>

                                    <div class="plan-year d-none">
                                        <h1 class="mb-1">
                                            <span class="font-weight-bold text-uppercase">
                                                {{ __('Free') }}
                                            </span>
                                        </h1>
                                    </div>
                                @endif
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        {{ __('Audio Chat') }}
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        {{ __('Video Chat') }}
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->text_chat) no-feature @endif">{{ __('Text Chat') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->screen_share) no-feature @endif">{{ __('Screen Sharing') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->file_share) no-feature @endif">{{ __('File Sharing') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->whiteboard) no-feature @endif">{{ __('Whiteboard') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->hand_raise) no-feature @endif">{{ __('Hand Raise') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->recording) no-feature @endif">{{ __('Recording') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        <span
                                            class="@if (!$plan->features->chatgpt) no-feature @endif">{{ __('ChatGPT') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        {!! '<b>' .
                                            ($plan->features->time_limit == -1 ? __('Unlimited') : __('Up to') . $plan->features->time_limit) .
                                            '</b>' .
                                            __('minutes') !!}
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        {!! '<b>' .
                                            ($plan->features->meeting_no == -1 ? __('Unlimited') : $plan->features->meeting_no) .
                                            '</b> ' .
                                            __('Meetings') !!}
                                    </div>
                                </div>
                            </div>

                            <div class="mb-2">
                                <div class="row py-2">
                                    <div class="col">
                                        {!! '<b>' .
                                            ($plan->features->user_limit == -1 ? __('Unlimited') : $plan->features->user_limit) .
                                            '</b> ' .
                                            __('Users') !!}
                                    </div>
                                </div>
                            </div>

                            <div class="plan-footer d-flex align-items-end mt-auto">
                                <div class="z-1 w-100">
                                    @auth
                                        @if ($plan->hasPrice() && count(paymentGateways()) != 0)
                                            @if (isset(getAuthUserInfo('plan')->id) &&
                                                    getAuthUserInfo('plan')->id == $plan->id &&
                                                    getAuthUserInfo('plan_recurring_at') != null)
                                                <div class="btn btn-primary btn-block text-uppercase py-2 disabled">
                                                    {{ __('Active') }}
                                                </div>
                                            @else
                                                <div class="plan-no-animation plan-month d-none d-block">
                                                    <a href="{{ route('checkout.index', ['id' => $plan->id, 'interval' => 'month']) }}"
                                                        class="btn btn-primary btn-block text-uppercase py-2">
                                                        {{ __('Subscribe') }}
                                                    </a>
                                                </div>
                                                <div class="plan-no-animation plan-year d-none">
                                                    <a href="{{ route('checkout.index', ['id' => $plan->id, 'interval' => 'year']) }}"
                                                        class="btn btn-primary btn-block text-uppercase py-2">
                                                        {{ __('Subscribe') }}
                                                    </a>
                                                </div>
                                            @endif
                                        @else
                                            <div class="btn btn-primary btn-block text-uppercase py-2 disabled">
                                                {{ __('Free') }}
                                            </div>
                                        @endif
                                    @else
                                        <div class="plan-no-animation plan-month d-none d-block">
                                            <a href="{{ route('register', ['plan' => $plan->id, 'interval' => 'month']) }}"
                                                class="btn btn-primary btn-block text-uppercase py-2">{{ __('Register') }}</a>
                                        </div>
                                        <div class="plan-no-animation plan-year d-none">
                                            <a href="{{ route('register', ['plan' => $plan->id, 'interval' => 'year']) }}"
                                                class="btn btn-primary btn-block text-uppercase py-2">{{ __('Register') }}</a>
                                        </div>
                                    @endauth
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</div>
