@extends('layouts.user')

@section('title')
    Apply For Grant
@endsection

@section('content')
<!-- Start Hero -->
<section class="relative w-full overflow-hidden py-44 lg:py-56" style="top: 70px; height: 400px;">
    <!-- Hero Background Image with Parallax Effect -->
    <!--<div class="absolute inset-0 bg-[url('{{ asset('images/grant-1.jpg') }}')] bg-no-repeat bg-center bg-cover scale-110"></div>-->
    <div
        class="absolute inset-0 bg-no-repeat bg-center bg-cover scale-110"
        style="background-image: url('{{ asset('images/grant-1.jpg') }}');"
    ></div>
    <!-- Multi-layer Gradient Overlay -->
    <div class="absolute inset-0 bg-gradient-to-br from-slate-900/90 via-orange-900/85 to-slate-900/90"></div>
    <div class="absolute inset-0 bg-gradient-to-t from-slate-900/50 via-transparent to-transparent"></div>
    
    <div class="container relative z-10">
        <div class="grid grid-cols-1 pb-8 text-center">
            <div class="inline-block px-6 py-2 mb-6 text-sm font-bold tracking-wider text-orange-400 uppercase border-2 border-orange-400 rounded-full w-fit mx-auto backdrop-blur-sm bg-slate-900/30 shadow-lg">
                💻 GEAS Enterprise Program
            </div>
            <h1 class="text-5xl font-black leading-tight tracking-tight text-white lg:text-7xl drop-shadow-2xl mb-6">
                Global Enterprise<br/>
                <span class="text-transparent bg-clip-text bg-gradient-to-r from-orange-400 via-orange-500 to-orange-600">Growth Fund</span>
            </h1>
            <p class="max-w-3xl mx-auto text-xl font-medium text-gray-200 drop-shadow-lg lg:text-2xl">
                Strategic capital injection to scale high-performing merchants
            </p>
        </div>
    </div>

    <div class="absolute z-10 mx-3 text-center bottom-5 start-0 end-0">
        <ul class="tracking-[0.5px] mb-0 inline-block backdrop-blur-sm bg-slate-900/30 px-4 py-2 rounded-full">
            <li class="inline-block uppercase text-[13px] font-bold duration-500 ease-in-out text-white/70 hover:text-white"><a href="{{ url('/') }}">Home</a></li>
            <li class="inline-block text-base text-white/50 mx-0.5 ltr:rotate-0 rtl:rotate-180"><i class="mdi mdi-chevron-right"></i></li>
            <li class="inline-block uppercase text-[13px] font-bold duration-500 ease-in-out text-white" aria-current="page">Apply For Grant</li>
        </ul>
    </div>
</section>
<!-- End Hero -->

