@push('metadata')
@php
$pageId = $seoData['id'] ?? 82;
$mTitle = @$seoData['seo_title'];
$mDescr = @$seoData['meta_description'];
$mKWords = @$seoData['meta_keywords'];
$faqs = $seoData['faq'] ?? '[]';
$mUrl = url()->current();
$mImage = config('constants.home_page');
@endphp
<title>{{ @$mTitle }}</title>
<meta name="description" content="{{ @$mDescr }}" />
<meta property=og:locale content="{{ app()->getLocale() }}" />
<meta property=og:type content="{{config('constants.organisation_type')}}" />
<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 name="twitter:title" content="{{ @$mTitle }}" />
<meta name="twitter:description" content="{{ @$mDescr }}" />
<meta name="twitter:url" content="{{ @$mUrl }}" />
<meta name="twitter:image" content="{{ @$mImage }}" />
<meta name="twitter:site" content="{{config('constants.twitter_url')}}" />
<meta name="twitter:creator" content="{{config('constants.twitter_url')}}" />
<link rel="alternate" type="application/rss+xml" href="" title="Crypto News RSS Feed English : Crypto Presale News" />
@endpush
@push('pageId')
<script>
window.pageId = "{{ $seoData['id'] ?? '' }}";
</script>
@endpush
@push('head_scripts')
{!! SchemaHelper::webpageSchema($mTitle ?? null, $mDescr ?? null) !!}
{!! SchemaHelper::getImageObjectSchema($mImage, $mTitle, 1200, 630) !!}
@endpush

@php
    $totalListed  = count($featuredIcos ?? []) + count($unfeaturedIcos ?? []);
    $newsList     = collect($smallNews ?? []);
    $headlineNews = $newsList->take(10);  // left column — 10 numbered headlines
    $cardNews     = $newsList->take(6);   // right column — 6 small cards
    $wireList     = collect($smallPress ?? [])->take(6);
@endphp

