@extends('layouts.app')

@section('title', 'Email Templates')

@section('content')
    <div class="page-head">
        <div>
            <h1>Email Templates</h1>
            <div class="subtitle">The reusable messages your campaigns send</div>
        </div>
        <a class="btn" href="{{ route('templates.create') }}">+ New Template</a>
    </div>

    @if ($templates->isEmpty())
        <div class="panel">
            <div class="empty-state">
                <div class="empty-ico">📝</div>
                No templates yet. Create your first template to start sending campaigns.
            </div>
        </div>
    @else
        <div class="panel" style="padding:0; overflow:hidden;">
            <table style="margin:0;">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Subject</th>
                        <th style="width:180px;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($templates as $template)
                        <tr>
                            <td style="font-weight:600;">{{ $template->name }}</td>
                            <td>{{ $template->subject }}</td>
                            <td>
                                <div class="actions">
                                    <a class="btn secondary sm" href="{{ route('templates.edit', $template) }}">Edit</a>
                                    <form method="POST" action="{{ route('templates.destroy', $template) }}"
                                          onsubmit="return confirm('Delete this template?');">
                                        @csrf
                                        @method('DELETE')
                                        <button class="btn danger sm" type="submit">Delete</button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endif
@endsection