@push('metadata')
@php
$page_id = 36;
$mTitle = @$seoData['seo_title'];
$mDescr = @$seoData['meta_description'];
$faqs = $seoData['faq'] ?? '[]';
$mKWords= $seoData['meta_keywords'];
$mUrl = url()->current();
$mImage = config('constants.advertise_with_us');
@endphp

<title>{{ @$mTitle }}</title>
<meta name="keywords" content="{{ @$mKWords }}" />
<meta name="description" content="{{ @$mDescr }}" />
<meta property=og:locale content="{{ app()->getLocale() }}" />
<meta property=og:type content="{{config('constants.organisation_type_news')}}" />
<meta property="og:site_name" content="Crypto Presale" />
<meta property="og:title" content="{{ @$mTitle }}" />
<meta property="og:description" content="{{ @$mDescr }}" />
<meta property="og:url" content="{{ @$mUrl }}" />
<meta property="og:image" content="{{ @$mImage }}" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content="{{ @$mTitle }}" />
<meta property="twitter:description" content="{{ @$mDescr }}" />
<meta property="twitter:url" content="{{ @$mUrl }}" />
<meta property="twitter:image" content="{{ @$mImage }}" />
<meta name="twitter:site" content="{{config('constants.twitter_url')}}" />
<meta name="twitter:creator" content="{{config('constants.twitter_url')}}" />
@endpush

