<?php
 
 
?>

<?php if (empty($messages)): ?>
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-12 text-center">
    <svg class="w-12 h-12 mx-auto text-gray-300 mb-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
        <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"/>
    </svg>
    <p class="text-gray-500 text-sm">No messages yet.</p>
</div>
<?php else: ?>

<div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">
    <div class="overflow-x-auto">
    <table class="w-full">
        <thead>
            <tr class="bg-gray-50 border-b border-gray-200">
                <th class="px-4 py-3 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider w-8"></th>
                <th class="px-4 py-3 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">From</th>
                <th class="px-4 py-3 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">Subject</th>
                <th class="px-4 py-3 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider hidden sm:table-cell">Date</th>
                <th class="px-4 py-3 text-right text-xs font-semibold text-gray-600 uppercase tracking-wider">Actions</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-100">
            <?php foreach ($messages as $msg): ?>
            <tr class="hover:bg-gray-50 transition-colors <?= !$msg['is_read'] ? 'bg-blue-50/40' : '' ?>">
                <td class="px-4 py-3">
                    <?php if (!$msg['is_read']): ?>
                    <span class="inline-block w-2.5 h-2.5 rounded-full bg-blue-500" title="Unread"></span>
                    <?php endif; ?>
                </td>
                <td class="px-4 py-3">
                    <div class="text-sm <?= !$msg['is_read'] ? 'font-semibold text-gray-900' : 'text-gray-700' ?>"><?= htmlspecialchars($msg['name']) ?></div>
                    <div class="text-xs text-gray-500"><?= htmlspecialchars($msg['email']) ?></div>
                </td>
                <td class="px-4 py-3">
                    <a href="/admin/messages/<?= (int)$msg['id'] ?>" class="text-sm <?= !$msg['is_read'] ? 'font-semibold text-gray-900' : 'text-gray-700' ?> hover:text-blue-600 transition-colors">
                        <?= htmlspecialchars($msg['subject']) ?>
                    </a>
                    <div class="text-xs text-gray-400 mt-0.5 line-clamp-1"><?= htmlspecialchars(mb_substr($msg['message'], 0, 80)) ?><?= mb_strlen($msg['message']) > 80 ? '...' : '' ?></div>
                </td>
                <td class="px-4 py-3 text-xs text-gray-500 hidden sm:table-cell whitespace-nowrap">
                    <?= date('M j, Y g:ia', strtotime($msg['created_at'])) ?>
                </td>
                <td class="px-4 py-3 text-right">
                    <div class="flex items-center justify-end gap-2">
                        <a href="/admin/messages/<?= (int)$msg['id'] ?>" class="text-gray-400 hover:text-blue-600 transition-colors" title="View">
                            <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
                        </a>
                        <form method="POST" action="/admin/messages/<?= (int)$msg['id'] ?>/delete" class="inline" onsubmit="return confirm('Delete this message?')">
                            <?= Router::csrfField() ?>
                            <button type="submit" class="text-gray-400 hover:text-red-600 transition-colors" title="Delete">
                                <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-2 14H7L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/><path d="M9 6V4a1 1 0 011-1h4a1 1 0 011 1v2"/></svg>
                            </button>
                        </form>
                    </div>
                </td>
            </tr>
            <?php endforeach; ?>
        </tbody>
    </table>
    </div>
</div>

<?php require APP_ROOT . '/templates/admin/_admin_pagination.php'; ?>

<?php endif; ?>
