<x-app-layout>
    <x-slot name="header">Estudiantes</x-slot>

    <div class="card">
        <div class="card-title">Estudiantes Registrados</div>

        <table class="data-table">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Nombre</th>
                    <th>Correo</th>
                    <th>Acciones</th>
                </tr>
            </thead>
            <tbody>
                @forelse($estudiantes as $est)
                    <tr>
                        <td><span class="table-id">#{{ $est->id }}</span></td>
                        <td>{{ $est->name }}</td>
                        <td style="color:var(--muted);">{{ $est->email }}</td>
                        <td>
                            <a href="#" class="table-btn">Ver</a>
                            <a href="#" class="table-btn">Editar</a>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="4" style="color:var(--muted);">No se encontraron estudiantes.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

</x-app-layout>
