@extends('layouts.empresas')

@section('title', 'Afastamentos')

@section('content')
<div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
    <div class="flex items-center justify-between mt-2">
        <div>
            <h1 class="text-2xl font-semibold tracking-tight text-gray-900">Afastamentos</h1>
            <p class="text-sm text-gray-500">Empregado: {{ $employee->full_name }}</p>
        </div>
        <a href="{{ route('empresa.empregados.afastamentos.create', $employee) }}" class="inline-flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg shadow">
            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor"><path d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"/></svg>
            Novo Afastamento
        </a>
    </div>

    @if(session('success'))
        <div class="mt-4 rounded-lg border border-green-200 bg-green-50 text-green-800 px-4 py-3">{{ session('success') }}</div>
    @endif

    <div class="mt-4 bg-white border border-gray-200 rounded-xl overflow-hidden shadow-sm">
        <table class="min-w-full">
            <thead class="bg-gray-50 text-left text-xs font-semibold text-gray-600">
                <tr>
                    <th class="px-6 py-3">Data</th>
                    <th class="px-6 py-3">Dias</th>
                    <th class="px-6 py-3">CID-10</th>
                    <th class="px-6 py-3">CRM</th>
                    <th class="px-6 py-3 text-right">Ações</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                @forelse($afastamentos as $afastamento)
                    <tr class="hover:bg-gray-50">
                        <td class="px-6 py-4 text-gray-900">{{ optional($afastamento->data_atestado)->format('d/m/Y') ?? '-' }}</td>
                        <td class="px-6 py-4 text-gray-700">{{ $afastamento->dias ?? '-' }}</td>
                        <td class="px-6 py-4 text-gray-700">{{ $afastamento->cid10 ?? '-' }}</td>
                        <td class="px-6 py-4 text-gray-700">{{ $afastamento->medico_crm ?? '-' }}</td>
                        <td class="px-6 py-4">
                            <div class="flex justify-end gap-2">
                                <a href="{{ route('empresa.empregados.afastamentos.show', [$employee, $afastamento]) }}" class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-lg border border-gray-200 text-gray-700 hover:bg-gray-50">Detalhes</a>
                                <a href="{{ route('empresa.empregados.afastamentos.download', [$employee, $afastamento]) }}" class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-lg border border-purple-200 text-purple-700 hover:bg-purple-50">Baixar</a>
                                <a href="{{ route('empresa.empregados.afastamentos.edit', [$employee, $afastamento]) }}" class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-lg border border-blue-200 text-blue-700 hover:bg-blue-50">Editar</a>
                                <form action="{{ route('empresa.empregados.afastamentos.destroy', [$employee, $afastamento]) }}" method="POST" onsubmit="return confirm('Deseja excluir este afastamento?')">
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit" class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-lg border border-red-200 text-red-700 hover:bg-red-50">Excluir</button>
                                </form>
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5" class="px-6 py-16 text-center text-sm text-gray-500">Nenhum afastamento encontrado.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div class="mt-4">
        <a href="{{ route('empresa.empregados.index') }}" class="inline-flex items-center gap-2 text-sm px-4 py-2 rounded-lg border border-gray-200 text-gray-700 hover:bg-gray-50">Voltar aos empregados</a>
    </div>
</div>
@endsection