@extends('layouts.app')

@section('title', 'Contact | ' . ($settings->site_name ?? 'Saleem Sial Analytics'))
@section('meta_description', 'Contact Saleem Sial Analytics for GA4, GTM, dashboard, and ad tracking support.')
@section('meta_image', $settings?->logo_url ?? asset('uploads/placeholders/default-logo.png'))

@section('content')
    <div class="site-wrapper">
        <article class="entry-content ssa-page-shell">
            <section class="ssa-inner-hero reveal-on-scroll">
                <div class="prespa-saas-box ssa-badge">
                    <img src="{{ asset('assets/themes/prespa-saas/assets/img/ps-patterns/icons/chip.png') }}" alt="">
                    <span>Contact</span>
                </div>

                <h1>{{ $contactContext['title'] ?? 'Tell us what you need to measure.' }}</h1>
                <p>{{ $contactContext['intro'] ?? "Share your website, campaigns, or reporting challenge and we'll help you figure out the best tracking setup." }}</p>
            </section>

            <section class="ssa-contact-layout">
                <div class="ssa-contact-card reveal-on-scroll">
                    <h2>Start the conversation</h2>
                    <p>Whether you need GA4 setup, GTM cleanup, Meta Pixel fixes, or server-side tracking, this form is the fastest way to get in touch.</p>

                    @if(filled($contactContext['service'] ?? null) || filled($contactContext['package'] ?? null))
                        <div class="ssa-inline-tags">
                            @if(filled($contactContext['service'] ?? null))
                                <span class="ssa-blog-chip">Service: {{ $contactContext['service'] }}</span>
                            @endif
                            @if(filled($contactContext['package'] ?? null))
                                <span class="ssa-blog-chip">Package: {{ $contactContext['package'] }}</span>
                            @endif
                        </div>
                    @endif

                    <div class="ssa-contact-meta">
                        @if(! empty($settings?->contact_email))
                            <p><strong>Email:</strong> <a href="mailto:{{ $settings->contact_email }}">{{ $settings->contact_email }}</a></p>
                        @endif
                        @if(! empty($settings?->contact_phone))
                            <p><strong>Phone:</strong> <a href="tel:{{ $settings->contact_phone }}">{{ $settings->contact_phone }}</a></p>
                        @endif
                    </div>

                    @include('partials.contact-actions', [
                        'serviceTitle' => $contactContext['service'] ?? null,
                        'intent' => $contactContext['intent'] ?? 'pricing',
                        'package' => $contactContext['package'] ?? null,
                        'headline' => 'Pick the fastest route for this request.',
                        'compact' => true,
                        'showSupport' => true,
                    ])
                </div>

                <div class="ssa-contact-form-wrap reveal-on-scroll">
                    @if(session('success'))
                        <div class="ssa-success-alert">
                            {{ session('success') }}
                        </div>
                    @endif

                    <form action="{{ route('contact.store') }}" method="POST" class="ssa-contact-form">
                        @csrf
                        <input type="hidden" name="source" value="contact_form">
                        <input type="hidden" name="page_url" value="{{ old('page_url', url()->full()) }}">

                        <label>
                            <span>Name</span>
                            <input type="text" name="name" value="{{ old('name') }}" required>
                            @error('name')<p class="ssa-form-error">{{ $message }}</p>@enderror
                        </label>

                        <label>
                            <span>Email</span>
                            <input type="email" name="email" value="{{ old('email') }}" required>
                            @error('email')<p class="ssa-form-error">{{ $message }}</p>@enderror
                        </label>

                        <label>
                            <span>Phone</span>
                            <input type="text" name="phone" value="{{ old('phone') }}">
                            @error('phone')<p class="ssa-form-error">{{ $message }}</p>@enderror
                        </label>

                        <label>
                            <span>Message</span>
                            <textarea name="message" rows="6" required>{{ old('message', $contactContext['message'] ?? '') }}</textarea>
                            @error('message')<p class="ssa-form-error">{{ $message }}</p>@enderror
                        </label>

                        <button type="submit" class="ssa-gradient-button ssa-submit-button">Send Message</button>
                    </form>
                </div>
            </section>
        </article>
    </div>
@endsection
