@extends('layouts.app')

@php
    use App\Helpers\MarketContent;
    use App\Helpers\SeoHelper;

    $locale = app()->getLocale();
    $legalContent = $legalContent ?? MarketContent::legal($locale);
    $cookieText = static fn (string $path, mixed $default = '') => data_get($legalContent, 'cookie_policy.' . $path, $default);

    // Helper function to generate localized routes
    $localizedRoute = function($routeName, $params = []) use ($locale) {
        return SeoHelper::localizedRoute($routeName, $params, $locale);
    };
@endphp

@section('title', $cookieText('meta_title'))
@section('meta_description', $cookieText('meta_description'))
@section('meta_keywords', $cookieText('meta_keywords'))
@section('og_image', asset(data_get($legalContent, 'metadata.og_image')))

@push('schema')
{{-- WebPage Schema --}}
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "WebPage",
  "@id": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}/#webpage",
  "url": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}",
  "name": "{{ $cookieText('meta_title') }}",
  "description": "{{ $cookieText('meta_description') }}",
  "isPartOf": {
    "@id": "{{ config('seo.site_url') }}/#website"
  },
  "inLanguage": "{{ SeoHelper::getCurrentLanguageCode() }}",
  "breadcrumb": {
    "@type": "BreadcrumbList",
    "itemListElement": [
      {
        "@type": "ListItem",
        "position": 1,
        "name": "{{ __('messages.nav.home') }}",
        "item": "{{ $localizedRoute('home') }}"
      },
      {
        "@type": "ListItem",
        "position": 2,
        "name": "{{ $cookieText('title') }}",
        "item": "{{ \App\Helpers\SeoHelper::getCanonicalUrl() }}"
      }
    ]
  }
}
</script>
@endpush

@section('content')

<!-- Hero Section -->
<section class="relative py-16 bg-gradient-to-b from-neutral-50 to-white">
    <div class="site-container max-w-4xl">
        <h1 class="section-intro__title mb-4">
            {{ $cookieText('title') }}
        </h1>
        <p class="text-lg text-neutral-600">
            {{ $cookieText('last_updated') }}: {{ $cookieText('last_updated_date') }}
        </p>
    </div>
</section>

