@extends('layouts.admin')

@section('title', 'Dashboard')

@section('content')
<!-- Page Heading -->
<div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">Dashboard</h1>
</div>

<!-- Estatísticas do Site -->
<div class="row">
    <!-- Card Chamados -->
    <div class="col-xl-3 col-md-6 mb-4">
        <div class="card border-left-warning shadow h-100 py-2">
            <div class="card-body">
                <div class="row no-gutters align-items-center">
                    <div class="col me-2">
                        <div class="text-xs font-weight-bold text-warning text-uppercase mb-1">
                            Chamados Pendentes</div>
                        <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $metrics['pending_tickets'] }}</div>
                    </div>
                    <div class="col-auto">
                        <i class="bi bi-chat-dots text-gray-300"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @if(isset($metrics['total_products']))
    <!-- Card Produtos (Products Module) -->
    <div class="col-xl-3 col-md-6 mb-4">
        <div class="card border-left-primary shadow h-100 py-2">
            <div class="card-body">
                <div class="row no-gutters align-items-center">
                    <div class="col me-2">
                        <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                            Total de Produtos</div>
                        <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $metrics['total_products'] }}</div>
                    </div>
                    <div class="col-auto">
                        <i class="bi bi-box text-gray-300"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    @if(isset($metrics['total_services']))
    <!-- Card Serviços (Services Module) -->
    <div class="col-xl-3 col-md-6 mb-4">
        <div class="card border-left-success shadow h-100 py-2">
            <div class="card-body">
                <div class="row no-gutters align-items-center">
                    <div class="col me-2">
                        <div class="text-xs font-weight-bold text-success text-uppercase mb-1">
                            Total de Serviços</div>
                        <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $metrics['total_services'] }}</div>
                    </div>
                    <div class="col-auto">
                        <i class="bi bi-bell text-gray-300"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    @if(Auth::user()->isAdmin())
    <!-- Card Cadastros (Admin only) -->
    <div class="col-xl-3 col-md-6 mb-4">
        <div class="card border-left-secondary shadow h-100 py-2">
            <div class="card-body">
                <div class="row no-gutters align-items-center">
                    <div class="col me-2">
                        <div class="text-xs font-weight-bold text-secondary text-uppercase mb-1">
                            Usuários Cadastrados</div>
                        <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $metrics['total_users'] }}</div>
                    </div>
                    <div class="col-auto">
                        <i class="bi bi-persons text-gray-300"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif
</div>

<!-- Segunda Linha de Cards (Mensagens) -->
<div class="row">
    <!-- Card Contatos -->
    <div class="col-xl-3 col-md-6 mb-4">
        <div class="card border-left-info shadow h-100 py-2">
            <div class="card-body">
                <div class="row no-gutters align-items-center">
                    <div class="col me-2">
                        <div class="text-xs font-weight-bold text-info text-uppercase mb-1">
                            Mensagens Recebidas</div>
                        <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $metrics['total_contacts'] }}</div>
                    </div>
                    <div class="col-auto">
                        <i class="bi bi-envelope text-gray-300"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Content Row -->
<div class="row">
    <div class="col-lg-12 mb-4">
        @if(session('success'))
            <div class="alert alert-success border-0 shadow-sm mb-4">{{ session('success') }}</div>
        @endif

        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">
                    Bem-vindo, {{ Auth::user()->name }}!
                    <span class="badge badge-{{ Auth::user()->isAdmin() ? 'danger' : 'primary' }} ml-2">{{ Auth::user()->user_type }}</span>
                </h6>
            </div>
            <div class="card-body">
                <p>Você está logado no painel administrativo da <strong>{{ $company->name }}</strong>.</p>
                @if(Auth::user()->isAdmin())
                <p class="mb-0">Como <strong>Administrador</strong>, você tem acesso total ao sistema: gerenciar usuários, configurar permissões, serviços, produtos e todas as funcionalidades.</p>
                @else
                <p class="mb-0">Aqui você poderá gerenciar as seções do sistema que o administrador liberou para seu acesso. Utilize o menu lateral para navegar.</p>
                @endif
            </div>
        </div>

        <!-- Card de Solicitação de Funcionalidades Premium -->
        <div class="card shadow mb-4 border-0 overflow-hidden">
            <div class="row no-gutters">
                <div class="col-lg-5 bg-gradient-primary p-5 d-flex flex-column justify-content-center text-white">
                    <div class="mb-4">
                        <span class="badge badge-warning text-dark px-3 py-2 mb-3 fw-bold text-uppercase shadow-sm">
                            <i class="bi bi-rocket me-1"></i> Evolução Contínua
                        </span>
                        <h2 class="display-5 fw-bold mb-3">Seu site pode ir muito além!</h2>
                        <p class="lead opacity-90">O <strong>SysSiteCMS</strong> foi projetado para crescer junto com o seu negócio. Se você sente que seu painel precisa de algo novo e exclusivo, nós podemos criar.</p>
                    </div>
                    
                    <ul class="list-unstyled mb-4">
                        <li class="mb-3 d-flex align-items-center">
                            <i class="bi bi-check-circle text-warning me-3"></i>
                            <span>Soluções personalizadas para o seu fluxo</span>
                        </li>
                        <li class="mb-3 d-flex align-items-center">
                            <i class="bi bi-check-circle text-warning me-3"></i>
                            <span>Recursos sob medida para sua empresa</span>
                        </li>
                        <li class="mb-3 d-flex align-items-center">
                            <i class="bi bi-check-circle text-warning me-3"></i>
                            <span>Inovação e tecnologia de ponta</span>
                        </li>
                        <li class="d-flex align-items-center">
                            <i class="bi bi-check-circle text-warning me-3"></i>
                            <span>Sua ideia transformada em ferramenta</span>
                        </li>
                    </ul>

                    <div class="mt-auto pt-4 border-top border-light opacity-80">
                        <div class="small text-uppercase fw-bold mb-2">Fale com nossos especialistas:</div>
                        <a href="mailto:contato@syspanel.com.br" class="text-white text-decoration-none h5 mb-0">
                            <i class="bi bi-envelope me-2"></i> contato@syspanel.com.br
                        </a>
                    </div>
                </div>
                <div class="col-lg-7 bg-white p-5">
                    <div class="p-2">
                        <h3 class="font-weight-bold text-gray-900 mb-4">Qual é o próximo passo para o seu site?</h3>
                        <p class="text-muted mb-4">Compartilhe sua visão conosco. Descreva o que facilitaria o seu dia a dia ou qual novo desafio seu site precisa enfrentar hoje.</p>
                        
                        <form action="{{ route('home.feature.request') }}" method="POST">
                            @csrf
                            <div class="form-group mb-4">
                                <label class="small font-weight-bold text-primary text-uppercase">Sua ideia / Sugestão</label>
                                <textarea name="feature_description" class="form-control form-control-lg border-left-primary @error('feature_description') is-invalid @enderror" 
                                    rows="5" placeholder="Conte-nos o que você está imaginando para o seu painel..." required></textarea>
                                @error('feature_description') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <button type="submit" class="btn btn-primary btn-block btn-lg py-3 fw-bold shadow hover-up">
                                <i class="bi bi-lightbulb me-2"></i> Solicitar Consultoria de Inovação
                            </button>
                        </form>
                        <p class="text-center mt-4 small text-muted">
                            <i class="bi bi-shield-check me-1"></i> Sua solicitação será enviada com segurança para nossa equipe técnica.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection