@extends('admin.layout')
@section('title', 'Tin nhắn liên hệ')
@section('greeting') TIN NHẮN <span>LIÊN HỆ</span> @endsection
@section('subtitle') Quản lý tin nhắn từ khách hàng @endsection

@section('content')
    <div class="card">
        <div class="card-header" style="display:flex;justify-content:space-between;align-items:center;">
            <h3><i class="fas fa-envelope" style="color:var(--accent);margin-right:8px;"></i>Tin nhắn ({{ $contacts->total() }})</h3>
            @if($unread > 0)
            <span class="badge badge-warning">{{ $unread }} chưa đọc</span>
            @endif
        </div>
        <div style="overflow-x:auto;">
            <table class="ad-table">
                <thead>
                    <tr>
                        <th style="width:40px;">#</th>
                        <th>Họ tên</th>
                        <th>Email</th>
                        <th>SĐT</th>
                        <th>Nội dung</th>
                        <th>Thời gian</th>
                        <th style="text-align:center;">Hành động</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($contacts as $c)
                    <tr style="{{ !$c->is_read ? 'background:#fffbeb;' : '' }}">
                        <td style="font-size:11px;color:var(--text-muted);">{{ $c->id }}</td>
                        <td style="font-weight:{{ $c->is_read ? '400' : '700' }};">
                            {{ $c->name }}
                            @if(!$c->is_read)
                            <span style="display:inline-block;width:6px;height:6px;background:#f59e0b;border-radius:50%;margin-left:4px;vertical-align:middle;"></span>
                            @endif
                        </td>
                        <td style="font-size:12px;">
                            <a href="mailto:{{ $c->email }}" style="color:var(--accent);">{{ $c->email }}</a>
                        </td>
                        <td style="font-size:12px;color:var(--text-muted);">{{ $c->phone ?? '—' }}</td>
                        <td style="font-size:12px;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" title="{{ $c->message }}">{{ $c->message }}</td>
                        <td style="font-size:11px;color:var(--text-muted);">{{ \Carbon\Carbon::parse($c->created_at)->format('d/m/Y H:i') }}</td>
                        <td style="text-align:center;">
                            <div style="display:flex;gap:4px;justify-content:center;">
                                @if(!$c->is_read)
                                <form method="POST" action="{{ route('admin.contacts.read', $c->id) }}">
                                    @csrf @method('PUT')
                                    <button type="submit" class="btn btn-sm btn-primary" title="Đánh dấu đã đọc"><i class="fas fa-check"></i></button>
                                </form>
                                @endif
                                <form method="POST" action="{{ route('admin.contacts.delete', $c->id) }}" onsubmit="return confirm('Xóa tin nhắn này?')">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-sm btn-danger" title="Xóa"><i class="fas fa-trash"></i></button>
                                </form>
                            </div>
                        </td>
                    </tr>
                    @empty
                    <tr><td colspan="7" style="text-align:center;color:var(--text-muted);padding:40px;">Chưa có tin nhắn nào.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

    @if($contacts->hasPages())
    <div style="margin-top:16px;">
        {{ $contacts->links('admin.pagination') }}
    </div>
    @endif
@endsection