@extends('layouts.app')

@section('title', 'Admin Dashboard')

@section('nav-items')
    <li><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
    <li><a href="{{ route('admin.users.index') }}">Users</a></li>
    <li><a href="{{ route('admin.divisions.index') }}">Divisions</a></li>
    <li><a href="{{ route('admin.logos.index') }}">Logos</a></li>
    <li><a href="{{ route('admin.company-profiles.index') }}">Company Profile</a></li>
    <li><a href="{{ route('admin.customer-download-requests.index') }}">Download Requests</a></li>
    <li><a href="{{ route('admin.marketing-requests.index') }}">Marketing Requests</a></li>
    <li><a href="{{ route('admin.media.index') }}">Media</a></li>
@endsection

@section('styles')
<style>
    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 1.5rem;
        margin-bottom: 2rem;
    }

    .stat-card {
        background: white;
        border-radius: 12px;
        padding: 1.5rem;
        border: 1px solid var(--gray-200);
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
        transition: all 0.2s;
    }

    .stat-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

    .stat-header {
        display: flex;
        justify-content: space-between;
        align-items: start;
        margin-bottom: 1rem;
    }

    .stat-icon {
        width: 48px;
        height: 48px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .stat-icon svg {
        width: 24px;
        height: 24px;
    }

    .stat-icon.primary {
        background: rgba(227, 27, 35, 0.1);
        color: var(--primary);
    }

    .stat-icon.success {
        background: rgba(5, 150, 105, 0.1);
        color: var(--success);
    }

    .stat-icon.warning {
        background: rgba(245, 158, 11, 0.1);
        color: var(--warning);
    }

    .stat-icon.info {
        background: rgba(59, 130, 246, 0.1);
        color: var(--info);
    }

    .stat-value {
        font-size: 2rem;
        font-weight: 700;
        color: var(--gray-900);
    }

    .stat-label {
        font-size: 0.875rem;
        color: var(--gray-600);
        margin-bottom: 0.25rem;
    }

    .stat-change {
        font-size: 0.75rem;
        color: var(--success);
        font-weight: 500;
    }

    .recent-section {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
    }

    .recent-list {
        list-style: none;
        padding: 0;
    }

    .recent-item {
        padding: 1rem 0;
        border-bottom: 1px solid var(--gray-200);
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .recent-item:last-child {
        border-bottom: none;
    }

    .recent-info {
        flex: 1;
    }

    .recent-title {
        font-weight: 600;
        color: var(--gray-900);
        font-size: 0.875rem;
        margin-bottom: 0.25rem;
    }

    .recent-meta {
        font-size: 0.75rem;
        color: var(--gray-500);
    }

    .badge {
        padding: 0.25rem 0.75rem;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
    }

    .badge-warning {
        background: rgba(245, 158, 11, 0.1);
        color: var(--warning);
    }

    .badge-primary {
        background: rgba(227, 27, 35, 0.1);
        color: var(--primary);
    }

    @media (max-width: 768px) {
        .stats-grid {
            grid-template-columns: 1fr;
        }
        .recent-section {
            grid-template-columns: 1fr;
        }
    }
</style>
@endsection

@section('content')
<h1 style="font-size: 2rem; font-weight: 700; margin-bottom: 2rem; color: var(--gray-900);">
    Admin Dashboard
</h1>

<!-- Statistics Cards -->
<div class="stats-grid">
    <div class="stat-card">
        <div class="stat-header">
            <div>
                <div class="stat-label">Total Users</div>
                <div class="stat-value">{{ $stats['total_users'] }}</div>
            </div>
            <div class="stat-icon primary">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
                </svg>
            </div>
        </div>
    </div>

    <div class="stat-card">
        <div class="stat-header">
            <div>
                <div class="stat-label">Pending Employees</div>
                <div class="stat-value">{{ $stats['pending_employees'] }}</div>
            </div>
            <div class="stat-icon warning">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
                </svg>
            </div>
        </div>
        @if($stats['pending_employees'] > 0)
            <a href="{{ route('admin.users.index') }}?status=pending" style="color: var(--primary); font-size: 0.875rem; text-decoration: none; font-weight: 500;">
                Review Now →
            </a>
        @endif
    </div>

    <div class="stat-card">
        <div class="stat-header">
            <div>
                <div class="stat-label">Pending Requests</div>
                <div class="stat-value">{{ $stats['pending_requests'] }}</div>
            </div>
            <div class="stat-icon info">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                </svg>
            </div>
        </div>
        @if($stats['pending_requests'] > 0)
            <a href="{{ route('admin.marketing-requests.index') }}?status=pending" style="color: var(--primary); font-size: 0.875rem; text-decoration: none; font-weight: 500;">
                View Requests →
            </a>
        @endif
    </div>

    <div class="stat-card">
        <div class="stat-header">
            <div>
                <div class="stat-label">Pending Media</div>
                <div class="stat-value">{{ $stats['pending_media'] }}</div>
            </div>
            <div class="stat-icon success">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/>
                </svg>
            </div>
        </div>
        @if($stats['pending_media'] > 0)
            <a href="{{ route('admin.media.index') }}?status=pending" style="color: var(--primary); font-size: 0.875rem; text-decoration: none; font-weight: 500;">
                Review Media →
            </a>
        @endif
    </div>

    <div class="stat-card">
        <div class="stat-header">
            <div>
                <div class="stat-label">Download Requests</div>
                <div class="stat-value">{{ $stats['pending_download_requests'] }}</div>
            </div>
            <div class="stat-icon warning">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
                </svg>
            </div>
        </div>
        @if($stats['pending_download_requests'] > 0)
            <a href="{{ route('admin.customer-download-requests.index') }}?status=pending" style="color: var(--primary); font-size: 0.875rem; text-decoration: none; font-weight: 500;">
                Review Requests →
            </a>
        @endif
    </div>
</div>

<!-- Recent Activity -->
<div class="recent-section">
    <div class="card">
        <div class="card-header">Recent Download Requests</div>
        <ul class="recent-list">
            @forelse($stats['recent_download_requests'] as $request)
                <li class="recent-item">
                    <div class="recent-info">
                        <div class="recent-title">{{ $request->resource_name }}</div>
                        <div class="recent-meta">
                            {{ $request->name }} ({{ $request->email }}) • {{ $request->created_at->diffForHumans() }}
                        </div>
                    </div>
                    @if($request->isPending())
                        <span class="badge badge-warning">Pending</span>
                    @elseif($request->isApproved())
                        <span class="badge badge-primary">Approved</span>
                    @else
                        <span class="badge" style="background: var(--gray-100); color: var(--gray-600);">Rejected</span>
                    @endif
                </li>
            @empty
                <li style="padding: 2rem; text-align: center; color: var(--gray-500);">
                    No download requests yet
                </li>
            @endforelse
        </ul>
        @if($stats['recent_download_requests']->count() > 0)
            <a href="{{ route('admin.customer-download-requests.index') }}" class="btn btn-secondary" style="margin-top: 1rem; width: 100%;">
                View All Requests
            </a>
        @endif
    </div>

    <div class="card">
        <div class="card-header">Recent Downloads</div>
        <ul class="recent-list">
            @forelse($stats['recent_downloads']->take(5) as $download)
                <li class="recent-item">
                    <div class="recent-info">
                        <div class="recent-title">{{ $download->resource_name }}</div>
                        <div class="recent-meta">
                            @if($download->user)
                                {{ $download->user->name }}
                            @else
                                Guest User
                            @endif
                             • {{ $download->created_at->diffForHumans() }}
                        </div>
                    </div>
                    @if($download->otp_verified)
                        <span class="badge badge-primary">OTP Verified</span>
                    @endif
                </li>
            @empty
                <li style="padding: 2rem; text-align: center; color: var(--gray-500);">
                    No downloads yet
                </li>
            @endforelse
        </ul>
        @if($stats['recent_downloads']->count() > 5)
            <a href="{{ route('admin.download-logs.index') }}" class="btn btn-secondary" style="margin-top: 1rem; width: 100%;">
                View All Downloads
            </a>
        @endif
    </div>

    <div class="card">
        <div class="card-header">Quick Actions</div>
        <div style="display: flex; flex-direction: column; gap: 0.75rem;">
            <a href="{{ route('admin.users.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
                </svg>
                Manage Users
            </a>
            <a href="{{ route('admin.divisions.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/>
                </svg>
                Manage Divisions
            </a>
            <a href="{{ route('admin.marketing-requests.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                </svg>
                Marketing Requests
            </a>
            <a href="{{ route('admin.media.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/>
                </svg>
                Review Media
            </a>
            <a href="{{ route('admin.customer-download-requests.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
                </svg>
                Download Requests
            </a>
            <a href="{{ route('admin.download-logs.index') }}" class="btn btn-secondary">
                <svg style="width: 16px; height: 16px; display: inline; margin-right: 0.5rem;" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                </svg>
                Download Logs
            </a>
        </div>
    </div>
</div>
@endsection