@extends('admin.layouts.admin')

@section('title', 'Messages')

@section('content')

    <h1 class="text-lg font-semibold text-brand-ink lg:text-2xl lg:font-extrabold">Contact Messages</h1>
    <p class="mt-1 text-brand-ink/65">Messages submitted through the website's contact form.</p>

    <div class="mt-8 overflow-x-auto rounded-2xl border border-brand-green-200 bg-white shadow-card">
        <table class="min-w-full divide-y divide-brand-green-200">
            <thead class="border-b border-brand-green-200 bg-brand-green-50">
                <tr>
                    <th class="px-5 py-3 text-left text-xs font-medium uppercase tracking-wide text-brand-ink/65 lg:font-bold">From</th>
                    <th class="px-5 py-3 text-left text-xs font-medium uppercase tracking-wide text-brand-ink/65 lg:font-bold">Subject</th>
                    <th class="px-5 py-3 text-left text-xs font-medium uppercase tracking-wide text-brand-ink/65 lg:font-bold">Received</th>
                    <th class="px-5 py-3"></th>
                </tr>
            </thead>
            <tbody class="divide-y divide-brand-green-200">
                @forelse ($messages as $message)
                    <tr class="{{ $message->is_read ? '' : 'bg-brand-green-50/50' }}">
                        <td class="px-5 py-3 text-sm">
                            <p class="font-semibold text-brand-ink">{{ $message->name }}</p>
                            <p class="text-xs text-brand-ink/65">{{ $message->email }}</p>
                        </td>
                        <td class="px-5 py-3 text-sm text-brand-ink/65">{{ $message->subject ?: '—' }}</td>
                        <td class="px-5 py-3 text-sm text-brand-ink/65">{{ $message->created_at->diffForHumans() }}</td>
                        <td class="px-5 py-3 text-right text-sm">
                            <a href="{{ route('admin.messages.show', $message) }}" class="font-semibold text-brand-green-800 hover:underline">View</a>
                            <form method="POST" action="{{ route('admin.messages.destroy', $message) }}" class="ml-3 inline" onsubmit="return confirm('Delete this message?');">
                                @csrf @method('DELETE')
                                <button type="submit" class="font-semibold text-accent-liver hover:underline">Delete</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="4" class="px-5 py-6 text-center text-sm text-brand-ink/65">No messages yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="mt-6">{{ $messages->links() }}</div>

@endsection