@extends('layouts.admin')

@section('title', 'Message Details')

@section('content')
<div class="page-header">
    <div class="page-header-left">
        <a href="{{ route('admin.messages') }}" class="btn-back">
            <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M10 12L6 8l4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
            Back to Messages
        </a>
        <h1 class="page-title">Message Details</h1>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <div class="info-list" style="width: 100%;">
            <div class="info-item">
                <span class="info-label">Subject</span>
                <span class="info-value text-lg text-semibold">{{ $message->subject }}</span>
            </div>
        </div>
    </div>
    <div class="card-body">
        <div class="info-list" style="margin-bottom: 1.5rem;">
            <div class="info-item">
                <span class="info-label">Type</span>
                <span class="info-value"><span class="badge badge-{{ $message->type === 'announcement' ? 'blue' : ($message->type === 'alert' ? 'red' : 'green') }}">{{ ucfirst($message->type) }}</span></span>
            </div>
            <div class="info-item">
                <span class="info-label">Sent By</span>
                <span class="info-value">{{ $message->sender->name ?? 'System' }}</span>
            </div>
            <div class="info-item">
                <span class="info-label">To</span>
                <span class="info-value">{{ $message->recipient_name ?? 'System' }}</span>
            </div>
            <div class="info-item">
                <span class="info-label">Date</span>
                <span class="info-value">{{ $message->created_at->format('M d, Y H:i:s') }}</span>
            </div>
        </div>

        <div class="message-body">
            {!! nl2br(e($message->body)) !!}
        </div>
    </div>
</div>
@endsection