<div>
    {{-- <section class="py-3">
        <div class="container">
            <div class="topsliderview row" id="bannerContainer"></div>
            <div class="row mt-3">
                <div class="col-xl-12 text-center headingfont">
                    {!! $seoData['top_page_content'] !!}
                </div>
            </div>
        </div>
    </section> --}}

    {{-- ══ 5. News: lead + numbered headlines + strip ══ --}}
    <section class="my-5 newscard-presale">
        <div class="container">
            <div class="row">
                <div class="col-xl-4 col-lg-5 border-xxl-block border-secondary order-2 order-sm-1">
                    <div class="d-flex justify-content-between align-items-center flex-wrap mb-3">
                        <h2 class="h5 fw-bold text-black mb-0">Crypto News 2026</h2>
                        <a href="{{ URL::to('crypto-news') }}" title="Crypto News"
                            class="text-decoration-none btn btn-primary fs-14 py-1 px-2">View All News</a>
                    </div>
                    @foreach($headlineNews as $press)
                    <div class="d-flex gap-2 py-2 border-bottom align-items-start">
                        <span class="newsnum fs-13">{{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}</span>
                        <div>
                            <a href="{{ URL::to($press->alias) }}" title="{{ $press->title }}"
                                class="text-decoration-none">
                                <span class="d-block fs-15 fw-semibold text-black two-line-text">{{ $press->title }}</span>
                            </a>
                            <div class="fs-13 textclr mt-1">
                                <a href="{{ URL::to('crypto-author/'.$press->postAuthor->slug) }}" class="text-decoration-none textclr" title="Meet {{ $press->postAuthor->dispaly_name ?? 'Admin' }}, Crypto Journalist at Crypto Presale News">
                                    <span itemprop="name">{{ $press->postAuthor->dispaly_name ?? 'Admin' }}</span>
                                </a>
                                &middot;
                                <time class="lh-1" datetime="{{ \Carbon\Carbon::parse($press->publishedAt)->toIso8601String() }}">
                                    {{ \Carbon\Carbon::parse($press->publishedAt)->format('d-m-Y') }}
                                </time>
                            </div>
                        </div>
                    </div>
                    @endforeach
                </div>

                <div class="col-xl-8 col-lg-7 mt-3 mt-lg-0 ps-lg-4 order-1 order-sm-2">
                    <div class="row">
                        <div class="col-xl-12">
                            @if($mainNews)
                                <x-pressrelease-card :title="$mainNews->title" :url="URL::to($mainNews->alias)"
                                    :image="$mainNews->image" :imgAltTitle="$mainNews->img_alt_title ?? $mainNews->title"
                                    :authorName="$mainNews->postAuthor->dispaly_name ?? 'Admin'"
                                    :authorUrl="@$mainNews->postAuthor->slug ? URL::to('crypto-author/'.$mainNews->postAuthor->slug) : null"
                                    :publishedAt="$mainNews->publishedAt" :key="$mainNews->id" type="big" />
                            @endif
                        </div>
                    </div>
                    <div class="col-xl-12">
                        <div class="row mt-3 press-cards">
                            @foreach($cardNews as $press)
                            <div class="col-xl-6">
                                <x-pressrelease-card :title="$press->title" :url="URL::to($press->alias)"
                                    :image="$press->image" :imgalttitle="$press->img_alt_title ?? $press->title"
                                    :authorName="$press->postAuthor->dispaly_name ?? 'Admin'"
                                    :authorUrl="@$press->postAuthor->slug ? URL::to('crypto-author/'.$press->postAuthor->slug) : null"
                                    :publishedAt="$press->publishedAt" :key="$press->id" type="small" />
                            </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{-- ══ 6. Press release — newswire ══ --}}

    <section class="mb-3 newscard-presale">
        <div class="container">
            <div class="bg-gradient rounded-3 p-4">
                <div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
                    <div>
                        <h2 class="h5 fw-bold text-white mb-0">Crypto Press Release</h2>
                        <span class="fs-13 link-customize457">Submitted by projects and distribution partners &mdash; not editorial coverage.</span>
                    </div>
                    <div>
                        <a href="{{ URL::to('submit-crypto-press-release') }}" title="Submit Crypto Press Release"
                            class="text-decoration-none btn-main fs-14 py-1 px-3 me-2">Submit Press Release</a>
                        <a href="{{ URL::to('crypto-press-release') }}"
                            title="Distribute your Crypto Presale or ICO Press Release with Crypto Presale News"
                            class="text-decoration-none btn btn-border text-white fs-14 py-1 px-3">View More</a>
                    </div>
                </div>

                <div class="row">
                    @foreach($wireList as $press)
                        <div class="col-xl-6">
                            <div class="d-flex gap-3 py-3 align-items-start flex-wrap flex-md-nowrap {{ ($loop->remaining < 2) ? '' : 'border-bottom border-secondary' }}">
                                <a href="{{ URL::to('crypto-author/'.$press->postAuthor->slug) }}" class="text-decoration-none" title="Meet {{ $press->postAuthor->dispaly_name ?? 'Admin' }}, Crypto Journalist at Crypto Presale News">
                                    <span class="wire-src fs-11 rounded-1 text-nowrap py-1">{{ $press->postAuthor->dispaly_name ?? 'Admin' }}</span>
                                </a>
                                <div>
                                    <a href="{{ URL::to($press->alias) }}" title="{{ $press->title }}" class="text-decoration-none">
                                        <span class="fs-15 text-white one-line-text">{{ $press->title }}</span>
                                    </a>
                                    <time class="lh-1 fs-12 link-customize457" datetime="{{ \Carbon\Carbon::parse($press->publishedAt)->toIso8601String() }}">
                                        {{ \Carbon\Carbon::parse($press->publishedAt)->format('d-m-Y') }}
                                    </time>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </section>

    {{-- ══ 2. THE BOARD ══ --}}
    <section class="tablesection py-4 overflow-hidden">
        <div class="container">
            <div class="d-flex align-items-end justify-content-between flex-wrap gap-2 mb-3">
                <div>
                    <h2 class="h4 fw-bold bluetext mb-0 d-flex align-items-center gap-2">
                        <span class="livedot rounded-circle d-inline-block"></span> Live Presale Board
                    </h2>
                    <span class="fs-13 textclr">Every listed project, sorted by close date. Featured rows are paid placements.</span>
                </div>
                <div class="d-flex gap-2 align-items-center">
                    <a href="{{ URL::to('submit-crypto-presale-ico-ido-ieo-projects') }}" title="Submit project"
                        class="btn btnanimation px-3 py-1">Submit your project!</a>
                    <a href="{{ URL::to('crypto-presale') }}" title="View all presales"
                        class="btn bg-gradient px-4 text-light text-decoration-none fs-14 rounded-pill">View all {{ $totalListed }} presales</a>
                </div>
            </div>

            <div class="boardtable rounded-3 overflow-hidden">
                <div class="table-responsive">
                    <table class="table table-bg table-striped table-manage mb-0">
                        <thead>
                            <tr class="text-center">
                                <th>S.No</th>
                                <th>Name</th>
                                <th>Launchpad</th>
                                <th>Type</th>
                                <th>Ends in </th>
                                <th>Total Boosts</th>
                                <th>Tokens for Sale</th>
                                <th>Rate</th>
                                <th>Fundraising Goal</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($featuredIcos as $listing)
                            <tr class="text-center is-featured @if($type !=5 ) {{ $listing['featured_class'] }} @endif
                                align-middle">
                                <td>{{ $loop->iteration }}</td>
                                <x-ico-table-cart :id="$listing['id']" :name="$listing['name']"
                                    :fullName="$listing['full_name']" :symbol="$listing['symbol']"
                                    :image="$listing['src']" :price_usd="$listing['price_usd']"
                                    :goal="$listing['goal']" :status="$listing['status']"
                                    :startdate="$listing['start_date']" :enddate="$listing['end_date']"
                                    :endsIn="CommonHelper::timeElapsedString($listing['ends_in'])"
                                    :icoUrl="$listing['ico_url']" :buy_url="$listing['buy_url']"
                                    :featured="$type === 5 ? null : $listing['featured']"
                                    :featured_dark_class="$listing['featured_dark_class']"
                                    :featured_class="$listing['featured_class']"
                                    :imgAltTitle="$listing['img_alt_title'] ?? $listing['name']"
                                    :launchpad="$listing['launchpad']" :projectType="$listing['ico_ido_type']"
                                    :likeCount="$listing['likeCount']"
                                    :quantityOfCoin="$listing['quantity_of_coin']"
                                    :icoPrice="$listing['ico_price']" :acceptType="$listing['accept_type']"
                                    :featuredVal="$listing['featured_val']"
                                    :fundAskingFor="$listing['fund_asking_for']" :liked="$listing['liked']"
                                    :favorite="$listing['favorite']" :type="'fuel'" :likd="1"
                                    :likescounts="$listing['likes_counts']" mode="list" />
                            </tr>
                            @empty

                            @endforelse

                            @forelse($unfeaturedIcos as $listing)
                            <tr class="text-center @if($type !=5 ) {{ $listing['featured_class'] }} @endif align-middle">
                                <td>{{ count($featuredIcos ?? []) + $loop->iteration }}</td>
                                <x-ico-table-cart :id="$listing['id']" :name="$listing['name']"
                                    :fullName="$listing['full_name']" :symbol="$listing['symbol']"
                                    :image="$listing['src']" :price_usd="$listing['price_usd']"
                                    :goal="$listing['goal']" :status="$listing['status']"
                                    :startdate="$listing['start_date']" :enddate="$listing['end_date']"
                                    :endsIn="CommonHelper::timeElapsedString($listing['ends_in'])"
                                    :icoUrl="$listing['ico_url']" :buy_url="$listing['buy_url']"
                                    :featured="$type === 5 ? null : $listing['featured']"
                                    :featured_dark_class="$listing['featured_dark_class']"
                                    :featured_class="$listing['featured_class']"
                                    :imgAltTitle="$listing['img_alt_title'] ?? $listing['name']"
                                    :launchpad="$listing['launchpad']" :projectType="$listing['ico_ido_type']"
                                    :likeCount="$listing['likeCount']"
                                    :quantityOfCoin="$listing['quantity_of_coin']"
                                    :icoPrice="$listing['ico_price']" :acceptType="$listing['accept_type']"
                                    :featuredVal="$listing['featured_val']"
                                    :fundAskingFor="$listing['fund_asking_for']" :liked="$listing['liked']"
                                    :favorite="$listing['favorite']" :type="'fuel'" :likd="1"
                                    :likescounts="$listing['likes_counts']" mode="list" />
                            </tr>
                            @empty
                            @endforelse

                            @if($totalListed === 0)
                            <tr class="text-center">
                                <td class="text-center" colspan="10">No Data Found</td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <img src="{{ URL::asset('assets/images/vector-row-bg.webp') }}" width="289" height="417" alt="vector" class="centertable" />
    </section>

    {{-- ══ Trending Presales / Categories / Blockchains — sab dynamic ══ --}}
    <section class="tablesection pb-5 pt-2">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-md-6 col-xl-4">
                    <div class="rounded-2 card h-100">
                        <div class="d-flex align-items-center justify-content-between topheader border-0 p-3">
                            <a href="{{ URL::to('trending-crypto-presales') }}" title="Trending Presales"
                                class="h5 mb-0 fw-bold text-decoration-none">Trending Presales</a>
                            <a href="{{ URL::to('trending-crypto-presales') }}" title="View all trending presales"
                                class="fs-13 link-customize text-decoration-none">View all <i class="fa-solid fa-angles-right"></i></a>
                        </div>

                        @forelse($trendingIcos ?? [] as $item)
                        <x-home-ico-card :title="$item['name'] ?? ''" :id="$item['symbol'] ?? ''"
                            :url="URL::to(RssFeedHelper::getIcoType($item['ico_ido_type'])['slug'].'/' . ($item['slug'] ?? ''))"
                            :image="$item['src'] ?? ''" :imgalttitle="$item['img_alt_title'] ?? $item['name']"
                            :totalcoin="CommonHelper::numberToMbtShort($item['total_coin'] ?? '')" />
                        @empty
                            <div class="col text-center text-muted my-4">
                                No Data Found
                            </div>
                        @endforelse
                    </div>
                </div>

                <div class="col-md-6 col-xl-4 mt-3 mt-md-0">
                    <div class="rounded-2 card h-100">
                        <div class="d-flex align-items-center justify-content-between topheader border-0 p-3">
                            <a href="{{ URL::to('crypto-categories') }}" title="Trending Crypto Categories"
                                class="text-decoration-none h5 mb-0 fw-bold">Trending Categories</a>
                            <a href="{{ URL::to('crypto-categories') }}" title="View all categories"
                                class="fs-13 link-customize text-decoration-none">View all <i class="fa-solid fa-angles-right"></i></a>
                        </div>

                        @forelse($trendingCategories as $item)
                        <a href="{{ URL::to('crypto-categories/'.$item['slug']) }}" title="{{ $item['name'] }}"
                            class="block_Table p-3 pt-2 border-0 text_customization d-block">
                            <div class="d-flex align-items-center justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <span class="bg-number d-flex justify-content-center align-items-center rounded-circle fw-bold">
                                        {{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}
                                    </span>
                                    <div>
                                        <span class="fw-semibold mb-0 d-block">{{ $item['name'] }}</span>
                                        <span class="fs-13 textclr">{{ $item['value'] }}</span>
                                    </div>
                                </div>
                                <span class="fs-14 fw-bold">View Projects <i class="fa-solid fa-angle-right ms-1"></i></span>
                            </div>
                        </a>
                        @empty
                        <div class="col text-center text-muted my-4">
                            No Data Found
                        </div>
                        @endforelse
                    </div>
                </div>

                <div class="col-md-6 col-xl-4 mt-3 mt-xl-0">
                    <div class="rounded-2 card h-100">
                        <div class="d-flex align-items-center justify-content-between topheader border-0 p-3">
                            <a href="{{ URL::to('crypto-blockchain') }}" title="Trending Crypto Blockchains"
                                class="text-decoration-none h5 mb-0 fw-bold">Trending Blockchains</a>
                            <a href="{{ URL::to('crypto-blockchain') }}" title="View all blockchains"
                                class="fs-13 link-customize text-decoration-none">View all <i class="fa-solid fa-angles-right"></i></a>
                        </div>

                        @forelse($trendingBlockchains as $item)
                        <a href="{{ URL::to('crypto-blockchain/'.$item['slug']) }}" title="{{ $item['name'] }}"
                            class="block_Table p-3 pt-2 border-0 text_customization d-block">
                            <div class="d-flex align-items-center justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <span class="bg-number d-flex justify-content-center align-items-center rounded-circle fw-bold">
                                        {{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}
                                    </span>
                                    <div>
                                        <span class="fw-semibold mb-0 d-block">{{ $item['name'] }}</span>
                                        <span class="fs-13 textclr">{{ $item['value'] }}</span>
                                    </div>
                                </div>
                                <span class="fs-14 fw-bold">View Projects <i class="fa-solid fa-angle-right ms-1"></i></span>
                            </div>
                        </a>
                        @empty
                        <div class="col text-center text-muted my-4">
                            No Data Found
                        </div>
                        @endforelse
                    </div>
                </div>

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

    {{-- ══ 7. Promote ══ --}}
    <section class="my-3">
        <div class="container">
            <div class="row">
                <div class="col-xl-12">
                    <div class="bg-gradientpresale p-4 rounded-3 shadow-sm">
                        <h2 class="fw-bold h4 text-center d-block">
                            Promote Your Crypto Project to a Global Audience
                        </h2>
                        <p class="mt-3 text-center">
                            Looking to give your crypto presale, ICO, IDO, or IEO maximum
                            visibility? Cryptopresalenews.com connects your project with a
                            global audience of active investors, providing real-time
                            market exposure, unlimited project updates, and 24/7 support.
                            Our marketing solutions help you reach the right audience
                            through multiple channels:
                        </p>
                        <div class="row">
                            <div class="col-lg-4 text-center" data-aos="fade-down">
                                <img src="{{ URL::asset('assets/images/sales.png') }}" alt="bannerads"
                                    class="my-3 d-block mx-auto" width="64" height="64" />
                                <span
                                    class="bg-number d-flex justify-content-center align-items-center rounded-circle m-auto fw-bold my-2">
                                    1
                                </span>
                                <span class="fw-bold h5">Presale / ICO Press Release Services</span>
                                <p>
                                    Enhance your crypto project's visibility with a Professional Presale / ICO Press
                                    Release
                                </p>
                            </div>
                            <div class="col-lg-4 text-center" data-aos="fade-down">
                                <img src="{{ URL::asset('assets/images/online-advertising.png') }}" alt="bannerads"
                                    class="my-3 d-block mx-auto" width="64" height="64" />
                                <span
                                    class="bg-number d-flex justify-content-center align-items-center rounded-circle m-auto fw-bold my-2">
                                    2
                                </span>
                                <span class="fw-bold h5">Banner Ads</span>
                                <p>
                                    Display your project on high-traffic category pages,
                                    top-of-page sections, or mid-page placements for optimal
                                    visibility.
                                </p>
                            </div>
                            <div class="col-lg-4 text-center" data-aos="fade-up">
                                <img src="{{ URL::asset('assets/images/features.png') }}" alt="featured"
                                    class="my-3 d-block mx-auto" width="64" height="64" />
                                <span
                                    class="bg-number d-flex justify-content-center align-items-center rounded-circle m-auto fw-bold my-2">
                                    3
                                </span>
                                <span class="fw-bold h5">Featured Listings</span>
                                <p>
                                    Unlock top placement for 15 days to ensure your project
                                    gets maximum attention.
                                </p>
                            </div>

                            <div class="col-xl-12 d-flex mx-auto justify-content-center gap-3 mt-3 flex-wrap">
                                <a class="btn btnanimation d-flex w-fit"
                                    href="{{ URL::to('crypto-presale-ico-marketing-campaign') }}"
                                    title="Promote Crypto Project Now"> Promote Your Crypto Project Now </a>
                                <a class="btn btnanimation d-flex w-fit"
                                    href="{{ url('contact-crypto-presale-team') }}"
                                    title="Contact Crypto Presale Team"> Contact Us </a>
                                <a class="btn btnanimation d-flex w-fit"
                                    href="{{ url('about-us') }}"
                                    title="About Crypto Presale News"> About Us </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{--  @if(!empty($faqs))
    <livewire:faq-section pageType="home" />
    @endif --}}

    @push('scripts')
    <script>
    function toggleAccordion(button) {
        const item = button.parentElement;
        const content = item.querySelector('.accordion-content');
        const icon = button.querySelector('.icon');

        if (content.style.display === "block") {
            content.style.display = "none";
            button.setAttribute("aria-expanded", "false");
            icon.textContent = "+";
            item.classList.remove('active');
        } else {
            document.querySelectorAll('.accordion-item').forEach(i => {
                i.querySelector('.accordion-content').style.display = 'none';
                i.querySelector('.accordion-header').setAttribute('aria-expanded', 'false');
                i.querySelector('.icon').textContent = '+';
                i.classList.remove('active');
            });

            content.style.display = "block";
            button.setAttribute("aria-expanded", "true");
            icon.textContent = "-";
            item.classList.add('active');
        }
    }
    </script>
    <script>
    function submitCoinForm() {
        window.location.href = '{{ URL::to('submit-crypto-presale-ico-ido-ieo-projects') }}';
    }
    </script>

    <script>
    function likePost(id, type) {
        const routeUrl = type === 'fuel' ?
            '{{ route("ico.toggleFuel") }}' :
            '{{ route("ico.toggleStar") }}';
        const msgDiv = document.getElementById('like-message-' + id);
        const starIcon = document.getElementById('star-icon-' + id);
        const fuelText = document.getElementById('fuel-text-' + id);

        fetch(routeUrl, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                body: JSON.stringify({
                    ico_id: id
                })
            })
            .then(res => res.json())
            .then(data => {
                msgDiv.textContent = data.message || 'Updated!';
                msgDiv.className = 'small text-center position-absolute fs-12 text-nowrap ' +
                    (data.status ? 'text-success' : 'text-danger');

                // ⭐ handle star icon toggle
                if (type === 'fuel') {
                    if (fuelText) {
                        fuelText.textContent = data.type || 'Fuel';
                    }
                }
                // ⭐ handle star icon toggle
                if (type === 'star') {
                    if (data.action === 'added') {
                        starIcon.classList.remove('fa-regular', 'text-black');
                        starIcon.classList.add('fa-solid', 'text-warning');
                    } else if (data.action === 'removed') {
                        starIcon.classList.remove('fa-solid', 'text-warning');
                        starIcon.classList.add('fa-regular', 'text-black');
                    }
                }
            })
            .catch(err => {
                console.error(err);
                msgDiv.textContent = 'Something went wrong.';
                msgDiv.className = 'mt-0 small likebtn text-center text-danger';
            })
            .finally(() => {
                // btn.disabled = false;
            });
    }
</script>
    @endpush
</div>