@php
$title = 'Visualizar Colaborador';
@endphp

<div class="container-fluid pt-1" style="margin-top: -32px;">
    <nav aria-label="breadcrumb" class="mb-2" style="margin-top: -18px;">
        <ol class="breadcrumb bg-transparent px-0 py-1 mb-1" style="font-size: 0.98rem;">
            <li class="breadcrumb-item"><a href="/" class="text-decoration-none text-secondary">Início</a></li>
            <li class="breadcrumb-item"><a href="#" onclick="carregarConteudo(`{{ route('cadastro.colaboradores') }}`)" class="text-decoration-none text-secondary">Colaboradores</a></li>
            <li class="breadcrumb-item active text-dark" aria-current="page">Visualizar</li>
        </ol>
    </nav>
    
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="fw-bold mb-0" style="font-size:2.1rem; letter-spacing:1px;">
                <i class="bi bi-eye me-2 text-primary"></i>{{ $colaborador->nome }}
            </h1>
            <span class="text-muted small">Matrícula: {{ $colaborador->matricula }} | {{ $colaborador->cargo->nome }}</span>
        </div>
        <div>
            <button type="button" class="btn btn-sm btn-outline-primary" onclick="carregarConteudo(`{{ route('cadastro.colaboradores.editar', ['id' => $colaborador->id]) }}`)">
                <i class="bi bi-pencil-square me-2"></i>Editar
            </button>
        </div>
    </div>
    
    <div class="row">
        <div class="col-md-8">
            <div class="card shadow border-0 mb-4">
                <div class="card-body">
                    <h5 class="fw-bold mb-3"><i class="bi bi-person-vcard me-2"></i>Dados Pessoais</h5>
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <label class="text-muted small">Nome Completo</label>
                            <p class="mb-0">{{ $colaborador->nome }}</p>
                        </div>
                        <div class="col-md-3">
                            <label class="text-muted small">CPF</label>
                            <p class="mb-0">{{ $colaborador->cpf }}</p>
                        </div>
                        <div class="col-md-3">
                            <label class="text-muted small">Data de Nascimento</label>
                            <p class="mb-0">{{ $colaborador->data_nascimento ? \Carbon\Carbon::parse($colaborador->data_nascimento)->format('d/m/Y') : '-' }}</p>
                        </div>
                    </div>
                    
                    <div class="row mb-3">
                        <div class="col-md-4">
                            <label class="text-muted small">E-mail</label>
                            <p class="mb-0"><a href="mailto:{{ $colaborador->email }}">{{ $colaborador->email }}</a></p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted small">Telefone</label>
                            <p class="mb-0">{{ $colaborador->telefone ?? '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted small">Celular</label>
                            <p class="mb-0">{{ $colaborador->celular }}</p>
                        </div>
                    </div>
                    
                    <hr class="my-4">
                    
                    <h5 class="fw-bold mb-3"><i class="bi bi-briefcase me-2"></i>Dados Profissionais</h5>
                    <div class="row mb-3">
                        <div class="col-md-3">
                            <label class="text-muted small">Matrícula</label>
                            <p class="mb-0">{{ $colaborador->matricula }}</p>
                        </div>
                        <div class="col-md-3">
                            <label class="text-muted small">Data de Admissão</label>
                            <p class="mb-0">{{ \Carbon\Carbon::parse($colaborador->data_admissao)->format('d/m/Y') }}</p>
                        </div>
                        <div class="col-md-3">
                            <label class="text-muted small">Área</label>
                            <p class="mb-0">{{ $colaborador->cargo->area->nome }}</p>
                        </div>
                        <div class="col-md-3">
                            <label class="text-muted small">Cargo</label>
                            <p class="mb-0">{{ $colaborador->cargo->nome }}</p>
                        </div>
                    </div>
                    
                    <div class="row mb-3">
                        <div class="col-md-4">
                            <label class="text-muted small">Setor</label>
                            <p class="mb-0">{{ $colaborador->setor->nome }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted small">Horário de Trabalho</label>
                            <p class="mb-0">{{ $colaborador->horario_trabalho ?? '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted small">Status</label>
                            <p class="mb-0"><span class="badge bg-{{ $colaborador->is_active ? 'success' : 'secondary' }}">{{ $colaborador->is_active ? 'Ativo' : 'Inativo' }}</span></p>
                        </div>
                    </div>
                    
                    @if($colaborador->observacoes)
                        <div class="row mb-3">
                            <div class="col-md-12">
                                <label class="text-muted small">Observações</label>
                                <p class="mb-0">{{ $colaborador->observacoes }}</p>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
        
        <div class="col-md-4">
            <div class="card shadow border-0 mb-4">
                <div class="card-body">
                    <h5 class="fw-bold mb-3"><i class="bi bi-people me-2"></i>Equipes</h5>
                    @if($colaborador->equipes && $colaborador->equipes->count() > 0)
                        <ul class="list-group list-group-flush">
                            @foreach($colaborador->equipes as $equipe)
                                <li class="list-group-item px-0">
                                    <div class="d-flex justify-content-between align-items-center">
                                        <div>
                                            <strong>{{ $equipe->nome }}</strong>
                                            @if($equipe->responsavel_id == $colaborador->id)
                                                <span class="badge bg-warning text-dark ms-2">Responsável</span>
                                            @endif
                                        </div>
                                        <a href="#" onclick="carregarConteudo(`{{ route('cadastro.equipes.visualizar', ['id' => $equipe->id]) }}`)" class="text-decoration-none">
                                            <i class="bi bi-arrow-right-circle"></i>
                                        </a>
                                    </div>
                                </li>
                            @endforeach
                        </ul>
                    @else
                        <p class="text-muted mb-0">Não participa de nenhuma equipe</p>
                    @endif
                </div>
            </div>
            
            <div class="card shadow border-0">
                <div class="card-body">
                    <h5 class="fw-bold mb-3"><i class="bi bi-clock-history me-2"></i>Informações</h5>
                    <div class="mb-2">
                        <label class="text-muted small">Cadastrado em</label>
                        <p class="mb-0">{{ \Carbon\Carbon::parse($colaborador->created_at)->format('d/m/Y H:i') }}</p>
                    </div>
                    <div>
                        <label class="text-muted small">Última atualização</label>
                        <p class="mb-0">{{ \Carbon\Carbon::parse($colaborador->updated_at)->format('d/m/Y H:i') }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="d-flex justify-content-end gap-2 mt-4">
        <button type="button" class="btn btn-secondary" onclick="carregarConteudo(`{{ route('cadastro.colaboradores') }}`)">
            <i class="bi bi-arrow-left-circle me-2"></i>Voltar
        </button>
    </div>
</div>