"use client";

import { ChartBarIcon } from '@heroicons/react/24/outline';

export default function ReportsPage() {
    return (
        <div className="p-8">
            <div className="flex items-center gap-3 mb-6">
                <ChartBarIcon className="w-8 h-8 text-gray-600 dark:text-gray-400" />
                <div>
                    <h1 className="text-2xl font-bold text-gray-900 dark:text-white">Relatórios</h1>
                    <p className="text-sm text-gray-600 dark:text-gray-400 mt-1">
                        Visualize métricas e relatórios do sistema
                    </p>
                </div>
            </div>

            <div className="bg-white dark:bg-gray-900 rounded-lg border border-gray-200 dark:border-gray-800 p-12 text-center">
                <ChartBarIcon className="w-16 h-16 text-gray-400 mx-auto mb-4" />
                <h3 className="text-lg font-medium text-gray-900 dark:text-white mb-2">
                    Página em desenvolvimento
                </h3>
                <p className="text-gray-600 dark:text-gray-400">
                    Os relatórios e analytics estarão disponíveis em breve
                </p>
            </div>
        </div>
    );
}