@extends('layouts.B2C')

@push('styles')
@vite('resources/assets/slick/slick.css')
@vite('resources/assets/slick/slick-theme.css')
@endpush

@section('content')
<div class="wrapper_subscribe_b2b wrapper_subscribe_v2">

    @if (
    $bOnBoardComplete &&
    isset($anyFakeCoupon) &&
    !empty($anyFakeCoupon) &&
    isset($showPercentage) &&
    $showPercentage > 0)
    <div class="wrap_exclusive_discount">
        <div class="wrap_flex">
            <span>今すぐ購入して、限定の {{ $showPercentage }}% ウェブ割引をゲットしよう</span>
            <h2 id="timer"></h2>
        </div>
    </div>
    @endif

    <div class="wrapper_partner_header">
        <header class="header">
            <div class="header_logo">
                <a class="disable_redirecting" href="javascript:void(0);">
                    <img src="{{ Vite::asset('resources/images/logo-loading-page.png') }}" alt="image" />
                </a>
            </div>
        </header>
    </div>

    <div class="program_selection_wrap_txt">
        <section class="coupon_wrap" id="coupon_success">
            <div class="wrap_coupon_success">
                <div class="oops_text">
                    <p id="coupon_message"></p>
                </div>
                <button class="error__btn_cancel">
                    <figure>
                        <img src="{{ Vite::asset('resources/images/web/error_cross.png') }}" alt="image" />
                    </figure>
                </button>
            </div>
        </section>

        <section class="coupon_wrap payment_failed" id="coupon_failed">
            <div class="wrap_coupon_success">
                <div class="oops_text" id="error_failed"></div>
                <button class="error__btn_cancel">
                    <figure>
                        <img src="{{ Vite::asset('resources/images/web/error_cross.png') }}" alt="image" />
                    </figure>
                </button>
            </div>
        </section>

        <section class="error_wrap" id="payment_error">
            <div class="wrap_payment_error">
                <div class="oops_text">
                    <p><b>おっと！支払いに失敗しました。もう一度お試しください！</b></p>
                    <p>問題やご不明点があれば、hello@quitsure.appまでご連絡ください。</p>
                </div>
                <button class="error__btn_cancel">
                    <figure>
                        <img src="{{ Vite::asset('resources/images/web/error_cross.png') }}" alt="image" />
                    </figure>
                </button>
            </div>
        </section>


        <section class="wrap_smoking_pattern">
            <div class="container">
                <h3>あなたと同じ喫煙の思考パターンを持つユーザーは、全体の<span>{{ $smokingThoughtPattern ?? '' }}% </span> います。
                </h3>
                <div class="wrap_flex">
                    <div class="wrap_left">
                        <p>彼らの成功データに基づくと、あなたもわずか <span>6日間で完全に無煙になると予測しています。</span></p>
                        <p class="font_light">さらに：</p>
                        <ul>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>渇望 92％ 減少</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>禁断症状 85％ 減少</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>気分の波やイライラはほぼ無し</span>
                            </li>
                        </ul>
                    </div>
                    <div class="wrap_right">
                        <div class="banner_graph_image {{ $graphType == 'cigarettes' ? 'has_number' : '' }}">
                            <div class="wrap_dynamic_data_ul">
                                <p>{{ $graphType == 'cigarettes' ? '吸ったタバコ本数' : '渇望' }}</p>
                            </div>
                            <div class="wrap_days_txt">
                                <div class="wrap_ul_img">
                                    @if ($graphType == 'cigarettes')
                                    <ul>
                                        @if ($yAxis)
                                        @foreach ($yAxis as $axis)
                                        <li>{{ $axis }}</li>
                                        @endforeach
                                        @endif
                                        <li>0</li>
                                    </ul>
                                    @else
                                    <ul>
                                        @for ($i = 1; $i <= 6; $i++)
                                            <li>
                                            </li>
                                            @endfor
                                    </ul>
                                    @endif
                                    <img src="{{ Vite::asset('resources/images/base-graph.png') }}">
                                </div>
                                <p>日数</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section class="wrap_programe_ready">
            <div class="container">
                <div class="wrap_flex">
                    <div class="wrap_left">
                        <h3>あなたのプログラムの準備ができました！</h3>
                        <p>あなたが得られるもの </p>
                        <ul>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>6日間の完全な変身プログラム</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>シンプルな語り口で進む、インタラクティブな日別モジュール</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>喫煙欲求を取り除くための没入型エクササイズ</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>専門コーチによる24時間365日のチャットサポート</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>毎日の進捗が見える喫煙トラッカー</span>
                            </li>
                            <li>
                                <img src="{{ Vite::asset('resources/images/chekmark.svg') }}" alt="image" />
                                <span>無煙を長期維持するための強力なアフターケアツールキット</span>
                            </li>
                        </ul>
                    </div>
                    <div class="wrap_right">
                        <section class="wrap_chose_right_program" id="programSelection1">
                            <div class="wrap_txt">
                                <span>アクセスをアンロックしよう</span>
                                <p>自分に合ったプログラムを選択</p>
                            </div>

                            <div class="select_program" id="programSection1">
                                <div class="_card selected_program" id="videoProgram"
                                    data-program="{{ $video['iProgramID'] }}" data-currency="{{ $video['Currency'] }}"
                                    data-amount="{{ $video['Price'] }}" data-select="2"
                                    data-couponId="{{ $video['CouponId'] }}"
                                    data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                                    data-substatus="{{ $video['SubStatus'] }}" data-section="1"
                                    data-fakeoffer="{{ $video['fakeCoupon'] ? 1 : 0 }}"
                                    data-promocode="{{ $video['CouponCode'] }}"
                                    data-firstcrossprice="{{ $video['FirstCrossPrice'] }}"
                                    data-secondprice="{{ $video['CrossPrice'] }}"
                                    data-secondcurrency="{{ $video['CancelCurrency'] }}"
                                    data-currencysymbol="{{ $video['currencySymbol'] }}">

                                    <p class="head">英語（ビデオ）プログラム</p>
                                    <span class="gray">{{ $video['vDescription'] }}</span>
                                    @if (!$video['SubStatus'])
                                    <span>
                                        <del>{{ $video['currencySymbol'] . $video['FirstCrossPrice'] }}</del>
                                        <del><span id="price2"
                                                class="second_cross_price  {{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? 'showPrice' : '') : ($iDiscount ? 'showPrice' : '') }}">{{ $video['currencySymbol'] . $video['CrossPrice'] }}/月</span></del>
                                        <span id="codePriceApply2"
                                            class="price">{{ $video['currencySymbol'] . $video['Price'] }}
                                            <span>/月</span></span>
                                    </span>

                                    <p id="pricePerDay2">
                                        {{ $video['currencySymbol'] . ' ' . $video['PricePerDay'] }}
                                        <span id="perDay2">/日</span>
                                    </p>
                                    @else
                                    <div class="wrap_inner_card2">
                                        <span>このプログラムにはすでにアクティブな購読があります</span>
                                    </div>
                                    @endif
                                </div>

                                <div class="_card" id="textProgram" data-program="{{ $text['iProgramID'] }}"
                                    data-btntext="1" data-currency="{{ $text['Currency'] }}" id="alternate1"
                                    data-amount="{{ $text['Price'] }}" data-couponid="{{ $text['CouponId'] }}"
                                    data-discount="{{ $text['CouponApplied'] ? ($text['CouponAppliedDiscount'] > 0 ? $text['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                                    data-select="1" data-substatus="{{ $text['SubStatus'] }}" data-section="1"
                                    data-fakeoffer="{{ $text['fakeCoupon'] ? 1 : 0 }}"
                                    data-promocode="{{ $text['CouponCode'] }}"
                                    data-firstcrossprice="{{ $text['FirstCrossPrice'] }}"
                                    data-secondprice="{{ $text['CrossPrice'] }}"
                                    data-secondcurrency="{{ $text['CancelCurrency'] }}"
                                    data-currencysymbol="{{ $text['currencySymbol'] }}">

                                    <p class="head">日本語プログラム</p>
                                    <span class="gray">{{ $text['vDescription'] }}</span>
                                    @if (!$text['SubStatus'])
                                    <span>
                                        <del> {{ $text['currencySymbol'] . $text['FirstCrossPrice'] }}</del>
                                        <del><span id="price1"
                                                class="second_cross_price {{ $text['CouponApplied'] ? ($text['CouponAppliedDiscount'] > 0 ? 'showPrice' : '') : ($iDiscount ? 'showPrice' : '') }}">
                                                {{ $text['currencySymbol'] . $text['CrossPrice'] }}/月</span></del>
                                        <span id="codePriceApply1"
                                            class="price ">{{ $text['currencySymbol'] . $text['Price'] }}<span>/月</span></span>
                                    </span>

                                    <p id="pricePerDay1">
                                        {{ $text['currencySymbol'] . ' ' . $text['PricePerDay'] }}
                                        <span id="perDay2">/日</span>
                                    </p>
                                    @else
                                    <div class="wrap_inner_card2">
                                        <span>このプログラムにはすでにアクティブな購読があります</span>
                                    </div>
                                    @endif
                                </div>
                            </div>

                            <span class="borders">
                                あなたの実質割引は
                                <span id="effectiveDiscount">{{ $iDiscount == 0 ? '50' : $showPercentage }}%</span>
                            </span>

                            <span class="applied">{{ $anyFakeCoupon ? 'オファー' : 'クーポン' }}適用済み:
                                <b>
                                    <span
                                        id="vCodeName1">{{ $anyFakeCoupon ? 'SIGNUPOFFER' : $video['CouponCode'] }}</span>
                                </b>
                                <a href="javascript:void(0)" class="removeCoupon" data-section="1" data-deselect="2"
                                    id="removeCoupon2" data-couponid="{{ $video['CouponId'] }}"
                                    data-discount='{{ $video['CouponApplied'] ? $video['CouponAppliedDiscount'] : '' }}'>
                                    <img src="{{ Vite::asset('resources/images/cut.svg') }}" alt="image" />
                                </a>
                            </span>

                            <div
                                class="applyPromoCode hideAppliedCoupon {{ $text['CouponApplied'] ? 'hideAppliedCoupon' : '' }}">
                                <span class="promoCodeApply applieds" id="promoCodeApply1" data-select="1"
                                    data-program="{{ $text['iProgramID'] }}" data-section="1">
                                    クーポン／プロモコードを適用</span>
                            </div>

                            @php
                            $payButtonClass =
                            $vCountry == 'India' && ($video['Currency'] ?? '') == 'INR'
                            ? 'alternate_pay_link_buy'
                            : 'buy_now_btn';

                            $alternatePayBtnClass =
                            $vCountry == 'India' && ($video['Currency'] ?? '') == 'INR'
                            ? 'buy_now_btn_alter'
                            : 'alternate_pay_link';

                            if (($video['CouponAppliedDiscount'] ?? 0) == 100) {
                            $payButtonClass = 'active_free';
                            }
                            @endphp

                            <button class="button {{ $payButtonClass }}" id="buynow-btn" data-section="1"
                                data-program="{{ $video['iProgramID'] }}" data-currency="{{ $video['Currency'] }}"
                                data-amount="{{ $video['Price'] }}" data-couponId="{{ $video['CouponId'] }}"
                                data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                                data-select="2" data-eventid="{{ $fb_event_id }}"
                                data-emailid="{{ $fb_event_email }}"
                                data-externalid="{{ $fb_external_id }}">{{ $video['CouponAppliedDiscount'] == 100 ? '無料アクセスを有効化' : '今すぐ購入' }}</button>

                            <div id="AlternatePay1"
                                class="{{ $video['Currency'] == 'INR' && !$video['SubStatus'] ? 'show_alternate_content' : 'hide_alternate_content' }}">
                                <p class="alternate_pay_text">上記の支払い方法で問題が発生した場合:</p>
                                <a href="javascript:void(0)" class="{{ $alternatePayBtnClass }}"
                                    data-program="{{ $video['iProgramID'] }}" data-section="1"
                                    data-currency="{{ $video['Currency'] }}" id="alternate" data-select="2"
                                    data-amount="{{ $video['Price'] }}" data-couponId="{{ $video['CouponId'] }}"
                                    data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                                    data-eventid="{{ $fb_event_id }}" data-emailid="{{ $fb_event_email }}"
                                    data-externalid="{{ $fb_external_id }}">代替支払いリンク</a>
                            </div>
                            <ul>
                                <li>毎月請求。もしプログラムが効果がなかった場合は全額返金保証。</li>
                                <li>※注意：このプログラムは当社のアプリからのみご利用いただけます。こちらからは受講できません。</li>
                            </ul>
                        </section>
                    </div>
                </div>
            </div>
        </section>


        <section class="wrap_journey_rating">
            <div class="container">
                <div class="wrap_flex">
                    <div class="wrap_left">
                        <h3>今すぐ無煙の旅を始めて、たった6日で効果を実感しましょう！</h3>
                        <p>世界をリードする禁煙プログラム。60,000+人以上のクライアントがニコチンからコントロールを取り戻しました。</p>
                    </div>
                    <div class="wrap_right">
                        @php
                        if ($vDeviceType == 'web') {
                        $userAgent = $_SERVER['HTTP_USER_AGENT'];

                        if (
                        strpos($userAgent, 'Safari') !== false &&
                        strpos($userAgent, 'Chrome') === false &&
                        strpos($userAgent, 'Edg') === false
                        ) {
                        $image_url = 'resources/images/apple-rating.png';
                        $rating = '4.8';
                        $rating_plateform = 'Apple Rating';
                        $redirectURL = 'https://quitsure.app.link/2oSqUhn1aqb';
                        } else {
                        $image_url = 'resources/images/google-rating.png';
                        $rating = '4.7';
                        $rating_plateform = 'Google Rating';
                        $redirectURL = 'https://quitsure.app.link/Xm61QsJTaqb';
                        }
                        } elseif (strtolower($vDeviceType) == 'ios') {
                        $image_url = 'resources/images/apple-rating.png';
                        $rating = '4.8';
                        $rating_plateform = 'Apple Rating';
                        $redirectURL = 'https://quitsure.app.link/2oSqUhn1aqb';
                        } else {
                        $image_url = 'resources/images/google-rating.png';
                        $rating = '4.7';
                        $rating_plateform = 'Google Rating';
                        $redirectURL = 'https://quitsure.app.link/Xm61QsJTaqb';
                        }
                        @endphp

                        <div class="rating_google_img">
                            <a href="{{ $redirectURL }}" target="_blank" class="redirect">
                                <img src="{{ Vite::asset($image_url) }}" alt="" srcset="">
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </section>


        <section class="wrapper_proven_CBT">
            <div class="container">
                <div class="wrapper_cbt">
                    <div class="row">
                        <div class="col-lg-5 col-md-5 col-sm12">
                            <div class="wrap_cbt_img">
                                <figure>
                                    <img src="{{ config('services.bucket_url') . 'web/cbt.png' }}" alt="image" />
                                </figure>
                            </div>
                        </div>
                        <div class="col-lg-7 col-md-7 col-sm12">
                            <div class="wrap_cbt_text">
                                <div class="wrap_CBT_h">
                                    <h3>実証済みのCBT（認知行動療法）とマインドフルネスの技術</h3>
                                    <p>ニコチンとの関係を変革します。 </p>
                                </div>
                                <div class="wrap_CBT_h">
                                    <h3>成功をシンプルに </h3>
                                    <p>渇望なし、体重増加なし、生活習慣の変更なし。 </p>
                                </div>
                                <div class="wrap_CBT_h">
                                    <h3>思いやりと経験をもとに構築 </h3>
                                    <p>この旅を経験した元喫煙者によって設計されています。あなたの気持ちを理解しています。 </p>



                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section class="wrapper_if_you_subscribe">
            <div class="container">
                <div class="wrap_subscribe">
                    <div class="heads_txt_subs">
                        <h3 class="cstm_subscribe">購読すると、以下の内容が手に入ります:</h3>
                        <p>QuitSureでは、ちょっと違うアプローチをしてるんだ。世の中には裏技や手っ取り早い方法があふれてるけど、私たちは本当に効果があることに集中してる。喫煙をやめたい人をサポートするっていう想いは、すべてのステップに込められてるよ。だからこそ、みんながQuitSureを続けてくれてるのかもしれないし、毎日のように成功の話を聞くのもその理由かもね。</p>
                    </div>
                    <div class="row">
                        <div class="col-lg-2 col-md-3 col-sm-6 col-7">
                            <div class="custom_col_subscribe">
                                <figure>
                                    <img src="{{ Vite::asset('resources/images/web/Acces.png') }}" alt="">
                                </figure>
                                <p>選択した形式で提供される、変革をもたらす6日間のプログラム全体</p>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-3 col-sm-6 col-7">
                            <div class="custom_col_subscribe">
                                <figure>
                                    <img src="{{ Vite::asset('resources/images/web/chat.png') }}" alt="">
                                </figure>
                                <p>訓練された専門家による、24時間365日のチャットベースの個別コーチング</p>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-3 col-sm-6 col-7">
                            <div class="custom_col_subscribe">
                                <figure>
                                    <img src="{{ Vite::asset('resources/images/web/tools.png') }}" alt="">
                                </figure>
                                <p>長期的な成功をサポートする強力な禁煙後のツールへの生涯アクセス</p>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-3 col-sm-6 col-7">
                            <div class="custom_col_subscribe">
                                <figure>
                                    <img src="{{ Vite::asset('resources/images/web/freedom.png') }}" alt="">
                                </figure>
                                <p>そして最後に、この依存とニコチンが脳に与える支配からの解放
                                </p>
                            </div>
                        </div>
                    </div>

                    <div class="wrap_habits">
                        <h4>あなたの喫煙習慣に基づくと、</h4>
                        <h4>
                            <b class="wrap_Save">節約</b>
                            <b class="wrap_dolar">~{{ $vPayCurrency . $decCostPerMonth }}</b>
                            <span> 毎月可能です</span>
                        </h4>
                        <h4>禁煙後に</h4>
                    </div>
                </div>
            </div>
        </section>

        <section class="section_7 wrap_program_crousal">
            <div class="container">
                <div class="wrap_section_7">
                    <h3> <b> 今すぐ始めましょう。後回しにすると、心があなたを惑わせてしまいます。 今日始めれば、<span></span>  </b></h3>
                    <p>成功率が <span>74%高くなります。</span> </p>
                </div>
                <div class="custom_class_slick">
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_1.png' }}"
                            alt="image" />
                    </figure>
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_2.png' }}"
                            alt="image" />
                    </figure>
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_3.png' }}"
                            alt="image" />
                    </figure>
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_1.png' }}"
                            alt="image" />
                    </figure>
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_2.png' }}"
                            alt="image" />
                    </figure>
                    <figure>
                        <img src="{{ config('services.bucket_url') . 'web/subscription_review_3.png' }}"
                            alt="image" />
                    </figure>
                </div>
            </div>
        </section>

        <section class="wrap_chose_right_program" id="programSelection2">
            <div class="container">
                <div class="wrap_txt">
                    <h3>自分に合ったプログラムを選択</h3>
                </div>
                <div class="select_program" id="programSection2">
                    <div class="_card selected_program" id="videoProgram2" data-program="{{ $video['iProgramID'] }}"
                        data-currency="{{ $video['Currency'] }}" data-amount="{{ $video['Price'] }}"
                        data-couponId="{{ $video['CouponId'] }}"
                        data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                        data-select="2" data-substatus="{{ $video['SubStatus'] }}" data-section="2"
                        data-fakeoffer="{{ $video['fakeCoupon'] ? 1 : 0 }}"
                        data-promocode="{{ $video['CouponCode'] }}"
                        data-firstcrossprice="{{ $video['FirstCrossPrice'] }}"
                        data-secondprice="{{ $video['CrossPrice'] }}"
                        data-secondcurrency="{{ $video['CancelCurrency'] }}"
                        data-currencysymbol="{{ $video['currencySymbol'] }}">
                        <p class="head">英語（ビデオ）プログラム</p>
                        <span class="gray">{{ $video['vDescription'] }}</span>
                        @if (!$video['SubStatus'])
                        <span>
                            <del> {{ $video['currencySymbol'] . $video['FirstCrossPrice'] }} </del>
                            <del> <span id="price2"
                                    class="second_cross_price  {{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? 'showPrice' : '') : ($iDiscount ? 'showPrice' : '') }}">
                                    {{ $video['currencySymbol'] . $video['CrossPrice'] }}/月</span></del>
                            <span id="codePriceApply2" class="price ">{{ $video['currencySymbol'] }}
                                {{ $video['Price'] }} <span>/月</span></span>
                        </span>

                        <p id="pricePerDay2">
                            {{ $video['currencySymbol'] . $video['PricePerDay'] }}
                            <span id="perDay2">/日</span>
                        </p>
                        @else
                        <div class="wrap_inner_card2">
                            <span>このプログラムにはすでにアクティブな購読があります</span>
                        </div>
                        @endif
                    </div>

                    <div class="_card" id="textProgram2" data-program="{{ $text['iProgramID'] }}"
                        data-btntext="1" data-currency="{{ $text['Currency'] }}"
                        data-amount="{{ $text['Price'] }}" data-couponid="{{ $text['CouponId'] }}"
                        data-discount="{{ $text['CouponApplied'] ? ($text['CouponAppliedDiscount'] > 0 ? $text['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}"
                        data-select="1" data-substatus="{{ $text['SubStatus'] }}" data-section="2"
                        data-fakeoffer="{{ $text['fakeCoupon'] ? 1 : 0 }}"
                        data-promocode="{{ $text['CouponCode'] }}"
                        data-firstcrossprice="{{ $text['FirstCrossPrice'] }}"
                        data-secondprice="{{ $text['CrossPrice'] }}"
                        data-secondcurrency="{{ $text['CancelCurrency'] }}"
                        data-currencysymbol="{{ $text['currencySymbol'] }}">
                        <p class="head">日本語プログラム</p>
                        <span class="gray">{{ $text['vDescription'] }}</span>
                        @if (!$text['SubStatus'])
                        <span>
                            <del> {{ $text['currencySymbol'] . $text['FirstCrossPrice'] }} </del>
                            <del> <span id="price1"
                                    class="second_cross_price {{ $text['CouponApplied'] ? ($text['CouponAppliedDiscount'] > 0 ? 'showPrice' : '') : ($iDiscount ? 'showPrice' : '') }}">
                                    {{ $text['currencySymbol'] . $text['CrossPrice'] }}/月 </span></del>
                            <span id="codePriceApply1" class="price">{{ $text['currencySymbol'] }}
                                {{ $text['Price'] }}<span>/月</span></span>
                        </span>

                        <p id="pricePerDay1">
                            {{ $text['currencySymbol'] . $text['PricePerDay'] }}
                            <span id="perDay1">/日</span>
                        </p>
                        @else
                        <div class="wrap_inner_card2">
                            <span>このプログラムにはすでにアクティブな購読があります</span>
                        </div>
                        @endif
                    </div>
                </div>

                <span class="borders">
                    あなたの実質割引は <span id="effectiveDiscount"> {{ $showPercentage }}%</span>
                </span>

                <span class="applied">{{ $anyFakeCoupon ? 'オファー' : 'クーポン' }}適用済み:
                    <b> <span id="vCodeName2">{{ $anyFakeCoupon ? 'SIGNUPOFFER' : $video['CouponCode'] }}</span></b>
                    <a href="javascript:void(0)" class="removeCoupon" data-section="2" data-deselect="2"
                        id="removeCoupon2" data-couponid="{{ $video['CouponId'] }}"
                        data-discount='{{ $video['CouponApplied'] ? $video['CouponAppliedDiscount'] : '' }}'>
                        <img src="{{ Vite::asset('resources/images/cut.svg') }}" alt="image" />
                    </a>
                </span>

                <div
                    class="applyPromoCode hideAppliedCoupon {{ $text['CouponApplied'] ? 'hideAppliedCoupon' : '' }}">
                    <span class="promoCodeApply applieds" id="promoCodeApply1" data-select="2"
                        data-program="{{ $text['iProgramID'] }}" data-section="2">クーポン／プロモコードを適用</span>
                </div>

                <button class="button {{ $payButtonClass }}" id="buynow-btn2" data-section="2"
                    data-program="{{ $video['iProgramID'] }}" data-currency="{{ $video['Currency'] }}"
                    data-select="2" data-amount="{{ $video['Price'] }}" data-couponId="{{ $video['CouponId'] }}"
                    data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}">{{ $video['CouponAppliedDiscount'] == 100 ? '無料アクセスを有効化' : 'BUY NOW' }}</button>

                <div id="AlternatePay2"
                    class="{{ $video['Currency'] == 'INR' && !$video['SubStatus'] ? 'show_alternate_content' : 'hide_alternate_content' }}">
                    <p class="alternate_pay_text">上記の支払い方法で問題が発生した場合:</p>
                    <a href="javascript:void(0)" class="{{ $alternatePayBtnClass }}"
                        data-program="{{ $video['iProgramID'] }}" data-section="2"
                        data-currency="{{ $video['Currency'] }}" id="alternate2" data-select="2"
                        data-amount="{{ $video['Price'] }}" data-couponId="{{ $video['CouponId'] }}"
                        data-discount="{{ $video['CouponApplied'] ? ($video['CouponAppliedDiscount'] > 0 ? $video['CouponAppliedDiscount'] : $iDiscount) : ($iDiscount ? $iDiscount : 0) }}">代替支払いリンク
                        </a>
                </div>
                <ul>
                    <li>毎月請求。もしプログラムが効果がなかった場合は全額返金保証。</li>
                    <li>※注意：このプログラムは当社のアプリからのみご利用いただけます。こちらからは受講できません。 </li>
                </ul>
            </div>
        </section>



        <section class="wrapper_faq">
            <div class="container">
                <div class="wrap_collapse">
                    <h3 class="text-center the_witnes">よくある質問</h3>
                    <div class="Accordian">
                        <div id="accordion">

                            <div class="card">
                                <div class="card-header" id="headingOne">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseOne" aria-expanded="true"
                                            aria-controls="collapseOne">
                                            <span>
                                                なぜ1ヶ月のサブスクリプションなのか？
                                            </span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>今すぐ禁煙の旅を始めて、わずか6日で結果を実感してください
                                </div>

                                <div id="collapseOne" class="collapse" aria-labelledby="headingOne"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>6日間のプログラムであるにも関わらず、なぜ月額サブスクリプションなのか疑問に思うかもしれません。実際、多くのクライアントは非常に忙しい生活を送っており、プログラムの完了に10〜12日を要することがあります。これは全く問題なく、プログラムは6〜12日で完了できるように設計されています。</p>

                                        <p>しかし、喫煙への依存により、私たちは先延ばしにする傾向があります（これは過去の多くの禁煙の試みの前に誰もが感じたことです）。これが、多くの人が禁煙を難しいと感じたり、禁煙の試みを始めることさえ難しく感じる最大の理由です。これを避けるために、プログラムは1ヶ月以内に完了すべき期間として設定されています。この制限があることで、先延ばしを克服するために必要な小さな後押しとなります。</p>

                                        <p>実際、この時間制限があるため、多くのクライアントはサブスクリプションが終了する直前にプログラムを完了します。この制限がなければ、彼らはプログラムを続けて先延ばしにし、今日でもまだ喫煙者のままだったかもしれません。</p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingTwo">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseTwo" aria-expanded="false"
                                            aria-controls="collapseTwo">
                                            <span>自動更新されますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>
                                            はい。プログラムを完了し禁煙に成功した場合、プログラムの内容にアクセスする必要はありません。そのため、プログラム完了後はサブスクリプションの解約をお勧めします。解約後も、禁煙後のツールやジャーナルには引き続きアクセスできます。
                                        </p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingThree">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseThree" aria-expanded="false"
                                            aria-controls="collapseThree">
                                            <span>どうやって購読をキャンセルできますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseThree" class="collapse" aria-labelledby="headingThree"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>QuitSureアプリの「購読詳細」ページからいつでもサブスクリプションをキャンセルできます。必ず、QuitSureアカウント作成時と同じメールアドレスでログインしてください。</p>
                                        <p><a href="https://quitsure.app.link/KUrCkCNiezb">今すぐQuitSureアプリに移動</a></p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingFour">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseFour" aria-expanded="false"
                                            aria-controls="collapseFour">
                                            <span>支払いに問題があります。どうすれば解決できますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseFour" class="collapse" aria-labelledby="headingFour"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>問題が発生した場合は、<a href="mailto:hello@quitsure.app">hello@quitsure.app</a> までご連絡ください。すぐにサポートいたします。</p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingFive">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseFive" aria-expanded="false"
                                            aria-controls="collapseFive">
                                            <span>複数のプログラムを同時に購入できますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseFive" class="collapse" aria-labelledby="headingFive"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>はい。各プログラムは独立したサブスクリプションのため、複数のプログラムを同時に購入することができます。</p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingSix">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseSix" aria-expanded="false"
                                            aria-controls="collapseSix">
                                            <span>料金を支払いました。プログラムにはどうアクセスしますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseSix" class="collapse" aria-labelledby="headingSix"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>QuitSureアプリからプログラムにアクセスできます。アカウント作成時と同じメールアドレスでログインしていることを確認してください。</p>
                                        <p><a href="https://quitsure.app.link/KUrCkCNiezb">今すぐQuitSureアプリに移動</a></p>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header" id="headingSeven">
                                    <h5 class="mb-0">
                                        <button class="btn btn-link collapsed" data-toggle="collapse"
                                            data-target="#collapseSeven" aria-expanded="false"
                                            aria-controls="collapseSeven">
                                            <span>返金保証はどのように機能しますか？</span>
                                            <img src="{{ Vite::asset('resources/images/Arrowup.png') }}"
                                                alt="image" />
                                        </button>
                                    </h5>
                                </div>
                                <div id="collapseSeven" class="collapse" aria-labelledby="headingSeven"
                                    data-parent="#accordion">
                                    <div class="card-body">
                                        <p>QuitSureでは、プログラムが効果がなかった場合、質問なしで返金保証を提供しています。最新の返金ポリシーは <a
                                                href="https://www.quitsure.app/refunds" target="_blank">こちら</a> からご確認いただけます。</p>
                                    </div>
                                </div>
                            </div>

                        </div> <!-- end accordion -->

                    </div>
                </div>
            </div>
        </section>

        <section class="wrappper_money_back">
            <div class="container">
                <div class="cstm_flex">
                    <div class="wrap_left">
                        <img src="{{ Vite::asset('resources/images/moneyback.png') }}" alt="image" />
                    </div>
                    <div class="wrap_right">
                        <p>禁煙を続けられるか不安ですか？QuitSureはとても効果的なので、結果に満足いただけなければ返金いたします！</p>
                    </div>
                </div>
            </div>
        </section>

        <section class="copy_write_txt">
            <span>Copyright © QuitSure Private Limited, 2025</span>
        </section>

    </div>
