@extends('layouts.admin')

@section('title', 'Inquiry from ' . $message->name)
@section('page-title', 'Corporate Inquiry')

@section('content')
<div class="admin-card" style="max-width: 760px;">
  <div style="border-bottom: 1px solid var(--border-light); padding-bottom: 1.25rem; margin-bottom: 1.5rem;">
    <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.5rem;">
      <h2 style="font-size: 1.5rem; margin: 0;">{{ $message->name }}</h2>
      <span style="font-size: 0.85rem; color: var(--text-light);">{{ $message->created_at->format('F d, Y h:i A') }}</span>
    </div>
    <span style="color: var(--text-muted); font-size: 0.95rem;">
      {{ $message->company ? $message->company . ' • ' : '' }}{{ $message->email }} • {{ $message->phone }}
    </span>
  </div>

  <div style="margin-bottom: 1.5rem;">
    <span style="font-size: 0.8rem; color: var(--text-light); text-transform: uppercase; font-weight: 700;">Service Category:</span>
    <span class="badge badge-primary" style="margin-left: 0.5rem;">{{ ucfirst($message->service ?: 'General Inquiry') }}</span>
  </div>

  <div style="background: var(--bg-surface); padding: 2rem; border-radius: var(--radius-md); border: 1px solid var(--border-light); line-height: 1.8; color: var(--text-main); margin-bottom: 2rem; white-space: pre-wrap;">{{ $message->message }}</div>

  <div style="display: flex; gap: 1rem;">
    <a href="mailto:{{ $message->email }}?subject=Re:%20Zhelhire%20Consultancy%20Inquiry" class="btn btn-primary">
      <i class="fas fa-reply"></i> Reply via Email
    </a>
    <a href="tel:{{ $message->phone }}" class="btn btn-outline">
      <i class="fas fa-phone"></i> Call Sender
    </a>
    <a href="{{ route('admin.messages.index') }}" class="btn btn-outline" style="margin-left: auto;">
      Back to Inbox
    </a>
  </div>
</div>
@endsection