<?php $__env->startSection('content'); ?>
<div class="space-y-8">
    <!-- Stats Cards Grid -->
    <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-6">
        <div class="dark-card p-6 hover:shadow-lg transition-shadow duration-300">
            <div class="flex items-center">
                <div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-users text-blue-600 text-xl"></i>
                </div>
                <div class="ml-4">
                    <p class="text-sm font-medium text-gray-400"><?php echo e(trans('admin.stats.online_players')); ?></p>
                    <p class="text-2xl font-bold text-white"><?php echo e($api->online ? count($api->getOnlineList()) : 0); ?></p>
                </div>
            </div>
            <div class="mt-4 text-sm text-gray-400"><?php echo e(trans('admin.stats.online_players_desc')); ?></div>
        </div>

        <div class="dark-card p-6 hover:shadow-lg transition-shadow duration-300">
            <div class="flex items-center">
                <div class="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-user-plus text-green-600 text-xl"></i>
                </div>
                <div class="ml-4">
                    <p class="text-sm font-medium text-gray-400"><?php echo e(trans('admin.stats.total_accounts')); ?></p>
                    <p class="text-2xl font-bold text-white"><?php echo e(number_format(DB::table('point')->count())); ?></p>
                </div>
            </div>
            <div class="mt-4 text-sm text-gray-400"><?php echo e(trans('admin.stats.total_accounts_desc')); ?></div>
        </div>

        <div class="dark-card p-6 hover:shadow-lg transition-shadow duration-300">
            <div class="flex items-center">
                <div class="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-user-ninja text-purple-600 text-xl"></i>
                </div>
                <div class="ml-4">
                    <p class="text-sm font-medium text-gray-400"><?php echo e(trans('admin.stats.characters')); ?></p>
                    <p class="text-2xl font-bold text-white"><?php echo e(number_format(DB::table('pweb_ranking_players')->count())); ?></p>
                </div>
            </div>
            <div class="mt-4 text-sm text-gray-400"><?php echo e(trans('admin.stats.characters_desc')); ?></div>
        </div>

        <div class="dark-card p-6 hover:shadow-lg transition-shadow duration-300">
            <div class="flex items-center">
                <div class="w-12 h-12 bg-yellow-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-flag text-yellow-600 text-xl"></i>
                </div>
                <div class="ml-4">
                    <p class="text-sm font-medium text-gray-400"><?php echo e(trans('admin.stats.factions')); ?></p>
                    <p class="text-2xl font-bold text-white"><?php echo e(number_format(DB::table('pweb_ranking_factions')->count())); ?></p>
                </div>
            </div>
            <div class="mt-4 text-sm text-gray-400"><?php echo e(trans('admin.stats.factions_desc')); ?></div>
            </div>
        </div>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
        <div class="dark-card hover:shadow-lg transition-shadow duration-300">
            <div class="px-6 py-4 border-b border-gray-700">
                <h3 class="text-lg font-semibold text-white"><?php echo e(trans('admin.server_status')); ?></h3>
                <p class="text-sm text-gray-400"><?php echo e(trans('admin.monitor_services')); ?></p>
            </div>
            <div class="p-6 space-y-3">
                <?php foreach($api->ports() as $name => $port): ?>
                    <div class="flex items-center justify-between p-4 rounded-lg" style="background-color: #313D4A;">
                        <div class="flex items-center space-x-3">
                            <div class="w-3 h-3 rounded-full <?php echo e($port['open'] ? 'bg-green-500' : 'bg-red-500'); ?>"></div>
                            <div>
                                <p class="text-sm font-medium text-white"><?php echo e($name); ?></p>
                                <p class="text-xs text-gray-400"><?php echo e(trans('admin.port')); ?> <?php echo e($port['port']); ?></p>
                            </div>
                        </div>
                        <div class="text-right">
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium <?php echo e($port['open'] ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'); ?>">
                                <?php echo e($port['open'] ? trans('admin.online') : trans('admin.offline')); ?>

                            </span>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
        </div>

        <div class="dark-card hover:shadow-lg transition-shadow duration-300">
            <div class="px-6 py-4 border-b border-gray-700 flex items-center justify-between">
                <div>
                    <h3 class="text-lg font-semibold text-white"><?php echo e(trans('admin.monthly_activity')); ?></h3>
                    <p class="text-sm text-gray-400"><?php echo e(trans('admin.activity_last_12_months')); ?></p>
                </div>
                <div class="flex space-x-2">
                    <button class="px-3 py-1 text-xs font-medium text-indigo-600 bg-indigo-100 rounded-full"><?php echo e(trans('admin.overview')); ?></button>
                    <button class="px-3 py-1 text-xs font-medium text-gray-400 hover:text-white"><?php echo e(trans('admin.details')); ?></button>
                </div>
            </div>
            <div class="p-6">
                <div class="h-64" style="background-color: #313D4A; border-radius: 8px; padding: 16px;">
                    <canvas id="adminActivityChart" style="height:100%; width:100%"></canvas>
                </div>

                <div class="grid grid-cols-3 gap-4 mt-6 text-center">
                    <div>
                        <p class="text-2xl font-bold text-white"><?php echo e($api->online ? count($api->getOnlineList()) : 0); ?></p>
                        <p class="text-sm text-gray-400"><?php echo e(trans('admin.online_now')); ?></p>
                    </div>
                    <div>
                        <p class="text-2xl font-bold text-white"><?php echo e(number_format(DB::table('point')->count())); ?></p>
                        <p class="text-sm text-gray-400"><?php echo e(trans('admin.total_users')); ?></p>
                    </div>
                    <div>
                        <p class="text-2xl font-bold text-white"><?php echo e(number_format(DB::table('pweb_ranking_players')->count())); ?></p>
                        <p class="text-sm text-gray-400"><?php echo e(trans('admin.stats.characters')); ?></p>
                    </div>
        </div>
    </div>

    <div class="dark-card hover:shadow-lg transition-shadow duration-300">
        <div class="px-6 py-4 border-b border-gray-700">
            <h3 class="text-lg font-semibold text-white"><?php echo e(trans('admin.quick_actions')); ?></h3>
            <p class="text-sm text-gray-400"><?php echo e(trans('admin.frequent_functions')); ?></p>
        </div>
        <div class="p-6">
            <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
                <a href="<?php echo e(url('admin/news')); ?>" class="group flex flex-col items-center p-4 rounded-lg hover:bg-gray-700 transition-all duration-200" style="background-color: #313D4A;">
                    <div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mb-3">
                        <i class="fas fa-newspaper text-blue-600 text-xl"></i>
                    </div>
                    <span class="text-sm font-medium text-white"><?php echo e(trans('admin.news')); ?></span>
                </a>

                <a href="<?php echo e(url('admin/shop')); ?>" class="group flex flex-col items-center p-4 rounded-lg hover:bg-gray-700 transition-all duration-200" style="background-color: #313D4A;">
                    <div class="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center mb-3">
                        <i class="fas fa-shopping-cart text-green-600 text-xl"></i>
                    </div>
                    <span class="text-sm font-medium text-white"><?php echo e(trans('admin.shop')); ?></span>
                </a>

                <a href="<?php echo e(url('admin/members')); ?>" class="group flex flex-col items-center p-4 rounded-lg hover:bg-gray-700 transition-all duration-200" style="background-color: #313D4A;">
                    <div class="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center mb-3">
                        <i class="fas fa-users text-purple-600 text-xl"></i>
                    </div>
                    <span class="text-sm font-medium text-white"><?php echo e(trans('admin.users')); ?></span>
                </a>

                <a href="<?php echo e(url('admin/system')); ?>" class="group flex flex-col items-center p-4 rounded-lg hover:bg-gray-700 transition-all duration-200" style="background-color: #313D4A;">
                    <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mb-3">
                        <i class="fas fa-cogs text-orange-600 text-xl"></i>
                    </div>
                    <span class="text-sm font-medium text-white"><?php echo e(trans('admin.settings')); ?></span>
                </a>
            </div>
</div>

    </div>
</div>
<?php $__env->startSection('scripts'); ?>
    <?php /* Chart.js via CDN */ ?>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script>
        (function(){
            var labels = <?php echo isset($chartLabels) ? json_encode($chartLabels) : '[]'; ?>;
            var registrations = <?php echo isset($registrationsData) ? json_encode($registrationsData) : '[]'; ?>;
            var spins = <?php echo isset($spinsData) ? json_encode($spinsData) : '[]'; ?>;

            var ctx = document.getElementById('adminActivityChart').getContext('2d');
            new Chart(ctx, {
                type: 'line',
                data: {
                    labels: labels,
                    datasets: [
                        {
                            label: '<?php echo e(trans("admin.registrations")); ?>',
                            data: registrations,
                            borderColor: 'rgba(99,102,241,0.9)',
                            backgroundColor: 'rgba(99,102,241,0.05)',
                            tension: 0.25,
                            fill: true,
                        },
                        {
                            label: '<?php echo e(trans("admin.daily_spins")); ?>',
                            data: spins,
                            borderColor: 'rgba(16,185,129,0.9)',
                            backgroundColor: 'rgba(16,185,129,0.05)',
                            tension: 0.25,
                            fill: true,
                        }
                    ]
                },
                options: {
                    responsive: true,
                    maintainAspectRatio: false,
                    scales: {
                        x: { grid: { display: false }, ticks: { color: '#9CA3AF' } },
                        y: { ticks: { color: '#9CA3AF' }, beginAtZero: true }
                    },
                    plugins: {
                        legend: { labels: { color: '#9CA3AF' } }
                    }
                }
            });
        })();
    </script>
<?php $__env->stopSection(); ?>

</div>

<?php $__env->stopSection(); ?>


<?php echo $__env->make('admin.layouts.app', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>