@extends('layouts.admin')
@section('title', 'View Message')
@section('header', 'Contact Message')

@section('content')
<div class="bg-white rounded-xl shadow-sm p-6 max-w-2xl">
    <div class="flex items-center justify-between mb-6">
        <div>
            <h2 class="text-xl font-bold text-primary">{{ $contact->name }}</h2>
            <p class="text-gray-500">{{ $contact->email }}</p>
        </div>
        <div class="text-gray-400 text-sm">{{ $contact->created_at->format('F d, Y - h:i A') }}</div>
    </div>

    <div class="bg-gray-50 p-4 rounded-lg mb-6">
        <p class="text-gray-700 whitespace-pre-wrap">{{ $contact->message }}</p>
    </div>

    <div class="flex gap-4">
        <a href="mailto:{{ $contact->email }}" class="px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary-700">Reply via Email</a>
        <form method="POST" action="{{ route('admin.contacts.destroy', $contact) }}">@csrf @method('DELETE')<button type="submit" class="px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700" onclick="return confirm('Delete this message?')">Delete</button></form>
        <a href="{{ route('admin.contacts.index') }}" class="px-4 py-2 bg-gray-300 text-gray-700 rounded-lg hover:bg-gray-400">Back</a>
    </div>
</div>
@endsection