@extends('layouts.admin')
@section('title', 'Chat')
@section('content')
<div class="flex justify-between items-center mb-6">
    <h1 class="text-2xl font-bold">Chat — {{ $session->customer_name ?: 'Anonymous' }}</h1>
    <form method="POST" action="{{ route('admin.chat.toggle-ai', $session) }}">@csrf
        <button class="border rounded-lg px-4 py-2 text-sm">{{ $session->ai_enabled ? 'Disable AI for this chat' : 'Re-enable AI' }}</button>
    </form>
</div>
<div class="bg-white rounded-xl shadow-sm p-4 space-y-2 h-96 overflow-y-auto mb-4">
    @foreach($session->messages as $m)
    <div class="{{ $m->sender === 'customer' ? 'text-left' : 'text-right' }}">
        <span class="inline-block px-3 py-2 rounded-xl text-sm {{ $m->sender === 'customer' ? 'bg-gray-100' : ($m->sender === 'ai' ? 'bg-blue-50' : 'bg-brand text-white') }}">{{ $m->message }}</span>
        <div class="text-xs text-gray-400">{{ $m->sender }}</div>
    </div>
    @endforeach
</div>
<form method="POST" action="{{ route('admin.chat.reply', $session) }}" class="flex gap-2">
    @csrf
    <input name="message" required placeholder="Type a reply..." class="flex-1 border rounded-lg px-3 py-2 text-sm">
    <button class="bg-brand text-white px-5 rounded-lg text-sm font-semibold">Send</button>
</form>
@endsection