</div>

<!-- Apply Coupon -  Modal -->
<div class="modal fade modal_active_overwrite modal_add_coupon" id="applyCode" tabindex="-1"
    aria-labelledby="applyCodeLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body text-center">
                <img class="coupon_gift" src="{{ Vite::asset('resources/images/12.svg') }}" alt="coupon">
                <h3>クーポンまたはプロモコードを適用</h3>
                <p>コードが有効か確認し、購入に適用しましょう</p>
                <div id="errorMsg"></div>
                <div>
                    <form class="coupon_apply_form" id="code_apply_form" method="post">
                        <input type="text" name="promocode" id="promocode" class="cstm_coupon_input"
                            placeholder="クーポンコードを入力" required>
                        <input type="hidden" name="promoCodeApply" id="promoCodeApply">
                        <input type="hidden" name="iProgram" id="iProgram">
                        <input type="hidden" name="program_section" id="program_section">
                        <button type="submit" id="applyCodeBtn" class="buy_now_btn_cstm apply_code_disabled"
                            disabled>コードを適用</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Remove Coupon -  Modal -->
<div class="modal fade modal_active_overwrite modal_add_coupon cstm_delete_coupon" id="removeCode" tabindex="-1"
    aria-labelledby="removeCodeLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body text-center">
                <img class="coupon_gift" src="{{ Vite::asset('resources/images/solar_danger-circle-bold.svg') }}"
                    alt="delete">
                <h3>本当によろしいですか？</h3>
                <p class="showOnlyFakeOffer">ここに適用されている <span class="discountPer"></span> の追加割引が失われちゃうよ。</p>

                <p class="showOnlyFakeOffer">自分のクーポンが <span class="discountPer"></span>以上の割引になる時だけ、これをやってね。</p>
                <p class="showForCoupon">このクーポンに関連する特典を失います。</p>

                <div>
                    <form class="coupon_apply_form" method="post">
                        <input type="hidden" name="removeCodeApply" id="removeCodeApply">
                        <input type="hidden" name="iCouponId" id="iCouponId">
                        <input type="hidden" name="iDiscount" id="iDiscount">
                        <button type="button" id="removeCodeBtn"
                            class="buy_now_btn_cstm remove_coupon_btn">削除</button>
                        <button type="button" class="buy_now_btn_cstm" data-dismiss="modal"
                            aria-label="Close">保持</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@include('partials.js.B2C.subscribeJsJapanese')