@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.crypto-author');
@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]]) !!}
@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('/') }}" class="text-decoration-none text-white" title="Home">Home</a></li>
                        <li>{{ $seoData['breadcrumb'] ?? 'Crypto Directory' }}</li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
    <section class="my-2 directorytabs">
        <div class="container">
            <div class="row">
                <div class="col-xl-12 col-12 text-center topheading">
                    {!! $seoData['top_page_content'] !!}
                </div>
                <div class="col-xl-12 review-tabs">
                    <button class="nav-link {{ $activeTab === 'projects' ? 'active' : '' }}"
                        wire:click="setTab('projects')">
                        क्रिप्टो प्रोजेक्ट्स
                    </button>

                    <button class="nav-link {{ $activeTab === 'founders' ? 'active' : '' }}"
                        wire:click="setTab('founders')">
                        क्रिप्टो संस्थापक
                    </button>

                    <button class="nav-link {{ $activeTab === 'influencers' ? 'active' : '' }}"
                        wire:click="setTab('influencers')">
                        क्रिप्टो इन्फ्लुएंसर्स
                    </button>

                    <!-- <button class="nav-link {{ $activeTab === 'reviews' ? 'active' : '' }}"
                        wire:click="setTab('reviews')">
                        रिव्यूज़
                    </button> -->

                    @if($activeTab === 'projects')
                    {{-- PROJECT TABLE --}}

                    <section>
                        <div class="container">
                            <div class="row">
                                <div class="col-xl-12 col-12 text-center">
                                    <h2
                                        class="h4 fw-bold  mb-3 position-relative centerborder d-inline-block ">क्रिप्टो
                                        प्रोजेक्ट्स</h2>
                                    <p class="fs-6">Discover leading crypto & blockchain projects — from India and
                                        across the globe. Explore innovations, missions, token details, utilities,
                                        roadmap, funding, and key contributors.</p>
                                </div>
                                <div class="col-xl-12">
                                    <div class="d-flex my-3 mb-sm-2 justify-content-end align-items-center">
                                        <select class="form-control py-1 me-2 select-form"
                                            wire:model="selectedCategory">
                                            <option value="">--Select Category--</option>
                                            @foreach($allCategory as $key => $category)
                                            <option value="{{ $key }}">{{ $category }}</option>
                                            @endforeach
                                        </select>

                                        <select class="form-control py-1 me-2 select-form" wire:model="selectedYear">
                                            <option value="">--Select Year--</option>
                                            @foreach($allYear as $year)
                                            <option value="{{ $year }}">{{ $year }}</option>
                                            @endforeach
                                        </select>
                                        <!-- <input class="form-control py-2 me-2" type="text" placeholder="Selected Year" wire:model="selectedYear"> -->

                                        <input class="form-control py-2 me-2" type="text" id="search-keyword-feature"
                                            placeholder="Search By Keyword..." wire:model="searchKeyword">

                                        <div class="d-flex align-items-center justify-content-center">
                                            <button class="btn btn-primary py-1 me-2" wire:click="applyFilters"
                                                title="Search">
                                                <i class="fa fa-search fs-6"></i>
                                            </button>

                                            <button class="btn btn-danger py-1" wire:click="resetFilters" title="Reset">
                                                <i class="fa fa-refresh fs-6"></i>
                                            </button>

                                        </div>


                                    </div>


                                    <table
                                        class="table table-bordered  even-odd-tbl table-hover tablealign bg-white table-responsive d-lg-table d-block">
                                        <thead class="tbl-sticky">
                                            <tr class="text-center">
                                                <th class="sortable asc" data-sort="0">Project Name</th>
                                                <th data-bs-toggle="tooltip" data-bs-placement="top"
                                                    data-bs-title="नाम">Founder</th>
                                                <th class="sortable" data-sort="2">Founding Year </th>
                                                <th class="sortable" data-sort="3">Project Category </th>
                                            </tr>
                                        </thead>
                                        <tbody id="ico-listings">

                                            @forelse($directoryData as $key => $value)
                                            <tr>
                                                <td class="w-50">
                                                    <a href="{{ url('crypto-projects/' . $value['slug']) }}"
                                                        title="{{ $value['project_name'] }}"
                                                        class="text-decoration-none text-dark d-block">

                                                        <div class="d-flex gap-2">
                                                            <div class="pr_img">
                                                                <img alt="{{ $value['project_name'] }}"
                                                                    src="{{ $value['image'] }}" width="70" height="70"
                                                                    class="rounded-3">
                                                            </div>

                                                            <div class="pr_content">
                                                                <span class="h6 fw-bold text-black d-block mb-0">
                                                                    {{ $value['project_name'] }}
                                                                </span>

                                                                <span class="fs-12 two-line-text text-muted">
                                                                    {!! \Illuminate\Support\Str::words($value['short_description'], 100, '...') !!}
                                                                </span>
                                                            </div>
                                                        </div>

                                                    </a>
                                                </td>

                                                <td>
                                                    @php
                                                    $founders = $value['founders'] ?? [];
                                                    $displayLimit = 2;
                                                    @endphp

                                                    <div class="founders-list d-flex align-items-center">
                                                        @foreach(array_slice($founders, 0, $displayLimit) as $founder)
                                                        <span
                                                            class="gradColor px-2 py-1 shadow-sm rounded-3 me-1 fs-13 border-0 mt-0">
                                                            {{ $founder['founder_name'] }}
                                                        </span>
                                                        @endforeach

                                                        @if(count($founders) > $displayLimit)
                                                        <div class="dropdown d-inline-block">
                                                            <span
                                                                class="btn-gradient text-white px-2 py-1 shadow-sm rounded-3 dropdown-toggle fs-13"
                                                                data-bs-toggle="dropdown">
                                                                More
                                                            </span>
                                                            <ul class="dropdown-menu shadow-sm border-0">
                                                                @foreach(array_slice($founders, $displayLimit) as $founder)
                                                                <li>
                                                                    <span
                                                                        class="dropdown-item">{{ $founder['founder_name'] }}</span>
                                                                </li>
                                                                @endforeach
                                                            </ul>
                                                        </div>
                                                        @endif
                                                    </div>
                                                </td>

                                                <td class="text-center">{{ $value['funding_year'] ?? '-' }}</td>

                                                <td>
                                                    @php
                                                    $categories = $value['project_categories'] ?? [];
                                                    $displayLimit = 2;
                                                    @endphp

                                                    <div class="categories-list d-flex align-items-center">
                                                        @foreach(array_slice($categories, 0, $displayLimit) as $category)
                                                        <span
                                                            class="gradColor px-2 py-1 shadow-sm rounded-3 me-1 fs-13 border-0 mt-0">
                                                            {{ $category['title'] }}
                                                        </span>
                                                        @endforeach

                                                        @if(count($categories) > $displayLimit)
                                                        <div class="dropdown d-inline-block">
                                                            <span
                                                                class="btn-gradient text-white px-2 py-1 shadow-sm rounded-3 dropdown-toggle fs-13"
                                                                data-bs-toggle="dropdown">
                                                                More
                                                            </span>
                                                            <ul class="dropdown-menu shadow-sm border-0">
                                                                @foreach(array_slice($categories, $displayLimit) as $category)
                                                                <li>
                                                                    <span
                                                                        class="dropdown-item">{{ $category['title'] }}</span>
                                                                </li>
                                                                @endforeach
                                                            </ul>
                                                        </div>
                                                        @endif
                                                    </div>
                                                </td>
                                            </tr>

                                            @empty
                                            <tr>
                                                <td colspan="4" class="text-center py-4 text-muted">
                                                    No data found
                                                </td>
                                            </tr>
                                            @endforelse

                                        </tbody>



                                    </table>
                                    <div class="d-flex justify-content-center">
                                        <a href="{{ url('/crypto-projects') }}" class="btn btn-primary rounded-3 mt-3">
                                            View All
                                        </a>
                                    </div>

                                </div>


                            </div>
                        </div>
                </div>
    </section>
    @endif

    @if($activeTab === 'founders')
    {{-- FOUNDERS GRID --}}

    <section>
        <div class="container">
            <div class="row">
                <div class="col-xl-12 col-12 text-center">
                    <span
                        class="h4 fw-bold  mb-3 position-relative centerborder d-inline-block ">क्रिप्टो
                        संस्थापक</span>
                    <p class="fs-6">Meet top crypto founders shaping Web3 innovation. Detailed profiles
                        of visionary leaders from India and worldwide, covering achievements, startups,
                        investments, journeys, and industry insights.</p>
                </div>
                <div class="col-xl-12">
                    <div class="d-flex my-3 mb-sm-3 justify-content-end align-items-center">

                        <input class="form-control py-2  me-2" id="search-keyword-feature"
                            placeholder="Search By Keyword..." type="text" wire:model="founderKeyword">
                        <div class="d-flex align-items-center justify-content-center">
                            <button class="btn btn-primary py-1 me-2" id="search-btn-currency"
                                title="Search" wire:click="searchFounders">
                                <i class="fa fa-search fs-6"></i>
                            </button>

                            <button class="btn btn-danger py-1 " id="reset-btn-currency" title="Reset"
                                wire:click="resetFiltersFounders">
                                <i class="fa fa-refresh fs-6"></i>
                            </button>
                        </div>
                    </div>
                </div>

                <div class="row">

                    @forelse ($allfounders as $founder)
                    <div class="col-xl-3 mb-3">
                        <div class="gradColor rounded-3 p-3 text-center h-100">

                            <a href="{{ url('crypto-founders/' . $founder['slug']) }}"
                                title="{{ $founder['founder_name'] }}"
                                class="text-decoration-none text-dark d-block">
                                <img alt="हमारे बारे में" src="{{ $founder['image'] }}"
                                    class="img-fluid rounded-circle" width="110" height="110">
                            </a>

                            <div class="d-flex gap-3 justify-content-center align-items-center mt-2">
                                <a href="{{ url('crypto-founders/' . $founder['slug']) }}"
                                    title="{{ $founder['founder_name'] }}"
                                    class="text-decoration-none text-dark d-block">
                                    <span class="fs-14 fw-bold">{{ $founder['founder_name'] }}</span>
                                </a>
                                @php
                                $socials = [
                                'facebook_url' => 'fa-facebook-f',
                                'twitter_url' => 'fa-x-twitter',
                                'instagram_url' => 'fa-instagram',
                                'linkedin_url' => 'fa-linkedin-in',
                                'telegram' => 'fa-telegram',
                                'youtube' => 'fa-youtbue',
                                ];
                                @endphp

                                <div class="sharedetails d-flex gap-1">
                                    @foreach($socials as $key => $icon)
                                    @if(!empty($founder[$key]))
                                    <a href="{{ $founder[$key] }}" target="_blank"
                                        rel="noopener noreferrer">
                                        <i class="fa-brands {{ $icon }} me-2"></i>
                                        <span
                                            class="d-none">{{ ucfirst(str_replace('_url', '', $key)) }}</span>
                                    </a>
                                    @endif
                                    @endforeach
                                </div>
                            </div>

                            @php
                            $projects = $founder['crypto_projects'] ?? [];
                            $displayLimit = 2;
                            @endphp

                            @if(!empty($projects))
                            <div
                                class="d-flex gap-2 justify-content-center align-items-center mt-1 mb-2">

                                @foreach(array_slice($projects, 0, $displayLimit) as $project)
                                <a href="{{ url('crypto-projects/' . $project['slug']) }}"
                                    class="text-decoration-none d-flex align-items-center gap-1"
                                    title="{{ $project['project_name'] }}">

                                    <img alt="{{ $project['project_name'] }}"
                                        src="{{ $project['image'] ?? 'https://via.placeholder.com/22' }}"
                                        class="rounded-circle" width="22" height="22">

                                    <span class="fs-14 text-secondary">
                                        {{ $project['project_name'] }}
                                    </span>
                                </a>
                                @endforeach

                                @if(count($projects) > $displayLimit)
                                <div class="dropdown">
                                    <span class="btn btn-sm btn-light dropdown-toggle fs-13"
                                        data-bs-toggle="dropdown">
                                        More
                                    </span>

                                    <ul class="dropdown-menu shadow-sm border-0">
                                        @foreach(array_slice($projects, $displayLimit) as $project)
                                        <li>
                                            <a class="dropdown-item d-flex align-items-center gap-2"
                                                href="{{ url('crypto-projects/' . $project['slug']) }}">

                                                <img src="{{ $project['image'] ?? 'https://via.placeholder.com/18' }}"
                                                    class="rounded-circle" width="18" height="18">

                                                {{ $project['project_name'] }}
                                            </a>
                                        </li>
                                        @endforeach
                                    </ul>
                                </div>
                                @endif

                            </div>
                            @endif


                            <span class="fs-14 text-black text-center">
                                {!! \Illuminate\Support\Str::words(strip_tags($founder['description']), 10, '...') !!}

                            </span>
                        </div>
                    </div>

                    @empty
                    <div class="col-12 text-center py-5">
                        <span class="text-muted fs-16">No founders found</span>
                    </div>
                    @endforelse

                </div>

                <div class="d-flex justify-content-center">
                    <a href="{{ url('/crypto-founders') }}" class="btn btn-primary rounded-3 mt-3">
                        View All
                    </a>
                </div>

            </div>
        </div>
    </section>
    @endif

    @if($activeTab === 'influencers')
    {{-- INFLUENCERS GRID --}}
    <section>
        <div class="container">
            <div class="row mb-4">
                <div class="col-xl-12 col-12 text-center">
                    <span
                        class="h4 fw-bold  mb-3 position-relative centerborder d-inline-block ">क्रिप्टो
                        इन्फ्लुएंसर्स</span>
                    <p class="fs-6">Explore verified crypto influencers & KOLs driving Web3 discussions.
                        Find creators from India & globally, covering analysts, traders, educators, and
                        industry voices with proven digital impact. </p>
                </div>
                <div class="col-xl-12">
                    <div class="d-flex my-3 mb-sm-3 justify-content-end align-items-center">
                        <!-- <select class="form-control py-1  me-2 select-form">
                                                <option>--Select Category--</option>
                                            </select> -->
                        <input class="form-control py-2  me-2" id="search-keyword-feature"
                            placeholder="Search By Keyword..." type="text"
                            wire:model="influencerKeyword">
                        <div class="d-flex align-items-center justify-content-center">
                            <button class="btn btn-primary py-1 me-2" id="search-btn-currency"
                                title="Search" wire:click="searchInfluencer">
                                <i class="fa fa-search fs-6"></i>
                            </button>
                            <button class="btn btn-danger py-1 " id="reset-btn-currency" title="Reset"
                                wire:click="resetFiltersInfluencer">
                                <i class="fa fa-refresh fs-6"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                @forelse ($allinfluecers as $influecers)
                <div class="col-md-5th mb-5 md-lg-0">
                    <div class="instagram-border text-center shadow-sm position-relative h-100">

                        <img alt="हमारे बारे में" src="{{ $influecers['image'] }}"
                            class="influencer-img rounded-circle position-absolute left-0 right-0 mx-auto"
                            width="100" height="100">

                        <a href="{{ url('crypto-influencers/' . $influecers['slug']) }}"
                            class="text-decoration-none text-black"
                            title="{{ $influecers['infulencer_name'] }}">
                            <span class="fs-5">{{ $influecers['infulencer_name'] }}</span>
                        </a>

                        <span
                            class="fs-14 text-secondary d-block">{{ $influecers['influencer_profile'] }}</span>

                        <span class="fs-14 mb-3 mt-2 three-lines-text">
                            {!! \Illuminate\Support\Str::words(strip_tags($influecers['description']), 10, '...') !!}
                        </span>

                        @php
                        $socials = [
                        'facebook' => $influecers['facebook_url'] ?? '',
                        'linkedin' => $influecers['linkedin_url'] ?? '',
                        'twitter' => $influecers['twitter_url'] ?? '',
                        'instagram' => $influecers['instagram_url'] ?? '',
                        'telegram' => $influecers['telegram_url'] ?? '',
                        ];
                        @endphp

                        <div class="d-flex gap-2 justify-content-center">
                            @foreach($socials as $platform => $url)
                            @if(!empty($url))
                            <a href="{{ $url }}" target="_blank" rel="nofollow noopener"
                                class="text-decoration-none bg-darkpink rounded-circle p-2 text-white social-icons d-flex justify-content-center align-items-center"
                                title="{{ ucfirst($platform) }}">
                                <i
                                    class="fa-brands fa-{{ $platform === 'twitter' ? 'x-twitter' : $platform }}"></i>
                            </a>
                            @endif
                            @endforeach
                        </div>

                    </div>
                </div>

                @empty
                <div class="col-12 text-center py-5">
                    <span class="text-muted fs-16">No influencers found</span>
                </div>
                @endforelse

                <div class="d-flex justify-content-center">
                    <a href="{{ url('/crypto-influencers') }}" class="btn btn-primary rounded-3 mt-3">
                        View All
                    </a>
                </div>


            </div>
        </div>
    </section>
    @endif

    @if($activeTab === 'reviews')
    <section>
        <div class="container">
            <div class="row">
                <div class="col-xl-12 col-12 text-center">
                    <span
                        class="h4 fw-bold  mb-3 position-relative centerborder d-inline-block ">रिव्यूज़</span>
                    <p class="fs-6">Browse curated listicles, unbiased reviews, and expert breakdowns of
                        crypto trends, projects, tokens, tools & platforms. Trusted research covering
                        India and global Web3 ecosystems.</p>
                </div>
                <div class="col-xl-12">
                    <div class="d-flex my-3 mb-sm-3 justify-content-end align-items-center">
                        <select class="form-control py-1  me-2 select-form">
                            <option>--Select Category--</option>
                        </select>
                        <input class="form-control py-2  me-2" id="search-keyword-feature"
                            placeholder="Search By Keyword..." type="text">
                        <div class="d-flex align-items-center justify-content-center">
                            <button class="btn btn-primary py-1 me-2" id="search-btn-currency"
                                title="Search">
                                <i class="fa fa-search fs-6"></i>
                            </button>
                            <button class="btn btn-danger py-1 " id="reset-btn-currency" title="Reset">
                                <i class="fa fa-refresh fs-6"></i>
                            </button>
                        </div>
                    </div>
                </div>
                @php
                $cards = [
                0 => [
                'title' => 'Top Exchanges - India',
                'description' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed ullamcorper turpis.',
                'icon' => 'https://d1cpau3nfvz3rt.cloudfront.net/crypto-price/2025/december/YawQTjIhY6IJMqQcBpRv.webp',
                'link_text' => 'View All Exchanges',
                'link' => 'top-exchange-reviews'
                ],
                1 => [
                'title' => 'Top Coins',
                'description' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed ullamcorper turpis.',
                'icon' => 'https://d1cpau3nfvz3rt.cloudfront.net/crypto-price/2025/december/YawQTjIhY6IJMqQcBpRv.webp',
                'link_text' => 'View All Coins',
                'link' => 'top-coin-reviews'
                ],
                2 => [
                'title' => 'Top Meme Coins',
                'description' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed ullamcorper turpis.',
                'icon' => 'https://d1cpau3nfvz3rt.cloudfront.net/crypto-price/2025/december/YawQTjIhY6IJMqQcBpRv.webp',
                'link_text' => 'View All Meme Coins',
                'link' => 'top-meme-reviews'
                ],
                3 => [
                'title' => 'Top Blockchains',
                'description' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed ullamcorper turpis.',
                'icon' => 'https://d1cpau3nfvz3rt.cloudfront.net/crypto-price/2025/december/YawQTjIhY6IJMqQcBpRv.webp',
                'link_text' => 'View All Blockchains',
                'link' => 'top-blockchain-reviews'
                ],
                ];

                @endphp
                @foreach($cards as $key => $card)
                <div class="col-xl-3">
                    <div class="bg-white pinkborder rounded-3 shadow-sm p-3">

                        <div class="d-flex align-items-center">
                            <div
                                class="bg-pink p-1 d-flex align-items-center justify-content-center rounded-2 me-2">
                                <img src="{{ $card['icon'] }}" width="24" height="24" alt="">
                            </div>
                            <span class="fw-bold text-black one-line-text">
                                {{ $card['title'] }}
                            </span>
                        </div>

                        <p class="mb-2 fs-13 lh-base">
                            {{ $card['description'] }}
                        </p>
                        @if(isset($allreview[$key]) && count($allreview[$key]) > 0)
                        @foreach($allreview[$key] as $item)
                        <div class="gradColor py-1 px-2 rounded-3 shadow-sm mb-3 border-0">
                            <a href="{{ URL::to('review-details/'.$item['slug']) }}" title="{{ $item['review_name'] }}" class="d-flex align-items-center text-decoration-none">
                                <img src="{{ $item['crypto_project']['image'] }}" width="16" height="16" class="me-2"
                                    alt="{{ $item['review_name'] }}">
                                <span>{{ $item['review_name'] }}</span>
                            </a>
                        </div>
                        @endforeach
                        @endif
                        <div class="d-flex justify-content-center my-2">
                            <a href="{{ URL::to( $card['link']) }}" class="fs-14 fw-bold text-pink">
                                {{ $card['link_text'] }}
                                <i class="fa-solid fa-arrow-right"></i>
                            </a>
                        </div>

                    </div>
                </div>
                @endforeach


            </div>
        </div>
    </section>
    @endif

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