Voy a crear el Dashboard Multirrol para el Sistema de Alerta Temprana Escolar. Primero déjame revisar los componentes disponibles y luego construir la aplicación completa.

Ahora voy a instalar recharts para los gráficos y luego crear el dashboard completo.

Ahora voy a actualizar los estilos del sistema y crear el dashboard completo:

Ahora voy a crear el dashboard principal completo:

He creado el Dashboard Multirrol para el Sistema Inteligente de Alerta Temprana Escolar (SATE) completo con todas las funcionalidades solicitadas:

Características implementadas:

1. Header con Switcher de Roles - Permite cambiar dinámicamente entre DECE, Tutor y Representante con indicadores visuales de color.
2. Sidebar Colapsable - Navegación lateral con iconos de Lucide React (Inicio, Estudiantes, Reportes, Configuración) que se oculta en mobile.

3. Vista DECE (Psicólogo):

   • KPIs globales con tarjetas de Total Estudiantes, Alertas Críticas (rojo) y En Proceso (amarillo)
   • Tabla completa de estudiantes con semaforización visual
   • Modal "Perfil 360" con gráfico de radar de rendimiento por materia, gráfico de barras de asistencia y timeline de reportes conductuales
   • Panel de Asistente IA RAG con historial de chat simulado, badges de confianza (98%) y botón "Ver fuente (Art. LOEI)"

4. Vista Tutor:

   • KPIs filtrados solo por su paralelo (3ero BGU A)
   • Botón prominente "Redactar Reporte" que abre un modal con formulario completo
   • Tabla con botón "Escalar al DECE" para estudiantes en riesgo
   • Chat rápido simplificado con sugerencias predefinidas

5. Vista Representante (Mobile-First):

   • Selector de hijo si tiene más de uno
   • Tarjeta gigante de estado con semáforo visual (sin términos alarmistas)
   • Recomendaciones IA en formato de tarjetas amigables
   • Buzón de novedades/citaciones
   • Sin acceso al chatbot RAG ni tablas complejas

El diseño usa colores institucionales (azules oscuros, grises neutros) con acentos de color para los estados de riesgo, es totalmente responsivo y accesible.