<!-- Start Section-->
<section class="relative py-16 bg-gradient-to-b from-white via-slate-50 to-white dark:from-slate-900 dark:via-slate-800 dark:to-slate-900 md:py-24" style="top: 150px;">
    <div class="container relative">
        <x-alert/>
        
        <!-- Full Width Content -->
        <div class="max-w-7xl mx-auto">
            
            <!-- Header Badge -->
            <div class="inline-flex items-center gap-2 px-5 py-3 mb-8 text-base font-semibold text-orange-600 rounded-full bg-orange-50 dark:bg-orange-900/20 dark:text-orange-400 shadow-md">
                <span class="text-2xl">💻</span>
                <span>GEAS Global Enterprise Growth Fund (GEGF)</span>
            </div>

            <!-- Introduction -->
            <div class="p-8 mb-12 border-l-4 border-orange-500 rounded-r-2xl bg-gradient-to-r from-slate-50 to-transparent dark:from-slate-800 shadow-lg">
                <p class="text-xl leading-relaxed text-slate-700 dark:text-slate-300">
                    <span class="text-3xl">🌐</span> The Global E-Commerce Arbitrage Store (GEAS) has officially ratified the <strong>2026 Merchant Grant Initiative</strong>. In coordination with the Board of Directors, GEAS has deployed a <strong class="text-orange-600">$100,000+ liquidity pool</strong> specifically designed to scale high-performing store owners into regional distribution hubs. This is not merely support; it is a <strong>strategic injection of capital</strong> to dominate the C2C (Consumer-to-Consumer) ecosystem.
                </p>
            </div>

            <!-- Scarcity Notice -->
            <div class="p-8 mb-12 border border-orange-300 rounded-2xl bg-gradient-to-br from-orange-50 to-yellow-50 dark:from-orange-900/10 dark:to-yellow-900/10 dark:border-orange-700 shadow-xl">
                <div class="flex items-start gap-4">
                    <span class="text-4xl">⭐</span>
                    <div>
                        <h4 class="mb-3 text-2xl font-bold text-orange-900 dark:text-orange-400">The Logic of Scarcity</h4>
                        <p class="text-lg text-slate-700 dark:text-slate-300">
                            To maintain market stability and ensure high-tier mentorship, only <strong>Qualified Affiliate Stores</strong> will be selected for grant disbursement annually. Selection is based on ecosystem contribution and operational efficiency.
                        </p>
                    </div>
                </div>
            </div>

            <!-- Grant Structure Header -->
            <div class="mb-10 mt-4 text-center">
                <h3 class="text-4xl font-bold text-slate-900 dark:text-white mb-4">Grant Structure</h3>
                <p class="max-w-3xl mx-auto text-lg text-slate-600 dark:text-slate-400">
                    To ensure transparency, capital is unlocked based on the size of your <strong>Managed Merchant Network (MMN)</strong> and the sophistication of your AI tools.
                </p>
            </div>

            <!-- Grant Tiers - 3 Column Grid -->
            <div class="grid gap-8 mb-16 md:grid-cols-2 lg:grid-cols-3">
                <!-- $200 Tier -->
                <div class="overflow-hidden transition-all duration-300 border border-gray-200 rounded-2xl hover:shadow-2xl hover:border-orange-400 hover:-translate-y-2 dark:border-gray-700 dark:hover:border-orange-600">
                    <div class="p-1 bg-gradient-to-br from-orange-400 to-orange-600">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-orange-600">$200</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> DS Amazon AI/Advanced</p>
                                <p><strong>Network:</strong> 10 Active Stores</p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- $500 Tier -->
                <div class="overflow-hidden transition-all duration-300 border border-gray-200 rounded-2xl hover:shadow-2xl hover:border-orange-400 hover:-translate-y-2 dark:border-gray-700 dark:hover:border-orange-600">
                    <div class="p-1 bg-gradient-to-br from-orange-400 to-orange-600">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-orange-600">$500</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> DS Amazon AI/Advanced</p>
                                <p><strong>Network:</strong> 15 Active Stores</p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- $1,000 Tier -->
                <div class="overflow-hidden transition-all duration-300 border border-gray-200 rounded-2xl hover:shadow-2xl hover:border-orange-400 hover:-translate-y-2 dark:border-gray-700 dark:hover:border-orange-600">
                    <div class="p-1 bg-gradient-to-br from-orange-500 to-orange-700">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-orange-600">$1,000</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> DS Amazon AI/Advanced</p>
                                <p><strong>Network:</strong> 20 Active Stores</p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- $5,000 Tier -->
                <div class="overflow-hidden transition-all duration-300 border border-gray-200 rounded-2xl hover:shadow-2xl hover:border-orange-400 hover:-translate-y-2 dark:border-gray-700 dark:hover:border-orange-600">
                    <div class="p-1 bg-gradient-to-br from-orange-600 to-red-600">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-orange-600">$5,000</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> DS Amazon AI/Advanced</p>
                                <p><strong>Network:</strong> 50 Active Stores</p>
                                <p class="pt-3 text-xs font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                    + $500 Executive Bonus
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- $20,000 Tier -->
                <div class="overflow-hidden transition-all duration-300 border-2 border-purple-400 rounded-2xl hover:shadow-2xl hover:-translate-y-2 dark:border-purple-600">
                    <div class="p-1 bg-gradient-to-br from-purple-500 to-orange-600">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-purple-600">$20,000</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> Seller Amp AI/Enterprise</p>
                                <p><strong>Network:</strong> 200 Active Stores</p>
                                <p class="pt-3 text-xs font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                    + $2,000 Executive Bonus
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- $100,000 Tier -->
                <div class="overflow-hidden transition-all duration-300 border-2 border-yellow-400 rounded-2xl hover:shadow-2xl hover:-translate-y-2 dark:border-yellow-600">
                    <div class="p-1 bg-gradient-to-br from-yellow-400 via-orange-500 to-red-600">
                        <div class="p-6 bg-white dark:bg-slate-900">
                            <div class="mb-4">
                                <span class="text-4xl font-black text-yellow-600">$100,000</span>
                            </div>
                            <p class="pt-3 mb-4 text-sm font-bold text-green-600 border-t border-gray-200 dark:border-gray-700">
                                Technical Requirements
                            </p>
                            <div class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                                <p><strong>AI:</strong> Amp AI/Enterprise</p>
                                <p><strong>Network:</strong> 600 Active Stores</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Image Section 1 - Full Width Feature Image -->
            <div class="mb-16 overflow-hidden rounded-3xl shadow-2xl">
                <img src="{{ asset('images/grant-2.jpg') }}" class="w-full h-auto object-cover" alt="GEAS Success Stories">
            </div>

            <!-- Two Column Layout: Compliance + Image -->
            <div class="grid gap-8 mb-16 lg:grid-cols-2 items-start">
                <!-- Compliance Section -->
                <div class="p-8 border-2 border-red-300 rounded-2xl bg-red-50 dark:bg-red-900/10 dark:border-red-700 shadow-xl">
                    <h4 class="mb-6 text-3xl font-bold text-red-900 dark:text-red-400">⚠️ Compliance & Capital Insurance Protocols</h4>
                    <p class="mb-6 text-base text-red-800 dark:text-red-300">
                        To prevent market devaluation and ensure the integrity of the ecosystem, the following Operational Covenants apply. <strong>Failure to adhere results in immediate disqualification:</strong>
                    </p>
                    <ul class="space-y-4 text-sm text-slate-700 dark:text-slate-300">
                        <li class="flex items-start gap-3">
                            <span class="flex-shrink-0 mt-1 text-xl text-red-600">⚡</span>
                            <span>Applications must be submitted <strong>within the first 7 days of AI tool activation</strong>. This ensures we fund only the most proactive entrepreneurs.</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <span class="flex-shrink-0 mt-1 text-xl text-red-600">🔒</span>
                            <span>Grant capital is strictly for inventory turnover. To serve as a system-wide insurance policy, grant capital remains within the trading ecosystem for a <strong>mandatory 60-day cycle</strong>. No external withdrawals of the principal are permitted during this "Seasoning Period."</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <span class="flex-shrink-0 mt-1 text-xl text-red-600">💰</span>
                            <span>The initial grant principal must be reconciled within the <strong>60-day window</strong> to allow for the next wave of merchant funding.</span>
                        </li>
                        <li class="flex items-start gap-3">
                            <span class="flex-shrink-0 mt-1 text-xl text-red-600">📊</span>
                            <span>Criteria are <strong>non-cumulative</strong>. To advance to a higher tier, you must demonstrate the ability to scale a new merchant sector. This prevents "stagnant networks" and ensures constant market expansion.</span>
                        </li>
                    </ul>
                </div>

                <!-- Image Section 2 - Sidebar Feature -->
                <div class="overflow-hidden rounded-3xl shadow-2xl lg:sticky lg:top-24">
                    <img src="{{ asset('images/grant-3.jpg') }}" class="w-full h-full object-cover" alt="GEAS Community Growth">
                </div>
            </div>

            <!-- Executive Deliverables -->
            <div class="p-8 mb-16 rounded-2xl bg-gradient-to-br from-blue-50 to-indigo-50 dark:from-blue-900/10 dark:to-indigo-900/10 shadow-xl">
                <h4 class="mb-6 text-3xl font-bold text-blue-900 dark:text-blue-400">🎯 Executive Deliverables</h4>
                <p class="mb-6 text-lg text-blue-800 dark:text-blue-300">
                    Participants operate not merely as store owners, but as <strong>GEAS Brand Ambassadors</strong> entrusted with representing, scaling, and safeguarding the brand’s market presence.
                </p>
            
                <div class="grid gap-6 md:grid-cols-2">
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">1. Executive Visibility & Leadership</h5>
                        <p class="text-sm text-slate-600 dark:text-slate-400">
                            Ambassadors are required to demonstrate public-facing leadership through live AMAs, structured video conferences, and stakeholder briefings. Passive or text-only engagement is insufficient; visible leadership is mandatory.
                        </p>
                    </div>
            
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">2. Verifiable Digital & Physical Evidence</h5>
                        <p class="text-sm text-slate-600 dark:text-slate-400">
                            Clear video documentation of inventory receipt, stocking activity, and grant-funded product deployment must be uploaded to the portal to ensure auditability, transparency, and operational integrity.
                        </p>
                    </div>
            
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">3. Performance-Based Executive Bonuses</h5>
                        <ul class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                            <li>• Attain the <strong class="text-green-600">$5,000 Performance Tier</strong>: Receive an immediate <strong>$500 Executive Bonus</strong> (fully withdrawable).</li>
                            <li>• Attain the <strong class="text-green-600">$20,000 Performance Tier</strong>: Receive an immediate <strong>$2,000 Executive Bonus</strong> (fully withdrawable).</li>
                        </ul>
                    </div>
            
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">4. Network Renewal & Expansion Policy</h5>
                        <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                            All qualification metrics are strictly <strong>non-cumulative and single-use</strong>.
                        </p>
                        <ul class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                            <li><strong>Principle:</strong> Advancement to higher grant tiers requires demonstrable growth through newly established merchant networks, not prior or recycled data.</li>
                            <li><strong>Policy:</strong> Once a merchant network is used to qualify for a grant, it is permanently retired from eligibility calculations. Each new grant level requires a newly built Managed Merchant Network, ensuring continuous market expansion and ecosystem vitality.</li>
                        </ul>
                    </div>
            
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">5. Operational Accountability & Compliance</h5>
                        <p class="text-sm text-slate-600 dark:text-slate-400">
                            Ambassadors are accountable for maintaining accurate reporting, timely submissions, and full compliance with program guidelines. Failure to meet documentation or engagement standards may result in suspension or revocation of grant privileges.
                        </p>
                    </div>
            
                    <div class="p-6 bg-white rounded-xl shadow-md dark:bg-slate-800 colspan-2">
                        <h5 class="mb-3 text-lg font-semibold text-slate-900 dark:text-white">6. Strategic Benefits & Commercial Rights</h5>
                        <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                            Participation grants access to growth-oriented advantages designed to accelerate business scalability.
                        </p>
                        <ul class="space-y-2 text-sm text-slate-600 dark:text-slate-400">
                            <li>Expanded operational capacity and accelerated store growth through grant-backed inventory.</li>
                            <li>Full retention of profits generated from sales executed using grant-provided capital.</li>
                        </ul>
                    </div>
                </div>
            </div>


            <!-- Closing Statement -->
            <div class="p-10 text-center border-t-4 border-orange-500 rounded-2xl bg-gradient-to-r from-slate-50 to-orange-50 dark:from-slate-800 dark:to-orange-900/20 shadow-xl">
                <p class="text-xl leading-relaxed text-slate-700 dark:text-slate-300 mb-6">
                    We aim to <strong>globalize our reach</strong> in the market and ecommerce space while supporting entrepreneurs who are store owners, and we urge you all who will be benefactors of this <strong>GRANT PROGRAM</strong> to keep to terms as this helps us achieve our dreams together.
                </p>
                <p class="text-3xl font-bold text-orange-600">Good luck! 🚀</p>
            </div>

        </div>
    </div>

    <!-- Grant Application Form Section -->
    <div class="container relative mt-24 md:mt-32" id="add-product">
        <div class="grid grid-cols-1 pb-8 text-center">
            <div class="inline-block px-8 py-3 mx-auto mb-6 text-base font-bold tracking-wider text-orange-600 uppercase border-2 border-orange-400 rounded-full w-fit shadow-lg">
                📝 Application Portal
            </div>
            <h3 class="mb-6 text-5xl font-bold text-slate-900 dark:text-white md:text-6xl">
                Grant Application Form
            </h3>
            <p class="max-w-2xl mx-auto text-xl text-slate-600 dark:text-slate-400">
                Fill the form below to continue your journey to becoming a GEAS Brand Ambassador.
            </p>
        </div>

        @if(count(auth()->user()->investment()?->where('status', 2)->get()) < 1)
        <div class="max-w-4xl p-8 mx-auto mb-8 border-l-4 border-red-500 rounded-r-2xl bg-red-50 dark:bg-red-900/20 shadow-xl" role="alert">
            <div class="flex items-start gap-4">
                <span class="text-3xl">⚠️</span>
                <div>
                    <h4 class="mb-2 text-xl font-bold text-red-900 dark:text-red-400">Active AI Bot Required</h4>
                    <p class="text-base text-red-800 dark:text-red-300">
                        Sorry, you cannot apply for a grant at this time as you do not have an active AI Bot. Please activate your AI Bot to proceed with your application.
                    </p>
                </div>
            </div>
        </div>
        @endif

        <div class="max-w-6xl mx-auto" style="margin-bottom: 100px;">
            <div class="overflow-hidden border border-gray-200 shadow-2xl rounded-3xl dark:border-gray-700 p-4">
                <form method="post" action="{{ route('grant-application') }}" enctype="multipart/form-data">
                    @csrf
                    <div id="productForms">
                        <div class="p-10 bg-white md:p-12 dark:bg-slate-900">
                            <p class="mb-0" id="error-msg"></p>
                            <div id="simple-msg"></div>

                            <input name="status" value="0" type="hidden"/>
                            <input name="user_id" value="{{ auth()->user()->id }}" type="hidden"/>

                            <!-- Grant Selection -->
                            <div class="mb-10">
                                <label class="block mb-4 text-2xl font-bold text-slate-900 dark:text-white">
                                    Select Grant Tier
                                </label>
                                <p class="mb-6 text-base text-slate-600 dark:text-slate-400">
                                    Kindly select the grant tier you qualify for based on your network size and AI tool.
                                </p>
                                <div class="space-y-4">
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="10,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$200 Grant - Starter Tier</span>
                                    </label>
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="20,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$500 Grant - Bronze Tier</span>
                                    </label>
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="50,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$1,000 Grant - Silver Tier</span>
                                    </label>
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="100,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$5,000 Grant - Gold Tier</span>
                                    </label>
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="100,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$20,000 Grant - Platinum Tier</span>
                                    </label>
                                    <label class="flex items-center gap-4 p-5 transition-all border-2 border-gray-200 rounded-xl cursor-pointer hover:border-orange-400 hover:bg-orange-50 dark:border-gray-700 dark:hover:border-orange-600 dark:hover:bg-orange-900/10">
                                        <input type="radio" value="100,000 USD Grant" name="grant_type" required class="w-5 h-5 text-orange-600 focus:ring-orange-500" />
                                        <span class="text-lg font-semibold text-slate-700 dark:text-slate-300">$100,000 Grant - Diamond Tier</span>
                                    </label>
                                </div>
                            </div>

                            <!-- Personal Information -->
                            <div class="grid gap-6 mb-10 lg:grid-cols-2">
                                <div>
                                    <label for="name" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Full Name <span class="text-red-500">*</span>
                                    </label>
                                    <input name="name" required id="name" type="text" 
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Enter your full name">
                                </div>

                                <div>
                                    <label for="location" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Location <span class="text-red-500">*</span>
                                    </label>
                                    <input name="location" required id="location" type="text" 
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Enter your location">
                                </div>
                            </div>

                            <!-- Grant Details -->
                            <div class="grid gap-6 mb-10 lg:grid-cols-2">
                                <div>
                                    <label for="reason" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Reason for Grant <span class="text-red-500">*</span>
                                    </label>
                                    <input name="reason" required id="reason" type="text" 
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Why are you applying for this grant?">
                                </div>

                                <div>
                                    <label for="referrals" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Active C2C Store Owners <span class="text-red-500">*</span>
                                    </label>
                                    <input name="referrals" required id="referrals" type="number" 
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Number of active stores">
                                </div>
                            </div>

                            <!-- Categories and Deserve -->
                            <div class="grid gap-6 mb-10 lg:grid-cols-2">
                                <div>
                                    <label for="categories" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Grant Categories <span class="text-red-500">*</span>
                                    </label>
                                    <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                                        Type 2 categories and specific items you want your grant products to fall under.
                                    </p>
                                    <textarea name="categories" required id="categories" rows="4"
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="E.g., Electronics: Smartphones, Laptops; Fashion: Sneakers, Accessories"></textarea>
                                </div>

                                <div>
                                    <label for="deserve" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Why You Deserve the Grant <span class="text-red-500">*</span>
                                    </label>
                                    <textarea name="deserve" required id="deserve" rows="4"
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Explain why you're the ideal candidate for this grant"></textarea>
                                </div>
                            </div>

                            <!-- AI Selection -->
                            <div class="mb-10">
                                <label for="ai" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                    Choose Your Insurance AI <span class="text-red-500">*</span>
                                </label>
                                <p class="mb-3 text-sm text-slate-600 dark:text-slate-400">
                                    Select from your list of active AI Bots to serve as insurance.
                                </p>
                                <select name="investment_id" required id="ai" 
                                    class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30">
                                    @foreach(auth()->user()->investment()?->where('status', 2)->get() as $bot)
                                    <option value="{{ $bot->id }}">{{ $bot?->plan?->name }} (${{ number_format($bot?->balance, 2) }})</option> 
                                    @endforeach
                                </select>
                            </div>

                            <!-- Promotion Strategy -->
                            <div class="grid gap-6 mb-10 lg:grid-cols-2">
                                <div>
                                    <label for="promote" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Promotion Strategy <span class="text-red-500">*</span>
                                    </label>
                                    <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                                        How will you promote GEAS to the community?
                                    </p>
                                    <textarea name="promote" required id="promote" rows="4"
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Describe your promotional strategy"></textarea>
                                </div>

                                <div>
                                    <label for="channels" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Information Channels <span class="text-red-500">*</span>
                                    </label>
                                    <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                                        What channels will you use for promotion?
                                    </p>
                                    <textarea name="channels" required id="channels" rows="4"
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="E.g., YouTube, Instagram, TikTok, Community Forums"></textarea>
                                </div>
                            </div>

                            <!-- Social Networks and Email -->
                            <div class="grid gap-6 mb-10 lg:grid-cols-2">
                                <div>
                                    <label for="social_networks" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Social Networks & Communities <span class="text-red-500">*</span>
                                    </label>
                                    <p class="mb-2 text-sm text-slate-600 dark:text-slate-400">
                                        List all your social networks or communities (include links).
                                    </p>
                                    <textarea name="social_networks" required id="social_networks" rows="4"
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="Include URLs to your social profiles and communities"></textarea>
                                </div>

                                <div>
                                    <label for="email" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                        Email Address <span class="text-red-500">*</span>
                                    </label>
                                    <input name="email" required id="email" type="email" 
                                        class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                        placeholder="your@email.com">
                                </div>
                            </div>

                            <!-- Contact Information -->
                            <div class="mb-10">
                                <label for="contact" class="block mb-3 text-lg font-semibold text-slate-900 dark:text-white">
                                    Best Place to Contact You <span class="text-red-500">*</span>
                                </label>
                                <p class="mb-3 text-sm text-slate-600 dark:text-slate-400">
                                    Where is the most convenient place to reach you?
                                </p>
                                <textarea name="contact" required id="contact" rows="4"
                                    class="w-full px-4 py-3 text-base transition-all bg-white border-2 border-gray-200 rounded-xl outline-none dark:bg-slate-800 dark:text-slate-200 dark:border-gray-700 focus:border-orange-500 focus:ring-4 focus:ring-orange-100 dark:focus:ring-orange-900/30" 
                                    placeholder="E.g., WhatsApp, Telegram, Email, etc."></textarea>
                            </div>

                            <!-- Submit Button -->
                            @if(count(auth()->user()->investment()?->where('status', 2)->get()) < 1)
                            <button type="submit" disabled 
                                class="flex items-center justify-center w-full px-8 py-5 text-xl font-bold tracking-wide text-white transition-all duration-300 bg-gray-400 rounded-xl cursor-not-allowed opacity-60">
                                <span class="mr-2">🔒</span> Submit Application
                            </button>
                            @else
                            <button type="submit" 
                                class="flex items-center justify-center w-full px-8 py-5 text-xl font-bold tracking-wide text-white transition-all duration-300 transform rounded-xl shadow-lg bg-gradient-to-r from-orange-500 to-orange-600 hover:from-orange-600 hover:to-orange-700 hover:shadow-xl hover:scale-105"
                                style="background-color: #660066;">
                                <span class="mr-2">🚀</span> Submit Application
                            </button>
                            @endif
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
<!-- End Section-->

@endsection