<!-- Content Section -->
<section class="py-12 bg-white">
    <div class="site-container max-w-4xl">
        <div class="prose prose-lg max-w-none">

            <!-- Introduction -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('intro_title') }}</h2>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('intro_p1') }}
                </p>
                <p class="text-neutral-700 leading-relaxed">
                    {{ $cookieText('intro_p2') }}
                </p>
            </div>

            <!-- What Are Cookies -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('what_are_title') }}</h2>
                <p class="text-neutral-700 leading-relaxed">
                    {{ $cookieText('what_are_content') }}
                </p>
            </div>

            <!-- Types of Cookies -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('types_title') }}</h2>

                <h3 class="text-xl font-semibold text-neutral-900 mb-3 mt-6">{{ $cookieText('essential_title') }}</h3>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('essential_content') }}
                </p>

                <h3 class="text-xl font-semibold text-neutral-900 mb-3 mt-6">{{ $cookieText('analytics_title') }}</h3>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('analytics_content') }}
                </p>
                <ul class="list-disc list-inside text-neutral-700 space-y-2 mb-4">
                    <li><strong>Google Analytics:</strong> {{ $cookieText('analytics_ga') }}</li>
                    <li><strong>Microsoft Clarity:</strong> {{ $cookieText('analytics_clarity') }}</li>
                </ul>

                <h3 class="text-xl font-semibold text-neutral-900 mb-3 mt-6">{{ $cookieText('functional_title') }}</h3>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('functional_content') }}
                </p>
            </div>

            <!-- Cookies We Use -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('we_use_title') }}</h2>
                <div class="overflow-x-auto">
                    <table class="w-full border-collapse border border-neutral-300 mb-4">
                        <thead>
                            <tr class="bg-neutral-100">
                                <th class="border border-neutral-300 px-4 py-3 text-left font-semibold text-neutral-900">{{ $cookieText('table_name') }}</th>
                                <th class="border border-neutral-300 px-4 py-3 text-left font-semibold text-neutral-900">{{ $cookieText('table_purpose') }}</th>
                                <th class="border border-neutral-300 px-4 py-3 text-left font-semibold text-neutral-900">{{ $cookieText('table_duration') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">_ga</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('table_ga_purpose') }}</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('duration_labels.two_years') }}</td>
                            </tr>
                            <tr>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">_gid</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('table_gid_purpose') }}</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('duration_labels.twenty_four_hours') }}</td>
                            </tr>
                            <tr>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">_clck</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('table_clarity_purpose') }}</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('duration_labels.one_year') }}</td>
                            </tr>
                            <tr>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">locale</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('table_locale_purpose') }}</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('duration_labels.one_year') }}</td>
                            </tr>
                            <tr>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">XSRF-TOKEN</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('table_csrf_purpose') }}</td>
                                <td class="border border-neutral-300 px-4 py-3 text-neutral-700">{{ $cookieText('duration_labels.session') }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- Managing Cookies -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('managing_title') }}</h2>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('managing_intro') }}
                </p>

                <h3 class="text-xl font-semibold text-neutral-900 mb-3 mt-6">{{ $cookieText('browser_title') }}</h3>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('browser_content') }}
                </p>
                <ul class="list-disc list-inside text-neutral-700 space-y-2 mb-4">
                    <li><a href="https://support.google.com/chrome/answer/95647" target="_blank" rel="noopener" class="text-criazo-primary hover:underline">Google Chrome</a></li>
                    <li><a href="https://support.mozilla.org/en-US/kb/enable-and-disable-cookies-website-preferences" target="_blank" rel="noopener" class="text-criazo-primary hover:underline">Mozilla Firefox</a></li>
                    <li><a href="https://support.apple.com/guide/safari/manage-cookies-and-website-data-sfri11471/mac" target="_blank" rel="noopener" class="text-criazo-primary hover:underline">Safari</a></li>
                    <li><a href="https://support.microsoft.com/en-us/microsoft-edge/delete-cookies-in-microsoft-edge-63947406-40ac-c3c8-57b9-2a946a29ae09" target="_blank" rel="noopener" class="text-criazo-primary hover:underline">Microsoft Edge</a></li>
                </ul>

                <h3 class="text-xl font-semibold text-neutral-900 mb-3 mt-6">{{ $cookieText('optout_title') }}</h3>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('optout_content') }}
                </p>
                <ul class="list-disc list-inside text-neutral-700 space-y-2">
                    <li><a href="https://tools.google.com/dlpage/gaoptout" target="_blank" rel="noopener" class="text-criazo-primary hover:underline">{{ $cookieText('optout_ga') }}</a></li>
                </ul>
            </div>

            <!-- Third-Party Cookies -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('third_party_title') }}</h2>
                <p class="text-neutral-700 leading-relaxed">
                    {{ $cookieText('third_party_content') }}
                </p>
            </div>

            <!-- Updates -->
            <div class="mb-12">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('updates_title') }}</h2>
                <p class="text-neutral-700 leading-relaxed">
                    {{ $cookieText('updates_content') }}
                </p>
            </div>

            <!-- Contact -->
            <div class="mb-12 bg-neutral-50 rounded-2xl p-8">
                <h2 class="type-heading-sm mb-4">{{ $cookieText('contact_title') }}</h2>
                <p class="text-neutral-700 leading-[1.43] tracking-body mb-4">
                    {{ $cookieText('contact_content') }}
                </p>
                <p class="text-neutral-700">
                    <strong>{{ $cookieText('contact_email_label') }}:</strong>
                    <a href="mailto:{{ $cookieText('contact_email') }}" class="text-criazo-primary hover:underline">
                        {{ $cookieText('contact_email') }}
                    </a>
                </p>
            </div>

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

@include('components.explore-site-section')

@endsection