@extends('dashboard')

@section('dashboard_content')
<style>
    .message-link.read {
        color: rgb(15, 14, 14);
        font-weight: normal;
    }

    .message-link.unread {
        color: #339af0; /* light blue */
        font-weight: bold;
    }
</style>

<div class="container">
    <h2 class="mb-4">Contact Messages</h2>

    @if(session('success'))
        <div class="alert alert-success">{{ session('success') }}</div>
    @endif

    <table class="table table-bordered table-striped">
        <thead>
            <tr>
                <th>#</th>
                <th>Name</th>
                <th>Subject</th>
                <th>Submitted At</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            @forelse($messages as $index => $msg)
                <tr>
                    <td>{{ $messages->firstItem() + $index }}</td>
                      <td>
                        <a href="{{ route('messages.show', $msg->id) }}"
                           class="message-link {{ $msg->is_read ? 'read' : 'unread' }}">
                            {{ $msg->name }}
                        </a>
                    </td>

                    <td>{{ $msg->subject ?? 'N/A' }}</td>
                    <td>{{ $msg->created_at->format('d M Y H:i') }}</td>
                     <td>
                <!-- Delete Form -->
                <form action="{{ route('messages.destroy', $msg->id) }}" method="POST" onsubmit="return confirm('Are you sure you want to delete this message?');">
                    @csrf
                    @method('DELETE')
                    <button type="submit"class="ri-delete-bin-5-line"></button>

                </form>
            </td>
                </tr>
            @empty
                <tr>
                    <td colspan="6" class="text-center">No messages found.</td>
                </tr>
            @endforelse
        </tbody>
    </table>

<div class="d-flex justify-content-end mt-3">
    <a href="{{ $messages->previousPageUrl() }}"
       class="btn btn-light border border-gray px-3 {{ $messages->onFirstPage() ? 'disabled' : '' }}">
        Previous
    </a>
    <a href="{{ $messages->nextPageUrl() }}"
       class="btn btn-light border border-gray px-3 {{ $messages->hasMorePages() ? '' : 'disabled' }}">
        Next
    </a>
</div>



</div>
@endsection