@extends('sistema.layout')
@section('titulo', 'Relatórios e Análises')
@section('conteudo')

<div class="row">
    {{-- Cabeçalho com breadcrumb --}}
    <div class="col-lg-12 mb-2">
        <div class="pagetitle">
            <h1 class="fw-bold text-dark mb-1">
                <i class="fa-solid fa-chart-line me-2"></i>
                Relatórios e Análises
            </h1>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb small">
                    <li class="breadcrumb-item">
                        <a href="{{ route('dashboard') }}" class="text-decoration-none">Dashboard</a>
                    </li>
                    <li class="breadcrumb-item" aria-current="page">Relatórios</li>
                    <li class="breadcrumb-item active" aria-current="page">Análises</li>
                </ol>
            </nav>
            <p class="text-muted mt-2">Gerencie e visualize relatórios detalhados de todos os módulos do sistema</p>
        </div>
    </div>

    {{-- Cards de resumo (estilo igual ao de Salas) --}}
    <div class="col-12 mb-3">
        <div class="row">
            {{-- Processos --}}
            <div class="col-lg-3 col-md-6 col-sm-12 mb-3">
                <div class="card py-3">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-secondary mb-0 fw-semibold">Total de Processos</h6>
                            <h2 class="fw-bold mb-0">{{ number_format($processos['total'] ?? 0, 0, ',', '.') }}</h2>
                        </div>
                        <div class="bg-default rounded-circle d-flex align-items-center justify-content-center"
                            style="width:55px; height:55px;">
                            <i class="fa-solid fa-folder fa-lg"></i>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Livros --}}
            <div class="col-lg-3 col-md-6 col-sm-12 mb-3">
                <div class="card py-3">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-secondary mb-0 fw-semibold">Total de Livros</h6>
                            <h2 class="fw-bold mb-0">{{ number_format($livros['total'] ?? 0, 0, ',', '.') }}</h2>
                        </div>
                        <div class="bg-default rounded-circle d-flex align-items-center justify-content-center"
                            style="width:55px; height:55px;">
                            <i class="fa-solid fa-book fa-lg"></i>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Itens de Museu --}}
            <div class="col-lg-3 col-md-6 col-sm-12 mb-3">
                <div class="card py-3">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-secondary mb-0 fw-semibold">Itens de Museu</h6>
                            <h2 class="fw-bold mb-0">{{ number_format($museu['total'] ?? 0, 0, ',', '.') }}</h2>
                        </div>
                        <div class="bg-default rounded-circle d-flex align-items-center justify-content-center"
                            style="width:55px; height:55px;">
                            <i class="fa-solid fa-museum fa-lg"></i>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Documentos --}}
            <div class="col-lg-3 col-md-6 col-sm-12 mb-3">
                <div class="card py-3">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-secondary mb-0 fw-semibold">Documentos</h6>
                            <h2 class="fw-bold mb-0">{{ number_format($documentos['total'] ?? 0, 0, ',', '.') }}</h2>
                        </div>
                        <div class="bg-default rounded-circle d-flex align-items-center justify-content-center"
                            style="width:55px; height:55px;">
                            <i class="fa-solid fa-file-archive fa-lg"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Título da seção de relatórios --}}
    <div class="col-lg-12 mb-3">
        <h4 class="fw-bold">
            <i class="fa-solid fa-file-lines me-2"></i>
            Relatórios Disponíveis
        </h4>
    </div>

    {{-- Grid de relatórios --}}
    <div class="col-lg-12">
        <div class="row">
            {{-- Processos --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-primary text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-folder me-2"></i>
                            Relatório de Processos
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Visualize detalhes completos sobre todos os processos cadastrados no sistema.</p>
                        <div class="mb-3">
                            <span class="badge bg-primary">{{ $processos['total'] ?? 0 }} Processos</span>
                            <span class="badge bg-success">{{ $processos['ativos'] ?? 0 }} Ativos</span>
                            <span class="badge bg-warning">{{ $processos['pendentes'] ?? 0 }} Pendentes</span>
                            <span class="badge bg-secondary">{{ $processos['arquivados'] ?? 0 }} Arquivados</span>
                        </div>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.processos') }}" class="btn btn-sm btn-primary">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                        <a href="{{ route('relatorios.estatisticas.processos') }}" class="btn btn-sm btn-outline-primary">
                            <i class="fa-solid fa-chart-bar me-1"></i> Estatísticas
                        </a>
                    </div>
                </div>
            </div>

            {{-- Biblioteca --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-success text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-book me-2"></i>
                            Relatório de Biblioteca
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Acompanhe todos os livros, empréstimos e devoluções do acervo.</p>
                        <div class="mb-3">
                            <span class="badge bg-success">{{ $livros['total'] ?? 0 }} Livros</span>
                            <span class="badge bg-info">{{ $livros['disponiveis'] ?? 0 }} Disponíveis</span>
                            <span class="badge bg-warning">{{ $livros['emprestados'] ?? 0 }} Emprestados</span>
                            <span class="badge bg-secondary">{{ $livros['reservados'] ?? 0 }} Reservados</span>
                        </div>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.livros') }}" class="btn btn-sm btn-success">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                        <a href="{{ route('relatorios.estatisticas.biblioteca') }}" class="btn btn-sm btn-outline-success">
                            <i class="fa-solid fa-chart-bar me-1"></i> Estatísticas
                        </a>
                    </div>
                </div>
            </div>

            {{-- Museu --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-info text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-museum me-2"></i>
                            Relatório de Museu
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Gerencie o acervo do museu, empréstimos e exposições.</p>
                        <div class="mb-3">
                            <span class="badge bg-info">{{ $museu['total'] ?? 0 }} Itens</span>
                            <span class="badge bg-success">{{ $museu['disponiveis'] ?? 0 }} Disponíveis</span>
                            <span class="badge bg-primary">{{ $museu['emprestados'] ?? 0 }} Emprestados</span>
                            <span class="badge bg-secondary">{{ $museu['em_exposicao'] ?? 0 }} Em Exposição</span>
                        </div>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.museu') }}" class="btn btn-sm btn-info">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                        <a href="{{ route('relatorios.estatisticas.museu') }}" class="btn btn-sm btn-outline-info">
                            <i class="fa-solid fa-chart-bar me-1"></i> Estatísticas
                        </a>
                    </div>
                </div>
            </div>

            {{-- Documentos --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-warning text-dark">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-file-archive me-2"></i>
                            Relatório de Documentos
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Acompanhe a digitalização e organização dos documentos institucionais.</p>
                        <div class="mb-3">
                            <span class="badge bg-warning text-dark">{{ $documentos['total'] ?? 0 }} Documentos</span>
                            <span class="badge bg-success">{{ $documentos['digitalizados'] ?? 0 }} Digitalizados</span>
                            <span class="badge bg-secondary">{{ $documentos['pendentes'] ?? 0 }} Pendentes</span>
                        </div>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.documentos') }}" class="btn btn-sm btn-warning text-dark">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                        <a href="{{ route('relatorios.estatisticas.documentos') }}" class="btn btn-sm btn-outline-warning">
                            <i class="fa-solid fa-chart-bar me-1"></i> Estatísticas
                        </a>
                    </div>
                </div>
            </div>

            {{-- Empréstimos --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-secondary text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-hand-holding-hand me-2"></i>
                            Relatório de Empréstimos
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Acompanhe todos os empréstimos de livros e itens de museu.</p>
                        <p class="small text-muted">Consolidado de Biblioteca e Museu</p>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.emprestimos') }}" class="btn btn-sm btn-secondary">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                    </div>
                </div>
            </div>

            {{-- Auditoria --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-danger text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-shield me-2"></i>
                            Relatório de Auditoria
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Rastrear todas as ações e alterações realizadas no sistema.</p>
                        <p class="small text-muted">Segurança e conformidade</p>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.auditoria') }}" class="btn btn-sm btn-danger">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Auditoria
                        </a>
                    </div>
                </div>
            </div>

            {{-- Geral --}}
            <div class="col-lg-6 mb-3">
                <div class="card h-100 shadow-sm border-0">
                    <div class="card-header bg-dark text-white">
                        <h5 class="mb-0">
                            <i class="fa-solid fa-square-poll-vertical me-2"></i>
                            Relatório Geral do Sistema
                        </h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted mb-3">Visão consolidada de todas as estatísticas do sistema.</p>
                        <p class="small text-muted">Resumo executivo completo</p>
                    </div>
                    <div class="card-footer bg-white border-top">
                        <a href="{{ route('relatorios.geral') }}" class="btn btn-sm btn-dark">
                            <i class="fa-solid fa-eye me-1"></i> Visualizar Relatório
                        </a>
                        <a href="{{ route('relatorios.executivo') }}" class="btn btn-sm btn-outline-dark">
                            <i class="fa-solid fa-chart-pie me-1"></i> Dashboard Executivo
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Atividades Recentes (card com tabela) --}}
    <div class="col-lg-12 mt-4">
        <div class="card p-4">
            <div class="card-body">
                <h5 class="card-title fw-bold mb-3">
                    <i class="fa-solid fa-history me-2"></i>
                    Atividades Recentes
                </h5>

                <div class="table-responsive">
                    <table class="table table-sm table-hover">
                        <thead>
                            <tr>
                                <th>Data/Hora</th>
                                <th>Usuário</th>
                                <th>Ação</th>
                                <th>Módulo</th>
                                <th>Descrição</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($auditorias_recentes as $auditoria)
                                <tr>
                                    <td class="small">{{ $auditoria->created_at->format('d/m/Y H:i') }}</td>
                                    <td class="small">{{ $auditoria->usuario?->name ?? 'Sistema' }}</td>
                                    <td class="small">
                                        <span class="badge bg-info">{{ $auditoria->acao }}</span>
                                    </td>
                                    <td class="small">{{ ucfirst(str_replace('_', ' ', $auditoria->tabela)) }}</td>
                                    <td class="small">{{ Str::limit($auditoria->descricao, 50) }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="5" class="text-center text-muted py-3">
                                        Nenhuma atividade registrada
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Estilos adicionais para manter a consistência --}}
<style>
    .card {
        transition: all 0.3s ease;
    }

    .card:hover {
        transform: translateY(-3px);
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    }

    .bg-default {
        background-color: #f0f0f0; /* cinza claro para o círculo do ícone */
    }

    .badge {
        padding: 0.4rem 0.6rem;
        font-weight: 500;
    }
</style>

@endsection