@extends('layouts.app')
@section('title', 'Department Templates')
@section('page-title', 'Department Templates')
@section('page-subtitle', 'Starter packs for new company setup')
@section('breadcrumbs')
    @include('layouts.components.breadcrumbs', ['items' => [['label' => 'Admin', 'url' => '/admin/dashboard'], ['label' => 'Dept Templates']]])
@endsection
@section('page-actions')
    <a href="{{ route('admin.department-templates.create') }}" class="btn-primary">
        <svg class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
        Add Template
    </a>
@endsection

@section('content')
<div class="card-static animate-fade-up">
    <div class="overflow-x-auto">
        <table class="data-table">
            <thead><tr><th>Name</th><th>Description</th><th>Departments</th><th>Status</th><th class="text-right">Actions</th></tr></thead>
            <tbody>
                @forelse($templates as $t)
                <tr>
                    <td class="font-medium text-gray-800">{{ $t->name }}</td>
                    <td class="text-sm text-gray-500">{{ $t->description ?? '—' }}</td>
                    <td>
                        <div class="flex flex-wrap gap-1">
                            @foreach($t->departments as $d)
                                <span class="inline-block bg-gray-100 text-gray-600 text-xxs px-2 py-0.5 rounded-full">{{ $d }}</span>
                            @endforeach
                        </div>
                    </td>
                    <td>
                        @if($t->is_active)<span class="badge badge-active"><span class="badge-dot"></span>Active</span>
                        @else<span class="badge badge-inactive">Inactive</span>@endif
                    </td>
                    <td class="text-right">
                        <div class="flex items-center justify-end gap-1">
                            <a href="{{ route('admin.department-templates.edit', $t) }}" class="btn-icon w-8 h-8" title="Edit">
                                <svg class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
                            </a>
                            <form method="POST" action="{{ route('admin.department-templates.destroy', $t) }}" id="del-tpl-{{ $t->id }}">
                                @csrf @method('DELETE')
                                <button type="button" class="btn-icon w-8 h-8 text-danger-500 hover:bg-danger-50" onclick="window.dispatchEvent(new CustomEvent('open-confirm',{detail:{title:'Delete Template',message:'Delete &quot;{{ $t->name }}&quot;?',confirmText:'Delete',action:()=>document.getElementById('del-tpl-{{ $t->id }}').submit()}}))">
                                    <svg class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr><td colspan="5">@include('layouts.components.empty-state', ['icon' => 'box', 'title' => 'No templates', 'message' => 'Create department starter packs for new companies.', 'actionUrl' => route('admin.department-templates.create'), 'actionLabel' => 'Add Template'])</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($templates->hasPages())<div class="px-5 py-3 border-t border-gray-100">@include('layouts.components.pagination', ['paginator' => $templates])</div>@endif
</div>
@endsection