@extends('layouts.public')

@section('title', 'Submit Your Business | PLOCAL')
@section('description', 'Request a structured PLOCAL evaluation and see how professional and customer-ready your business looks online.')
@section('robots', 'noindex, follow')
@section('canonical', config('plocal.public_url').'/submit-your-business')
@section('image', config('plocal.public_url').'/assets/img/og-meta/plocal-submit-your-business.png')
@section('body-class', 'plocal-submit-business-page')

@push('styles')
    <link rel="stylesheet" href="/assets/css/pages/global.css">
    <link rel="stylesheet" href="/assets/css/pages/breadcrum.css">
    <link rel="stylesheet" href="/assets/css/pages/submit-your-business.css">
@endpush

@section('content')
@include('public.partials.site-header')

<main class="main" id="main-content">

    <!-- page banner -->
    <section
    class="plocal-page-banner plocal-submit-banner"
    aria-labelledby="submit-business-title"
    >
    <!-- Decorative rotating images -->
    <div class="plocal-submit-banner__visuals" aria-hidden="true">
        <!-- Image 01: upper left -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--01"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/professional-business-consultation.webp"
            alt="Business owner meeting with a professional consultant to review business information and strategy"
            width="360"
            height="280"
        />
        </figure>

        <!-- Image 02: lower right -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--02"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/digital-business-verification-review.webp"
            alt="Business professional reviewing digital verification and evaluation information on a laptop"
            width="360"
            height="280"
        />
        </figure>

        <!-- Image 03: upper right -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--03"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/business-owner-reviewing-online-profile.webp"
            alt="Business owner reviewing the company website and online business profile on a laptop"
            width="360"
            height="280"
        />
        </figure>

        <!-- Image 04: lower left -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--04"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/professional-barber-serving-client.webp"
            alt="Professional barber providing grooming services to a client in a local barbershop"
            width="360"
            height="280"
        />
        </figure>

        <!-- Image 05: middle-left edge -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--05"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/local-restaurant-business-owner.webp"
            alt="Local restaurant owner standing confidently outside a professional food business"
            width="360"
            height="280"
        />
        </figure>

        <!-- Image 06: middle-right edge -->
        <figure
        class="plocal-submit-banner__image-slot
                plocal-submit-banner__image-slot--06"
        >
        <img
            src="/assets/img/breadcrumb/submit-business/small-business-owner-managing-inventory.webp"
            alt="Small business owner managing products and inventory inside a local business workspace"
            width="360"
            height="280"
        />
        </figure>
    </div>

    <div class="container">
        <div class="plocal-submit-banner__content">
        <ul class="plocal-breadcrumb">
            <li><a href="/">Home</a></li>
            <li aria-current="page">Submit Your Business</li>
        </ul>

        <h1 id="submit-business-title">
            Submit Your <span>Business</span>
        </h1>

        <p class="plocal-banner-text">
            Request a structured <strong>PLOCAL</strong> evaluation and see
            how professional and customer-ready your business looks online.
        </p>

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

    <!-- =========================================================
        PLOCAL — SUBMIT YOUR BUSINESS
    ========================================================== -->
    <section
        class="py-120 plocal-submit-section"
        id="submit-business"
        aria-labelledby="plocal-submit-title"
    >

        <!-- =====================================================
            DECORATIVE BACKGROUND
        ====================================================== -->
        <div
            class="plocal-submit-bg"
            aria-hidden="true"
        >

            <span
                class="
                    plocal-submit-bg__glow
                    plocal-submit-bg__glow--one
                "
            ></span>

            <span
                class="
                    plocal-submit-bg__glow
                    plocal-submit-bg__glow--two
                "
            ></span>


            <span
                class="
                    plocal-submit-bg__dots
                    plocal-submit-bg__dots--one
                "
            ></span>

            <span
                class="
                    plocal-submit-bg__dots
                    plocal-submit-bg__dots--two
                "
            ></span>


            <span
                class="
                    plocal-submit-bg__orbit
                    plocal-submit-bg__orbit--one
                "
            ></span>

            <span
                class="
                    plocal-submit-bg__orbit
                    plocal-submit-bg__orbit--two
                "
            ></span>


            <span
                class="
                    plocal-submit-bg__icon
                    plocal-submit-bg__icon--store
                "
            >
                <i class="fas fa-store"></i>
            </span>

            <span
                class="
                    plocal-submit-bg__icon
                    plocal-submit-bg__icon--chart
                "
            >
                <i class="fas fa-chart-line"></i>
            </span>

        </div>


        <div class="container plocal-submit-container">

            <div class="row g-5 align-items-center">

                <!-- =================================================
                    LEFT — INFORMATION
                ================================================== -->
                <div class="col-lg-5">

                    <div class="plocal-submit-content">

                        <div class="site-heading plocal-submit-heading">

                            <span class="site-title-tagline">

                                <span
                                    class="plocal-submit-tagline-icon"
                                    aria-hidden="true"
                                >
                                    <i class="fas fa-store"></i>
                                </span>

                                For Business Owners

                            </span>


                            <h2
                                class="site-title"
                                id="plocal-submit-title"
                            >
                                Get Evaluated &
                                <span>Build Trust</span>
                            </h2>

                        </div>


                        <div class="plocal-prose">

                            <ul>

                                <li>
                                    See how professional and customer-ready your
                                    business looks online.
                                </li>

                                <li>
                                    Understand the signals that build trust with
                                    real customers.
                                </li>

                                <li>
                                    Get a structured PLOCAL Score based on six
                                    clear criteria.
                                </li>

                                <li>
                                    Stand out as an evaluated, credible local
                                    business.
                                </li>

                            </ul>

                        </div>


                        <div class="plocal-disclaimer">

                            <i
                                class="fas fa-circle-info"
                                aria-hidden="true"
                            ></i>

                            <p>
                                <strong>Important:</strong> Submitting or paying
                                does not guarantee a score, badge, ranking,
                                verification, or recommendation. Businesses pay
                                for an evaluation only.
                            </p>

                        </div>


                        <!-- Decorative illustration -->
                        <div
                            class="plocal-submit-illustration"
                            aria-hidden="true"
                        >

                            <span class="plocal-submit-illustration__bubble">

                                <i class="fas fa-store"></i>

                            </span>


                            <span class="plocal-submit-illustration__score">

                                <i class="fas fa-chart-simple"></i>

                            </span>


                            <img
                                src="/assets/img/home/contact-img.webp"
                                alt=""
                                class="plocal-submit-illustration__image"
                                width="620"
                                height="520"
                                loading="lazy"
                                decoding="async"
                            >


                            <span class="plocal-submit-illustration__check">

                                <i class="fas fa-check"></i>

                            </span>


                            <span class="plocal-submit-illustration__location">

                                <i class="fas fa-location-dot"></i>

                            </span>

                        </div>

                    </div>

                </div>


                <!-- =================================================
                    RIGHT — ORIGINAL FORM
                ================================================== -->
                <div class="col-lg-7">

                    <div class="plocal-submit-form-shell">

                        <span
                            class="plocal-submit-form-shell__line"
                            aria-hidden="true"
                        ></span>

                        <span
                            class="plocal-submit-form-shell__glow"
                            aria-hidden="true"
                        ></span>

                        <span
                            class="plocal-submit-form-shell__grid"
                            aria-hidden="true"
                        ></span>


                        <!-- Posts via fetch() to POST /submit-your-business (see plocal-custom.js).
                            Field names/ids are the authoritative backend contract — do not rename. -->
                        <form class="plocal-form" id="plocal-submit-form" method="post" action="/submit-your-business" enctype="multipart/form-data" aria-label="Submit your business for evaluation">
                            <div class="row">
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-business">Business Name <span class="req">*</span></label><input type="text" id="sb-business" class="plocal-form-control" name="business_name" placeholder="Your business name" required></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-dba">DBA / Public Name</label><input type="text" id="sb-dba" class="plocal-form-control" name="dba_name" placeholder="If different from your legal name"></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-category">Business Category <span class="req">*</span></label>
                                    <select class="plocal-form-control" id="sb-category" name="category" required>
                                        <option value="">Select a category group</option>
                                        <option value="construction-home-services">Construction &amp; Home Services</option>
                                        <option value="beauty-personal-care">Beauty &amp; Personal Care</option>
                                        <option value="restaurants-food-businesses">Restaurants &amp; Food Businesses</option>
                                    </select></div></div>
                                <div class="col-md-3"><div class="plocal-form-group"><label for="sb-city">City <span class="req">*</span></label><input type="text" id="sb-city" class="plocal-form-control" name="city" placeholder="City" required></div></div>
                                <div class="col-md-3"><div class="plocal-form-group"><label for="sb-state">State <span class="req">*</span></label>
                                    <select class="plocal-form-control" id="sb-state" name="state" required>
                                        <option value="">Select a state</option>
                                        @foreach ($stateOptions as $code => $name)
                                            <option value="{{ $code }}">{{ $name }}</option>
                                        @endforeach
                                    </select></div></div>
                                <div class="col-md-4"><div class="plocal-form-group"><label for="sb-zip">ZIP Code <span class="req">*</span></label><input type="text" id="sb-zip" class="plocal-form-control" name="zip" placeholder="12345" autocomplete="postal-code" inputmode="numeric" pattern="\d{5}(-\d{4})?" maxlength="10" required></div></div>
                                <div class="col-md-8"><div class="plocal-form-group"><label for="sb-areas">Service Areas</label><input type="text" id="sb-areas" class="plocal-form-control" name="service_areas" placeholder="Cities, counties, or areas served"></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-description">Business Description <span class="req">*</span></label><textarea class="plocal-form-control" id="sb-description" name="description" placeholder="What does this business do?" required></textarea></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-website">Business Website <span class="req">*</span></label><input type="url" id="sb-website" class="plocal-form-control" name="website" placeholder="https://yourbusiness.com" required></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-screenshot">Website Screenshot <span class="req">*</span></label><input type="file" id="sb-screenshot" class="plocal-form-control" name="website_screenshot" accept=".jpg,image/jpeg" required><small class="plocal-form-hint"><strong>JPG only.</strong> Required size: 1068px (w) × 646px (h). 150KB max.</small></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-google">Google Business Profile</label><input type="url" id="sb-google" class="plocal-form-control" name="google_business_url" placeholder="https://"></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-review">Primary Review Profile</label><input type="url" id="sb-review" class="plocal-form-control" name="primary_review_url" placeholder="https://"></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-profiles">Additional Online Profiles</label><textarea class="plocal-form-control" id="sb-profiles" name="additional_profiles" placeholder="One URL per line"></textarea></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-services">Main Services <span class="req">*</span></label><textarea class="plocal-form-control" id="sb-services" name="main_services" placeholder="List the main services this business offers" required></textarea></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-license">License Number (if applicable)</label><input type="text" id="sb-license" class="plocal-form-control" name="license_number"></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-license-authority">License State / Authority</label><input type="text" id="sb-license-authority" class="plocal-form-control" name="license_state_authority"></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-phone">Business Phone <span class="req">*</span></label><input type="tel" id="sb-phone" class="plocal-form-control" name="phone" placeholder="(555) 555-5555" required></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-email">Public Business Email <span class="req">*</span></label><input type="email" id="sb-email" class="plocal-form-control" name="email" placeholder="you@business.com" required></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label>Business Features</label>
                                    <div class="plocal-form-checks">
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="portfolio"> Portfolio / Projects</label>
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="customer_reviews"> Customer Reviews</label>
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="quote_form"> Quote Form</label>
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="online_booking"> Online Booking</label>
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="service_area_pages"> Service Area Pages</label>
                                        <label class="plocal-form-check"><input type="checkbox" name="features[]" value="credentials_licenses"> Credentials / Licenses</label>
                                    </div></div></div>
                            </div>

                            <div class="row">
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-submitter-name">Your Name <span class="req">*</span></label><input type="text" id="sb-submitter-name" class="plocal-form-control" name="submitter_name" required></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-submitter-role">Your Role <span class="req">*</span></label>
                                    <select class="plocal-form-control" id="sb-submitter-role" name="submitter_role" required>
                                        <option value="business_owner">Business Owner</option>
                                        <option value="employee_manager">Employee / Manager</option>
                                        <option value="agency_freelancer">Agency / Freelancer</option>
                                        <option value="authorized_representative">Authorized Representative</option>
                                    </select></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-submitter-email">Email <span class="req">*</span></label><input type="email" id="sb-submitter-email" class="plocal-form-control" name="submitter_email" required></div></div>
                                <div class="col-md-6"><div class="plocal-form-group"><label for="sb-submitter-phone">Phone</label><input type="tel" id="sb-submitter-phone" class="plocal-form-control" name="submitter_phone"></div></div>
                                <div class="col-md-12"><div class="plocal-form-group"><label for="sb-notes">Notes</label><textarea class="plocal-form-control" id="sb-notes" name="submitter_notes" placeholder="Anything you would like the evaluation team to know"></textarea></div></div>
                            </div>

                            <input type="hidden" name="idempotency_key" class="plocal-idempotency-key">

                            <!-- Honeypot (hidden from people; bots tend to fill it) -->
                            <div class="plocal-hp" aria-hidden="true">
                                <label>Do not fill this field<input type="text" name="_plocal_hp" tabindex="-1" autocomplete="off"></label>
                            </div>

                            <div class="plocal-consent">
                                <input type="checkbox" id="sb-consent-authorization" name="consent_authorization" required>
                                <label for="sb-consent-authorization">I am authorized to submit this business and the information is accurate. <span class="req">*</span></label>
                            </div>
                            <div class="plocal-consent">
                                <input type="checkbox" id="sb-consent-guarantee" name="consent_no_guarantee" required>
                                <label for="sb-consent-guarantee">I understand that submitting or paying for a PLOCAL evaluation does not guarantee a ranking, score, verification, badge, nomination, recognition, or award. Businesses pay for an evaluation only. <span class="req">*</span></label>
                            </div>

                            <!-- reCAPTCHA / Turnstile widget could be added here later (server-verified). -->

                            <button type="submit" class="theme-btn"><i class="fas fa-paper-plane"></i> Submit for Evaluation</button>
                            <p class="plocal-form-note">After you submit, you'll be taken to secure checkout to pay the <strong>PLOCAL Evaluation fee — $250.00 USD plus applicable taxes</strong>. Payment is for the Evaluation service. It does not guarantee nomination, a specific PLOCAL Score, PLOCAL Honors, or an award.</p>
                            <div class="plocal-form-msg" role="status" aria-live="polite"></div>
                        </form>

                    </div>

                </div>

            </div>

        </div>

    </section>
    <!-- =========================================================
        PLOCAL — SUBMIT YOUR BUSINESS END
    ========================================================== -->

</main>

@section('footer-note', 'Businesses pay for an Evaluation, never for a ranking, score, verification, badge, or recommendation.')
@include('public.partials.site-footer')
@endsection