@extends('admin.layout.app')

@section('title', 'View Contact Message')

@push('styles')
<link href="/csstemplate/libs/downloaded/bootstrap.min.css" rel="stylesheet">
  <style> a{text-decoration: none !important; } </style>
<style>
    .contact-detail p { margin-bottom: 0.5rem; }
</style>
@endpush

@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5 class="mb-0">Contact Message Details</h5>
            <a href="{{ route('admin.contact.index') }}" class="btn btn-sm btn-primary">
                <i class="bi bi-arrow-left-circle me-1"></i> Back to Messages
            </a>
        </div>

        <div class="card-body">
            <div class="row g-3">
                <div class="col-md-6">
                    <div class="contact-detail">
                        <h6 class="text-primary">Name</h6>
                        <p>{{ $contact->name }}</p>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="contact-detail">
                        <h6 class="text-primary">Email</h6>
                        <p>{{ $contact->email }}</p>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="contact-detail">
                        <h6 class="text-primary">Phone</h6>
                        <p>{{ $contact->phone ?? 'N/A' }}</p>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="contact-detail">
                        <h6 class="text-primary">Subject</h6>
                        <p>{{ $contact->subject }}</p>
                    </div>
                </div>
                <div class="col-12">
                    <div class="contact-detail">
                        <h6 class="text-primary">Message</h6>
                        <p>{{ $contact->message }}</p>
                    </div>
                </div>
                <div class="col-12">
                    <div class="contact-detail">
                        <h6 class="text-primary">Submitted At</h6>
                        <p>{{ $contact->created_at->format('Y-m-d H:i') }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection