@extends('admin::layouts.app')

@section('title', 'Templates — BizWap Admin')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h4 class="fw-bold mb-0">Templates</h4>
        <p class="text-muted small mb-0">Review and submit business WhatsApp templates to Meta.</p>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success alert-dismissible fade show border-0 shadow-sm" role="alert">
        <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
@endif

@if(session('error'))
    <div class="alert alert-danger alert-dismissible fade show border-0 shadow-sm" role="alert">
        <i class="bi bi-exclamation-circle me-2"></i>{{ session('error') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
@endif

{{-- Filters --}}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-body p-3">
        <form method="GET" action="{{ route('admin.templates.index') }}" class="row g-2 align-items-end">
            <div class="col-md-4">
                <label class="form-label small text-muted mb-1">Status</label>
                <select name="status" class="form-select form-select-sm">
                    <option value="">All statuses</option>
                    @foreach(['DRAFT', 'PENDING', 'APPROVED', 'REJECTED', 'PAUSED', 'DISABLED'] as $s)
                        <option value="{{ $s }}" {{ request('status') === $s ? 'selected' : '' }}>{{ $s }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-auto">
                <button type="submit" class="btn btn-sm btn-primary">Filter</button>
                @if(request()->hasAny(['status', 'business_id']))
                    <a href="{{ route('admin.templates.index') }}" class="btn btn-sm btn-outline-secondary ms-1">Clear</a>
                @endif
            </div>
        </form>
    </div>
</div>

<div class="card border-0 shadow-sm">
    <div class="card-body p-0">
        @if($templates->isEmpty())
            <div class="text-center text-muted py-5">
                <i class="bi bi-layout-text-sidebar-reverse" style="font-size: 2.5rem; opacity: 0.3;"></i>
                <p class="mt-3 mb-0">No templates found.</p>
            </div>
        @else
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead class="table-light">
                        <tr>
                            <th>Template</th>
                            <th>Business</th>
                            <th>Category</th>
                            <th>Language</th>
                            <th>Status</th>
                            <th>Created</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($templates as $template)
                            <tr>
                                <td>
                                    <a href="{{ route('admin.businesses.templates.show', [$template->business, $template]) }}" class="text-decoration-none fw-medium">
                                        {{ $template->name }}
                                    </a>
                                </td>
                                <td class="text-muted">{{ $template->business->name ?? '—' }}</td>
                                <td><span class="badge bg-secondary-subtle text-secondary-emphasis">{{ $template->category }}</span></td>
                                <td>{{ $template->language }}</td>
                                <td>
                                    <span class="badge bg-{{ $template->statusBadgeClass() }}-subtle text-{{ $template->statusBadgeClass() }}-emphasis text-uppercase">
                                        {{ $template->status }}
                                    </span>
                                </td>
                                <td class="text-muted small">{{ $template->created_at->format('d M Y') }}</td>
                                <td class="text-end">
                                    <a href="{{ route('admin.businesses.templates.show', [$template->business, $template]) }}" class="btn btn-sm btn-outline-secondary">
                                        Review
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            @if($templates->hasPages())
                <div class="p-3 border-top">
                    {{ $templates->links() }}
                </div>
            @endif
        @endif
    </div>
</div>
@endsection