@extends('site.master')

@section('title', $page->translation->meta_title)
@section('meta_description', $page->translation->meta_description)

@section('hero-body')
    @include('site.components.heroHeading', [
               'heroSubtitleClass' => 'c-hero__subtitle--small',
               'heroHeadingTitle' => ( !empty($page->translation->visual_name) ? $page->translation->visual_name : $page->translation->name),
               'heroHeadingSubTitle' => $page->translation->description,
           ])
@endsection

@section('content')

    @include('site.components.hero', ['modifiers' => ['tighter', 'light-bg']])

    <div class="c-body  c-body--static js-webinar-tabs create-plan__pricing-page">

        @include('site.components.pricingTabs')
        @include('site.components.pricingDropdown')

{{--        <div class="c-swap  u-margin-top-32">--}}
{{--            <button class="c-swap__button js-tab" data-tab="1">@lang('site/global.create_plan')</button>--}}
{{--            <button class="c-swap__button active js-tab" data-tab="0">@lang('site/global.select_package')</button>--}}
{{--        </div>--}}

{{--        <div class="l-grid  u-margin-bottom tab-container active" data-tab="0">--}}
{{--            <div>--}}
{{--                @include('site.components.pricing')--}}
{{--            </div>--}}
{{--        </div>--}}

        @if(isset($pricingProducts) && !empty($pricingProducts))
            <div class="l-grid u-margin-bottom u-margin-top-40">
                <div id="create-plan-vue" data-product-data='{{ json_encode($pricingProducts) }}'>
                    <create-plan></create-plan>
                </div>
            </div>
        @endif

        {{--        <div class="l-grid  o-block-bg">--}}
        {{--            <div>--}}
        {{--                @include('site.components.buttonRow', [--}}
        {{--                    'buttons' => [--}}
        {{--                        (object)[--}}
        {{--                            'text' => ($pricingLabels->compare_cta ?? 'Missing: compare_cta' ),--}}
        {{--                            'route' => '#compareTable',--}}
        {{--                            'class' => 'scroll-to-target',--}}
        {{--                            'dataIconDirection' => 'down',--}}
        {{--                            'sectionClasses' => 'hide-on-mobile',--}}
        {{--                            'modifiers' => ['icon'],--}}
        {{--                        ],--}}
        {{--                        (object)[--}}
        {{--                            'text' => ($pricingLabels->package_cta ?? 'Missing: package_cta' ),--}}
        {{--                            'route' => config('site.trailForm') . '?lang=' . app()->getLocale(),--}}
        {{--                            'class' => '',--}}
        {{--                            'dataIconDirection' => '',--}}
        {{--                            'preventBlank' => true,--}}
        {{--                            'modifiers' => ['large', 'icon'],--}}
        {{--                        ],--}}
        {{--                    ]--}}
        {{--                ])--}}
        {{--            </div>--}}
        {{--        </div>--}}

        {{--        <div class="l-grid  o-block">--}}
        {{--            <div>--}}
        {{--                @include('site.components.compareTable')--}}
        {{--            </div>--}}
        {{--        </div>--}}

        @include('site.organisms.components')

    </div>

@endsection
<script type="text/javascript">
    window.rentman = window.rentman || {};
    window.rentman.translations = <?php echo json_encode(\App\Komma\PricingLabels\PricingLabelComposer::getVueTranslations(), 15, 512) ?>;
</script>
<script defer type="text/javascript" src="{{ mix('js/site/createPlan.js') }}"></script>