@push('head_scripts')
{!! SchemaHelper::webpageSchema($mTitle ?? null, $mDescr ?? null) !!}
{!! SchemaHelper::getImageObjectSchema('https://cryptohindinews.in/assets/images/logo/hindi-black-logo.webp',$mTitle) !!}
{!! SchemaHelper::getFaqSchema(json_encode($seoData['faq'])) !!}
{!! SchemaHelper::getBreadcrumbSchema([['name' => 'Home', 'url' => url('/')],['name' =>$seoData['breadcrumb'] , 'url' => $mUrl]]) !!}
{!! SchemaHelper::advertiseDatasetSchema($plans,$seoData) !!}
@endpush
<div>
    <section class="bg-darkpink p-2 breadcrumb mb-0">
        <div class="container">
            <div class="row">
                <div class="d-flex gap-2 p-0 m-0 list-unstyled justify-content-center text-white">
                    <ul class="d-flex p-0 m-0 list-unstyled align-items-center">
                        <li><a href="{{ URL::to('/') }}" class="text-decoration-none text-white" title="Home">होम</a></li>
                        <li>{{ $seoData['breadcrumb'] ?: 'Advertiser With Us' }}</li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
    <section class="bg-lightgray py-3 mt-2">
        <div class="container">
            <div class="row">
                <div class="col-xl-12 col-12 text-center">
                    {!! $seoData['top_page_content'] !!}
                </div>
                <div class="row d-lg-flex mt-2">
                    <div class="col-lg-12">
                        <div class=" shadow border-dark rounded-4 p-4">
                            <!-- <div class="d-flex justify-content-between align-items-center mb-3">
                     <span class="fw-bold">पैकेज और मूल्य</span>
                     <a class="btn btn-gradient" href=""><i class="fa-solid fa-download me-1"></i> पीडीएफ डाउनलोड करें</a>
                  </div> -->
                            <div class="border-bottom pb-3">
                                <table class="table table-bordered table-responsive d-lg-table border even-odd-tbl d-block w-100 table-responsive ">
                                    <thead class="text-center text-wrap">
                                        <tr>
                                            <th width="400">
                                                <span class="fs-6 mb-0 mt-0 text-white text-center">क्रिप्टो (Incl Presale & Listicles)</span>
                                            </th>
                                            <!-- <th rowspan="1" colspan="2">लिंक</th> -->
                                            <th width="100">गूगल इंडेक्स्ड</th>
                                            <th width="100">
                                                <span data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Turnaround time">TAT (दिन)</span>
                                            </th>
                                            <th width="200">बैकलिंक्स (Do Follows)</th>
                                            <th width="100">
                                                <span data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="क्रिप्टो, web3 एंड ब्लॉकचैन">क्रिप्टो</span>
                                            </th>
                                            <th width="100">
                                                <span data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="माइनिंग">माइनिंग</span>
                                            </th>
                                        </tr>

                                    </thead>
                                    <tbody>
                                        @foreach ($plans as $index => $plan)

                                        <tr>

                                            <td class="fw-bold">
                                                <span class="h6 fw-bold mb-0 d-block">{{ $plan->title }}</span>
                                            </td>

                                            <td class="text-center">
                                                <i class="fa-solid fa-circle-check mx-1 fs-4 align-middle text-success"></i>
                                            </td>

                                            <td class="text-center">1</td>
                                            <td class="text-center">2</td>

                                            <!-- Crypto Price -->
                                            <td class="text-start">
                                                <div class="d-flex align-items-center">
                                                    <input type="checkbox"
                                                        name="package[]"
                                                        data-price="{{ $plan->crypto_price }}"
                                                        class="me-1 bigcheckbox price-checkbox choice price-checkbox"
                                                        id="crypto_checkbox_{{ $index }}">
                                                    <label for="crypto_checkbox_{{ $index }}">
                                                        $ {{ number_format($plan->crypto_price, 2) }}
                                                    </label>
                                                </div>
                                            </td>

                                            <!-- Gambling Price -->
                                            <td class="text-start">
                                                <div class="d-flex align-items-center">
                                                    <input type="checkbox"
                                                        name="package[]"
                                                        data-price="{{ $plan->gambling_price }}"
                                                        class="me-1 bigcheckbox price-checkbox choice price-checkbox"
                                                        id="gambling_checkbox_{{ $index }}">
                                                    <label for="gambling_checkbox_{{ $index }}">
                                                        $ {{ number_format($plan->gambling_price, 2) }}
                                                    </label>
                                                </div>
                                            </td>

                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>

                            <!-- TOTAL SECTION -->
                            <div class="d-flex justify-content-between align-items-center mt-1">
                                <span>कुल राशि</span>
                                <div>
                                    <input type="hidden" name="total" id="totalInput">
                                    <span class="fw-bold" id="totalDisplay">₹0.00</span>
                                </div>
                            </div>

                            <!-- <div class="col-12 text-center mb-3 mt-4 ">
                     <h3 class="h4 fw-bold text-paragraph heading-bdr position-relative d-inline-block pb-2"> बैनर विज्ञापन</h3>
                     </div>
                     <div class="col-12">
                     <table class="table table-bordered table-responsive  border even-odd-tbl d-lg-table ">
                         <thead>
                             <tr><th class="w-40 ">बैनर विज्ञापन</th>
                             <th class="w-12">चित्र</th>
                             <th>7 दिन</th>
                             <th>15 दिन </th>
                             <th>1 महिना</th>
                         </tr></thead>
                         <tbody>


                         </tbody>
                     </table>
                     </div> -->
                            <!-- <div class="text-center py-2">
                     <span class="h5 fw-bold text-paragraph heading-bdr position-relative d-inline-block pb-2">कॉइनगब्बर ऐड-ऑन पैकेज</span>
                     </div> -->
                            <!-- <ul class="list-unstyled mb-0">
                     <li class="py-1">
                         <div class="d-flex justify-content-between align-items-center">
                             <span class="d-flex align-items-baseline text-downriver fw-medium">
                                 <i class="fa-solid fa-paw text-shaffron me-2"></i>
                                 यूजर्स को ईमेल <i class="fa-regular fa-envelope ms-2"></i>
                                 <span class="small text-danger-emphasis mx-2">(Avg 5% Open & 1% Click)</span>
                             </span>

                             <div>
                                 <input type="checkbox" class="me-1 bigcheckbox price-checkbox" data-price="" id="emailuser">
                                 <label class="text-danger-emphasis fw-semibold fs-5" for="emailuser">
                                     $50
                                 </label>
                             </div>
                         </div>
                     </li>

                     <li class="py-1">
                         <div class="d-flex justify-content-between align-items-center">
                             <span class="d-flex align-items-baseline text-downriver fw-medium">
                                 <i class="fa-solid fa-paw text-shaffron me-2"></i>
                                 आर्टिकल की सोशल मीडिया पोस्टिंग-
                                 <a href="#" title="Share on Instagram" class="share-modal-icon share-modal-icon-width  text-white insta-bg ms-2" data-bs-toggle="tooltip" data-bs-title="Share on Instagram">
                                     <i class="fa-brands fa-instagram"></i>
                                 </a>

                                 <a href="#" title="Share on Telegram" class="share-modal-icon share-modal-icon-width text-white tele-bg" data-bs-toggle="tooltip" data-bs-title="Share on Telegram">
                                     <i class="fa-solid fa-paper-plane"></i>
                                 </a>

                                 <a href="#" title="Share on Twitter" class="share-modal-icon share-modal-icon-width text-white twitter-bg" data-bs-toggle="tooltip" data-bs-title="Share on Twitter">
                                     <i class="fa-brands fa-x-twitter"></i>
                                 </a>
                             </span>

                             <div>
                                 <input type="checkbox" class="me-1 bigcheckbox price-checkbox" data-price="" id="socialmedia">
                                 <label class="text-danger-emphasis fw-semibold fs-5" for="socialmedia">
                                     $50
                                 </label>
                             </div>
                         </div>
                     </li>
                     </ul> -->
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="my-3 ">
                            <div class="row p-3">
                                <div class="col-xl-6   border-last">
                                    <div class="px-4 rounded-4 shadow">
                                        <div class="text-center py-xl-2">
                                            <span class="h5 text-paragraph fw-bold">जानकारी जमा करें</span>
                                        </div>
                                        <div class="row my-4">
                                            <div class="col-xxl-4 col-lg-6 py-2">
                                                <label for="transaction-id" class="input-box-label ms-1">सबमिट ट्रांसक्शन ID <span class="text-danger">*</span> -:</label>
                                                <input type="text" class="prf-int" name="trasaction_id" data-price="" id="transaction-id" aria-describedby="transaction-id" placeholder="सबमिट ट्रांसक्शन Id -">
                                            </div>
                                            <div class="col-xxl-4 col-lg-6 py-2">
                                                <label for="email-id" class="input-box-label ms-1">सबमिट ईमेल ID
                                                    <span class="text-danger">*</span> -:
                                                </label>
                                                <input type="email" class="prf-int" data-price="" name="email" id="email-id" aria-describedby="email-id" placeholder="सबमिट ईमेल id -">
                                            </div>
                                            <div class="col-xxl-4 col-lg-6 py-2">
                                                <label for="telegram-id" class="input-box-label ms-1">सबमिट टेलीग्राम ID <span class="text-danger">*</span> -:</label>
                                                <input type="text" class="prf-int" data-price="" name="telegram" id="telegram-id" aria-describedby="telegram-id" placeholder="सबमिट टेलीग्राम id -">
                                            </div>
                                            <div class="col-lg-12 py-2 d-flex justify-content-center">
                                                <input type="hidden" name="g-recaptcha-response" id="g-recaptcha-response">
                                                <!--                             <div class="g-recaptcha my-3" data-sitekey="6Lc0cwYqAAAAADTL75gP89k15h_EVBy7eHSOwYcI"></div>
                                    <strong id="recaptcha_error" class="recaptcha_error fw-semibold">master.recaptcha_is_required</strong>
                                                             -->
                                            </div>
                                            <div class="col-12">
                                                <div class="d-flex gap-2">
                                                    <p class="mb-0 fs-14"><span class="text-danger">ज़रूरी :</span> राशि ट्रांसफर करने से पहले हमारे ऑफिसियल वेरिफिकेशन से वॉलेट ऑथेंटिकेशन की जांच कर लें</p>
                                                    <a href="#" title="ऑफिशियल वेरिफिकेशन" class="text-decoration-none text-gradient">
                                                        <i class="fa-solid fa-arrow-up-right-from-square ms-1"></i>
                                                        <span class="d-none">ऑफिशियल वेरिफिकेशन</span>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="col-12 py-2 text-center">
                                                <button type="submit" class="btn btn-primary" title="सबमिट">सबमिट</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xl-6 ">
                                    <div class="row">
                                        <div class="text-center">
                                            <span class="h5 text-paragraph fw-bold">क्रिप्टो हिंदी न्यूज़ से संपर्क करें</span>
                                        </div>
                                        <div class="col-12 col-lg-12 col-xxl-6 card-group mt-3">
                                            <div class="card  rounded-4 mb-2 mainboxview pinkborder">
                                                <div class="card-header bg-transparent border-0 fw-semibold h6 text-center text-dark d-flex justify-content-center align-items-center h-100 pt-3 pb-0">
                                                    <span class="fw-semibold h5 mb-2">मार्केटिंग और पार्टनरशिप</span>
                                                </div>
                                                <div class="d-flex flex-wrap p-0 justify-content-center card-body text-paragraph text-center">
                                                    <p class="mb-1 h5 text-nowrap">
                                                        <a href="mailto:sourabh@coingabbar.com" title="Gmail" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-envelope gmail-clr me-2"></i>
                                                            sourabh@coingabbar.com
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext1()"></i>
                                                            <input type="hidden" id="textbox1" data-price="sourabh@coingabbar.com">
                                                        </button>
                                                    </p>
                                                    <p class="mb-1 h5 text-nowrap">
                                                        <a href="https://t.me/gabbarSourabh" title="Telegram" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-paper-plane me-2 tele-clr"></i>
                                                            gabbarSourabh
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext2()"></i>
                                                            <input type="hidden" id="textbox2" data-price="gabbarSourabh">
                                                        </button>
                                                    </p>
                                                    {{-- <p class="mb-1 h5 text-nowrap">
                                                        <a href="https://t.me/Sourabh_Gabbar" title="Telegram" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-paper-plane me-2 tele-clr"></i>
                                                            Sourabh_Gabbar
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext3()"></i>
                                                            <input type="hidden" id="textbox3" data-price="Sourabh_Gabbar">
                                                        </button>
                                                    </p> --}}
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-12 col-xxl-6 card-group mt-3">
                                            <div class="card  rounded-4 mb-2 mainboxview pinkborder">
                                                <div class="card-header bg-transparent border-0 fw-semibold h6 text-center text-dark d-flex justify-content-center align-items-center h-100 pt-3 pb-0">
                                                    <span class="fw-semibold h5 mb-2 mt-0">प्रेस रिलीज़, कंटेंट मार्केटिंग और बैनर विज्ञापन </span>
                                                </div>
                                                <div class="d-flex flex-wrap p-0 justify-content-center card-body text-paragraph text-center">
                                                    {{-- <p class="mb-1 h5 text-nowrap">
                                                        <a href="mailto:content@coingabbar.io" title="Gmail" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-envelope gmail-clr me-2"></i>
                                                            content@coingabbar.io
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext4()"></i>
                                                            <input type="hidden" id="textbox4" data-price="content@coingabbar.io">
                                                        </button>
                                                    </p> --}}
                                                    <p class="mb-1 h5 text-nowrap">
                                                        <a href="mailto:shrishty@coingabbar.com" title="Gmail" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-envelope gmail-clr me-2"></i>
                                                            shrishty@coingabbar.com
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext5()"></i>
                                                            <input type="hidden" id="textbox5" data-price="shrishty@coingabbar.com">
                                                        </button>
                                                    </p>
                                                    {{-- <p class="mb-1 h5 text-nowrap">
                                                        <a href="https://t.me/Content_coingabbar" title="Telegram" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-paper-plane me-2 tele-clr"></i>
                                                            @Content_coingabbar
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext6()"></i>
                                                            <input type="hidden" id="textbox6" data-price="@Content_coingabbar">
                                                        </button>
                                                    </p> --}}
                                                    <p class="mb-1 h5 text-nowrap">
                                                        <a href="https://t.me/shristy_M" title="Telegram" target="_blank" rel="noopener noreferrer nofollow" class="text-decoration-none fw-normal text-paragraph fs-6">
                                                            <i class="fa-regular fa-paper-plane me-2 tele-clr"></i>
                                                            shristy_M
                                                        </a>
                                                        <button type="button" class="bg-transparent border-0 fs-6" aria-label="copy" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" data-bs-title="Copied">
                                                            <i class="fa-regular fa-copy ps-2" onclick="copytext7()"></i>
                                                            <input type="hidden" id="textbox7" data-price="shristy_M">
                                                        </button>
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- <div class="col-xl-12">
                                    <span class="fw-bold text-center my-3 h4 d-block">हमारे साथ विज्ञापन क्यों करें?</span>
                                    <div class="pinkborder p-4">
                                        <div class="row">
                                            <div class="col-xl-3 border-end pe-4">
                                                <span class="fw-bold h2 text-center d-block">5+</span>
                                                <span class="text-center d-block">Lorem ipsum</span>
                                            </div>
                                            <div class="col-xl-3 border-end pe-4">
                                                <span class="fw-bold h2 text-center d-block">150+</span>
                                                <span class="text-center d-block">Advertisements</span>
                                            </div>
                                            <div class="col-xl-3 border-end pe-4">
                                                <span class="fw-bold h2 text-center d-block">85%</span>
                                                <span class="text-center d-block">Customer Satisfaction Rate</span>
                                            </div>
                                            <div class="col-xl-3">
                                                <span class="fw-bold h2 text-center d-block">85%</span>
                                                <span class="text-center d-block">Lorem ipsum</span>
                                            </div>
                                        </div>
                                    </div>
                                </div> -->

                            </div>
                        </div>
                    </div>
                </div>
            </div>
    </section>
    <div class="container">
        <div class="row">
            <div class="col-xl-12">
                <div class="content-view">
                    {!! CommonHelper::addNoFollowToExternalLinks(@$seoData['description']) !!}
                </div>
            </div>
        </div>
    </div>

    <livewire:faq-section pageType="advertiser-with-us" />
</div>


@push('scripts')
<!-- SCRIPT -->
<script>
    document.addEventListener("DOMContentLoaded", function() {
        const checkboxes = document.querySelectorAll(".price-checkbox");
        const totalDisplay = document.getElementById("totalDisplay");
        const totalInput = document.getElementById("totalInput");

        function updateTotal() {

            let total = 0;
            checkboxes.forEach(cb => {
                if (cb.checked) {
                    total += parseFloat(cb.dataset.price) || 0;
                }
            });

            totalDisplay.textContent = "₹" + total.toLocaleString('en-IN', {
                minimumFractionDigits: 2,
                maximumFractionDigits: 2
            });

            totalInput.value = total.toFixed(2);
        }

        checkboxes.forEach(cb => {
            cb.addEventListener("change", updateTotal);
        });

        updateTotal();
    });
</script>
@endpush