@extends('layouts.app')

@section('content')
<div class="max-w-4xl mx-auto px-4 py-8">

    <div class="flex justify-between items-center mb-6">
        <a href="{{ route('admin.tickets.index') }}" class="text-gray-600 hover:text-gray-900 font-bold">
            ← Retour liste
        </a>

        @if($ticket->status != 'ferme')
            <form action="{{ route('admin.tickets.close', $ticket->id) }}" method="POST" onsubmit="return confirm('Clôturer ce ticket ?');">
                @csrf
                <button type="submit" class="bg-red-100 text-red-700 px-4 py-2 rounded font-bold hover:bg-red-200 border border-red-200">
                    🔒 Clôturer le ticket
                </button>
            </form>
        @else
             <span class="bg-gray-200 text-gray-600 px-4 py-2 rounded font-bold">Ticket Clôturé</span>
        @endif
    </div>

    <div class="bg-white p-6 rounded-lg shadow mb-6 border-l-4 border-primary">
        <h1 class="text-2xl font-bold mb-2">{{ $ticket->subject }}</h1>
        <div class="text-sm text-gray-600 flex gap-6">
            <span>👤 <strong>Client :</strong> {{ $ticket->user->name }} ({{ $ticket->user->email }})</span>
            <span>📅 <strong>Date :</strong> {{ $ticket->created_at->format('d/m/Y H:i') }}</span>
        </div>
    </div>

    <div class="space-y-6 mb-8 bg-gray-50 p-6 rounded-lg border">
        @foreach($ticket->messages as $message)
            <div class="flex {{ $message->user->is_admin ? 'justify-end' : 'justify-start' }}">
                <div class="max-w-[80%] {{ $message->user->is_admin ? 'bg-purple-600 text-white' : 'bg-white border text-gray-800' }} rounded-2xl px-6 py-4 shadow-sm">
                    <div class="flex items-center gap-2 mb-2 border-b {{ $message->user->is_admin ? 'border-purple-400' : 'border-gray-100' }} pb-2">
                        <span class="font-bold text-sm">{{ $message->user->name }}</span>
                        <span class="text-xs {{ $message->user->is_admin ? 'text-purple-200' : 'text-gray-400' }}">{{ $message->created_at->format('d/m H:i') }}</span>
                        @if($message->user->is_admin) <span class="text-xs bg-white text-purple-600 px-1 rounded ml-2">STAFF</span> @endif
                    </div>
                    <div class="whitespace-pre-wrap">{{ $message->content }}</div>
                </div>
            </div>
        @endforeach
    </div>

    @if($ticket->status != 'ferme')
        <div class="bg-white shadow rounded-lg p-6">
            <h3 class="font-bold text-gray-700 mb-4">Répondre au client</h3>
            <form action="{{ route('admin.tickets.reply', $ticket->id) }}" method="POST">
                @csrf
                <textarea name="content" rows="4" class="w-full border-gray-300 rounded-lg focus:ring-primary focus:border-primary mb-4" placeholder="Bonjour, merci pour votre message..." required></textarea>
                <div class="text-right">
                    <button type="submit" class="bg-purple-600 hover:bg-purple-700 text-white font-bold py-2 px-6 rounded shadow transition">
                        Envoyer la réponse
                    </button>
                </div>
            </form>
        </div>
    @endif

</div>
@endsection