{% extends 'base.html' %}

{% block title %}Admin Dashboard{% endblock %}

{% block content %}
<div class="mb-8">
    <div class="flex items-center mb-4">
        <span class="text-4xl mr-3">🔐</span>
        <div>
            <h1 class="text-3xl font-bold text-gray-900">Admin Dashboard</h1>
            <p class="text-lg text-gray-600">Administrative control panel</p>
        </div>
    </div>
</div>

<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-6">
    <div class="bg-white rounded-lg shadow-lg border border-gray-200 hover:shadow-xl transition-shadow duration-200">
        <div class="px-6 py-8 text-center">
            <h3 class="text-xl font-semibold text-gray-900 mb-3">User Management</h3>
            <p class="text-gray-600 mb-6">Manage user accounts, roles, and permissions</p>
            <a href="/admin/accounts/user/" class="bg-black text-white px-6 py-2 rounded-md hover:bg-gray-800 transition-colors duration-200 inline-block">
                Manage Users
            </a>
        </div>
    </div>
    
    <div class="bg-white rounded-lg shadow-lg border border-gray-200 hover:shadow-xl transition-shadow duration-200">
        <div class="px-6 py-8 text-center">
            <h3 class="text-xl font-semibold text-gray-900 mb-3">Group Management</h3>
            <p class="text-gray-600 mb-6">Configure user groups and permissions</p>
            <a href="/admin/auth/group/" class="bg-black text-white px-6 py-2 rounded-md hover:bg-gray-800 transition-colors duration-200 inline-block">
                Manage Groups
            </a>
        </div>
    </div>
    
    <div class="bg-white rounded-lg shadow-lg border border-gray-200 hover:shadow-xl transition-shadow duration-200">
        <div class="px-6 py-8 text-center">
            <h3 class="text-xl font-semibold text-gray-900 mb-3">Site Administration</h3>
            <p class="text-gray-600 mb-6">Access full Django admin interface</p>
            <a href="/admin/" class="bg-black text-white px-6 py-2 rounded-md hover:bg-gray-800 transition-colors duration-200 inline-block">
                Django Admin
            </a>
        </div>
    </div>
</div>

<div class="bg-white rounded-lg shadow-lg border border-gray-200">
    <div class="px-6 py-4 border-b border-gray-200">
        <h2 class="text-xl font-semibold text-gray-900">System Information</h2>
    </div>
    <div class="px-6 py-6">
        <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
            <div>
                <h3 class="text-lg font-semibold text-gray-900 mb-4">Current User</h3>
                <div class="space-y-3">
                    <p class="text-gray-700">
                        <span class="font-medium text-gray-900">Name:</span> {{ user.full_name|default:user.email }}
                    </p>
                    <p class="text-gray-700">
                        <span class="font-medium text-gray-900">Role:</span> Administrator
                    </p>
                    <p class="text-gray-700">
                        <span class="font-medium text-gray-900">Last Login:</span> {{ user.last_login|date:"M d, Y H:i" }}
                    </p>
                </div>
            </div>
            <div>
                <h3 class="text-lg font-semibold text-gray-900 mb-4">Quick Stats</h3>
                <div class="space-y-3">
                    <p class="text-gray-700 flex justify-between">
                        <span class="font-medium text-gray-900">Total Users:</span>
                        <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
                            {{ users_count|default:"N/A" }}
                        </span>
                    </p>
                    <p class="text-gray-700 flex justify-between">
                        <span class="font-medium text-gray-900">Active Sessions:</span>
                        <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
                            {{ active_sessions|default:"N/A" }}
                        </span>
                    </p>
                    <p class="text-gray-700 flex justify-between">
                        <span class="font-medium text-gray-900">System Status:</span>
                        <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
                            Online
                        </span>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}