@extends('layouts.nova')

@section('content')
<div class="mx-auto max-w-5xl px-4 sm:px-6 lg:px-8 py-10">
    <div class="space-y-6">
        <div class="rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 p-6">
            <h1 class="text-xl font-semibold text-gray-900 dark:text-gray-100">Reports Hub</h1>
            <p class="mt-2 text-sm text-gray-500">Internal reporting entry points for moderation and discovery analytics.</p>
        </div>

        <div class="grid gap-4 md:grid-cols-2">
            <a href="{{ route('admin.reports.tags') }}" class="rounded-xl border border-sky-200 bg-sky-50 p-6 transition hover:border-sky-300 hover:bg-sky-100/80 dark:border-sky-900/60 dark:bg-sky-950/30 dark:hover:border-sky-700 dark:hover:bg-sky-950/50">
                <h2 class="text-lg font-semibold text-slate-900 dark:text-sky-100">Tag Interaction Report</h2>
                <p class="mt-2 text-sm text-slate-600 dark:text-sky-200/70">Inspect top surfaces, tags, search terms, and related-tag transitions from the new tag analytics pipeline.</p>
            </a>

            <div class="rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 p-6">
                <h2 class="text-lg font-semibold text-gray-900 dark:text-gray-100">Moderation Queue</h2>
                <p class="mt-2 text-sm text-gray-500">Use the API endpoint <code>/api/reports</code> to submit reports and review records in the <code>reports</code> table.</p>
            </div>
        </div>
    </div>
</div>
@endsection