feat: adicionar sistema completo de gestão de cursos e turmas

- Adicionada interface Course em types.ts
- Criado CourseForm para cadastro/edição de turmas
- Implementada página CourseManagement com tabelas Excel-like
- Adicionadas funções CRUD de cursos no DataContext
- Integrado dropdown de cursos no EventForm baseado na instituição
- Adicionada rota 'courses' no App.tsx
- Link 'Gestão de Cursos' inserido no menu principal após 'Equipe & Fotógrafos'
- Removido 'Configurações' do menu principal (mantido apenas no dropdown do avatar)
- Implementado comportamento de toggle para seleção de universidades
- Sistema restrito a SUPERADMIN e BUSINESS_OWNER

backend/package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "backend",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}

frontend/App.tsx

@@ -7,6 +7,7 @@ import { Register } from "./pages/Register";
 import { TeamPage } from "./pages/Team";
 import { FinancePage } from "./pages/Finance";
 import { SettingsPage } from "./pages/Settings";
+import { CourseManagement } from "./pages/CourseManagement";
 import { InspirationPage } from "./pages/Inspiration";
 import { PrivacyPolicy } from "./pages/PrivacyPolicy";
 import { TermsOfUse } from "./pages/TermsOfUse";
@@ -62,6 +63,9 @@ const AppContent: React.FC = () => {
       case "settings":
         return <SettingsPage />;
 
+      case "courses":
+        return <CourseManagement />;
+
       default:
         return <Dashboard initialView="list" />;
     }

frontend/components/CourseForm.tsx

@@ -0,0 +1,205 @@
+import React, { useState } from 'react';
+import { Course, Institution } from '../types';
+import { Input, Select } from './Input';
+import { Button } from './Button';
+import { GraduationCap, X, Check, AlertCircle } from 'lucide-react';
+
+interface CourseFormProps {
+  onCancel: () => void;
+  onSubmit: (data: Partial<Course>) => void;
+  initialData?: Course;
+  userId: string;
+  institutions: Institution[];
+}
+
+const GRADUATION_TYPES = [
+  'Bacharelado',
+  'Licenciatura',
+  'Tecnológico',
+  'Especialização',
+  'Mestrado',
+  'Doutorado'
+];
+
+export const CourseForm: React.FC<CourseFormProps> = ({ 
+  onCancel, 
+  onSubmit, 
+  initialData,
+  userId,
+  institutions
+}) => {
+  const currentYear = new Date().getFullYear();
+  const [formData, setFormData] = useState<Partial<Course>>(initialData || {
+    name: '',
+    institutionId: '',
+    year: currentYear,
+    semester: 1,
+    graduationType: '',
+    createdAt: new Date().toISOString(),
+    createdBy: userId,
+    isActive: true,
+  });
+
+  const [showToast, setShowToast] = useState(false);
+  const [error, setError] = useState('');
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    
+    // Validações
+    if (!formData.name || formData.name.trim().length < 3) {
+      setError('Nome do curso deve ter pelo menos 3 caracteres');
+      return;
+    }
+    
+    if (!formData.institutionId) {
+      setError('Selecione uma universidade');
+      return;
+    }
+    
+    if (!formData.graduationType) {
+      setError('Selecione o tipo de graduação');
+      return;
+    }
+
+    setShowToast(true);
+    setTimeout(() => {
+      onSubmit(formData);
+    }, 1000);
+  };
+
+  const handleChange = (field: keyof Course, value: any) => {
+    setFormData(prev => ({ ...prev, [field]: value }));
+    setError(''); // Limpa erro ao editar
+  };
+
+  return (
+    <div className="bg-white rounded-lg shadow-xl overflow-hidden max-w-2xl mx-auto border border-gray-100 slide-up relative">
+      
+      {/* Success Toast */}
+      {showToast && (
+        <div className="absolute top-4 right-4 z-50 bg-brand-black text-white px-6 py-4 rounded shadow-2xl flex items-center space-x-3 fade-in">
+          <Check className="text-brand-gold h-6 w-6" />
+          <div>
+            <h4 className="font-bold text-sm">Sucesso!</h4>
+            <p className="text-xs text-gray-300">Curso cadastrado com sucesso.</p>
+          </div>
+        </div>
+      )}
+
+      {/* Form Header */}
+      <div className="bg-gray-50 border-b px-8 py-6 flex justify-between items-center">
+        <div className="flex items-center space-x-3">
+          <GraduationCap className="text-brand-gold h-8 w-8" />
+          <div>
+            <h2 className="text-2xl font-serif text-brand-black">
+              {initialData ? 'Editar Curso/Turma' : 'Cadastrar Curso/Turma'}
+            </h2>
+            <p className="text-sm text-gray-500 mt-1">
+              Registre as turmas disponíveis para eventos fotográficos
+            </p>
+          </div>
+        </div>
+        <button
+          onClick={onCancel}
+          className="p-2 hover:bg-gray-200 rounded-full transition-colors"
+        >
+          <X size={20} className="text-gray-600" />
+        </button>
+      </div>
+
+      <form onSubmit={handleSubmit} className="p-8 space-y-6">
+        
+        {/* Erro global */}
+        {error && (
+          <div className="bg-red-50 border border-red-200 rounded-lg p-3 flex items-start">
+            <AlertCircle size={18} className="text-red-500 mr-2 flex-shrink-0 mt-0.5" />
+            <p className="text-sm text-red-700">{error}</p>
+          </div>
+        )}
+
+        {/* Informações do Curso */}
+        <div className="space-y-4">
+          <h3 className="text-sm font-semibold text-gray-700 tracking-wide uppercase">
+            Informações do Curso
+          </h3>
+          
+          <Select
+            label="Universidade*"
+            options={institutions.map(inst => ({ 
+              value: inst.id, 
+              label: `${inst.name} - ${inst.type}` 
+            }))}
+            value={formData.institutionId || ''}
+            onChange={(e) => handleChange('institutionId', e.target.value)}
+            required
+          />
+
+          <Input
+            label="Nome do Curso/Turma*"
+            placeholder="Ex: Engenharia Civil 2025, Medicina - Turma A"
+            value={formData.name || ''}
+            onChange={(e) => handleChange('name', e.target.value)}
+            required
+          />
+
+          <div className="grid grid-cols-3 gap-4">
+            <Input
+              label="Ano*"
+              type="number"
+              placeholder={currentYear.toString()}
+              value={formData.year || currentYear}
+              onChange={(e) => handleChange('year', parseInt(e.target.value))}
+              min={currentYear - 1}
+              max={currentYear + 5}
+              required
+            />
+            
+            <Select
+              label="Semestre"
+              options={[
+                { value: '1', label: '1º Semestre' },
+                { value: '2', label: '2º Semestre' }
+              ]}
+              value={formData.semester?.toString() || '1'}
+              onChange={(e) => handleChange('semester', parseInt(e.target.value))}
+            />
+
+            <Select
+              label="Tipo*"
+              options={GRADUATION_TYPES.map(t => ({ value: t, label: t }))}
+              value={formData.graduationType || ''}
+              onChange={(e) => handleChange('graduationType', e.target.value)}
+              required
+            />
+          </div>
+
+          {/* Status Ativo/Inativo */}
+          <div className="flex items-center space-x-3 pt-2">
+            <input
+              type="checkbox"
+              id="isActive"
+              checked={formData.isActive !== false}
+              onChange={(e) => handleChange('isActive', e.target.checked)}
+              className="w-4 h-4 text-brand-gold border-gray-300 rounded focus:ring-brand-gold"
+            />
+            <label htmlFor="isActive" className="text-sm text-gray-700">
+              Curso ativo (disponível para seleção em eventos)
+            </label>
+          </div>
+        </div>
+
+
+        {/* Actions */}
+        <div className="flex justify-end space-x-3 pt-6 border-t">
+          <Button variant="outline" onClick={onCancel} type="button">
+            Cancelar
+          </Button>
+          <Button type="submit" variant="secondary">
+            {initialData ? 'Salvar Alterações' : 'Cadastrar Curso'}
+          </Button>
+        </div>
+      </form>
+    </div>
+  );
+};

frontend/components/EventForm.tsx

@@ -38,7 +38,12 @@ export const EventForm: React.FC<EventFormProps> = ({
   initialData,
 }) => {
   const { user } = useAuth();
-  const { institutions, getInstitutionsByUserId, addInstitution } = useData();
+  const { 
+    institutions, 
+    getInstitutionsByUserId, 
+    addInstitution,
+    getActiveCoursesByInstitutionId 
+  } = useData();
   const [activeTab, setActiveTab] = useState<
     "details" | "location" | "briefing" | "files"
   >("details");
@@ -48,6 +53,7 @@ export const EventForm: React.FC<EventFormProps> = ({
   const [isGeocoding, setIsGeocoding] = useState(false);
   const [showToast, setShowToast] = useState(false);
   const [showInstitutionForm, setShowInstitutionForm] = useState(false);
+  const [availableCourses, setAvailableCourses] = useState<any[]>([]);
 
   // Get institutions based on user role
   // Business owners and admins see all institutions, clients see only their own
@@ -84,7 +90,7 @@ export const EventForm: React.FC<EventFormProps> = ({
         "https://images.unsplash.com/photo-1511795409834-ef04bbd61622?ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80", // Default
       institutionId: "",
       attendees: "",
-      course: "",
+      courseId: "",
     }
   );
 
@@ -100,6 +106,20 @@ export const EventForm: React.FC<EventFormProps> = ({
       ? "Enviar Solicitação"
       : "Criar Evento";
 
+  // Carregar cursos disponíveis quando instituição for selecionada
+  useEffect(() => {
+    if (formData.institutionId) {
+      const courses = getActiveCoursesByInstitutionId(formData.institutionId);
+      setAvailableCourses(courses);
+    } else {
+      setAvailableCourses([]);
+      // Limpa o curso selecionado se a instituição mudar
+      if (formData.courseId) {
+        setFormData((prev: any) => ({ ...prev, courseId: "" }));
+      }
+    }
+  }, [formData.institutionId, getActiveCoursesByInstitutionId]);
+
   // Address Autocomplete Logic using Mapbox
   useEffect(() => {
     const timer = setTimeout(async () => {
@@ -414,15 +434,6 @@ export const EventForm: React.FC<EventFormProps> = ({
                   }
                 />
 
-                <Input
-                  label="Curso"
-                  placeholder="Ex: Engenharia Civil, Medicina, Direito"
-                  value={formData.course}
-                  onChange={(e) =>
-                    setFormData({ ...formData, course: e.target.value })
-                  }
-                />
-
                 <Input
                   label="Número de Pessoas"
                   placeholder="Ex: 150"
@@ -514,6 +525,52 @@ export const EventForm: React.FC<EventFormProps> = ({
                   )}
                 </div>
 
+                {/* Course Selection - Condicional baseado na instituição */}
+                {formData.institutionId && (
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700 mb-1 tracking-wide uppercase text-xs">
+                      Curso/Turma
+                    </label>
+
+                    {availableCourses.length === 0 ? (
+                      <div className="border-2 border-dashed border-gray-300 bg-gray-50 rounded-sm p-4">
+                        <div className="flex items-start space-x-3">
+                          <AlertCircle
+                            className="text-gray-400 flex-shrink-0 mt-0.5"
+                            size={20}
+                          />
+                          <div className="flex-1">
+                            <p className="text-sm font-medium text-gray-700 mb-1">
+                              Nenhum curso cadastrado
+                            </p>
+                            <p className="text-xs text-gray-500">
+                              Entre em contato com a administração para cadastrar os cursos/turmas disponíveis nesta universidade.
+                            </p>
+                          </div>
+                        </div>
+                      </div>
+                    ) : (
+                      <select
+                        className="w-full px-4 py-2 border border-gray-300 rounded-sm focus:outline-none focus:ring-1 focus:ring-brand-gold focus:border-brand-gold transition-colors"
+                        value={formData.courseId}
+                        onChange={(e) =>
+                          setFormData({
+                            ...formData,
+                            courseId: e.target.value,
+                          })
+                        }
+                      >
+                        <option value="">Selecione um curso (opcional)</option>
+                        {availableCourses.map((course) => (
+                          <option key={course.id} value={course.id}>
+                            {course.name} - {course.graduationType} ({course.year}/{course.semester}º sem)
+                          </option>
+                        ))}
+                      </select>
+                    )}
+                  </div>
+                )}
+
                 {/* Cover Image Upload */}
                 <div>
                   <label className="block text-sm font-medium text-gray-700 mb-1 tracking-wide uppercase text-xs">

frontend/components/Navbar.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react";
 import { UserRole } from "../types";
 import { useAuth } from "../contexts/AuthContext";
-import { Menu, X, LogOut, User, Settings, Camera, Mail, Phone } from "lucide-react";
+import { Menu, X, LogOut, User, Settings, Camera, Mail, Phone, GraduationCap } from "lucide-react";
 import { Button } from "./Button";
 
 interface NavbarProps {
@@ -52,8 +52,8 @@ export const Navbar: React.FC<NavbarProps> = ({ onNavigate, currentPage }) => {
         return [
           { name: "Gestão de Eventos", path: "dashboard" },
           { name: "Equipe & Fotógrafos", path: "team" },
+          { name: "Gestão de Cursos", path: "courses" },
           { name: "Financeiro", path: "finance" },
-          { name: "Configurações", path: "settings" },
         ];
       case UserRole.EVENT_OWNER:
         return [

frontend/contexts/DataContext.tsx

@@ -1,5 +1,5 @@
 import React, { createContext, useContext, useState, ReactNode } from "react";
-import { EventData, EventStatus, EventType, Institution } from "../types";
+import { EventData, EventStatus, EventType, Institution, Course } from "../types";
 
 // Initial Mock Data
 const INITIAL_INSTITUTIONS: Institution[] = [
@@ -526,9 +526,47 @@ const INITIAL_EVENTS: EventData[] = [
   },
 ];
 
+// Initial Mock Courses
+const INITIAL_COURSES: Course[] = [
+  {
+    id: "course-1",
+    name: "Engenharia Civil 2025",
+    institutionId: "inst-1",
+    year: 2025,
+    semester: 2,
+    graduationType: "Bacharelado",
+    createdAt: new Date().toISOString(),
+    createdBy: "admin-1",
+    isActive: true,
+  },
+  {
+    id: "course-2",
+    name: "Medicina - Turma A 2025",
+    institutionId: "inst-1",
+    year: 2025,
+    semester: 1,
+    graduationType: "Bacharelado",
+    createdAt: new Date().toISOString(),
+    createdBy: "admin-1",
+    isActive: true,
+  },
+  {
+    id: "course-3",
+    name: "Direito Noturno 2025",
+    institutionId: "inst-1",
+    year: 2025,
+    semester: 2,
+    graduationType: "Bacharelado",
+    createdAt: new Date().toISOString(),
+    createdBy: "admin-1",
+    isActive: true,
+  },
+];
+
 interface DataContextType {
   events: EventData[];
   institutions: Institution[];
+  courses: Course[];
   addEvent: (event: EventData) => void;
   updateEventStatus: (id: string, status: EventStatus) => void;
   assignPhotographer: (eventId: string, photographerId: string) => void;
@@ -537,6 +575,11 @@ interface DataContextType {
   updateInstitution: (id: string, institution: Partial<Institution>) => void;
   getInstitutionsByUserId: (userId: string) => Institution[];
   getInstitutionById: (id: string) => Institution | undefined;
+  addCourse: (course: Course) => void;
+  updateCourse: (id: string, course: Partial<Course>) => void;
+  getCoursesByInstitutionId: (institutionId: string) => Course[];
+  getActiveCoursesByInstitutionId: (institutionId: string) => Course[];
+  getCourseById: (id: string) => Course | undefined;
 }
 
 const DataContext = createContext<DataContextType | undefined>(undefined);
@@ -547,6 +590,7 @@ export const DataProvider: React.FC<{ children: ReactNode }> = ({
   const [events, setEvents] = useState<EventData[]>(INITIAL_EVENTS);
   const [institutions, setInstitutions] =
     useState<Institution[]>(INITIAL_INSTITUTIONS);
+  const [courses, setCourses] = useState<Course[]>(INITIAL_COURSES);
 
   const addEvent = (event: EventData) => {
     setEvents((prev) => [event, ...prev]);
@@ -601,11 +645,36 @@ export const DataProvider: React.FC<{ children: ReactNode }> = ({
     return institutions.find((inst) => inst.id === id);
   };
 
+  const addCourse = (course: Course) => {
+    setCourses((prev) => [...prev, course]);
+  };
+
+  const updateCourse = (id: string, updatedData: Partial<Course>) => {
+    setCourses((prev) =>
+      prev.map((course) => (course.id === id ? { ...course, ...updatedData } : course))
+    );
+  };
+
+  const getCoursesByInstitutionId = (institutionId: string) => {
+    return courses.filter((course) => course.institutionId === institutionId);
+  };
+
+  const getActiveCoursesByInstitutionId = (institutionId: string) => {
+    return courses.filter(
+      (course) => course.institutionId === institutionId && course.isActive
+    );
+  };
+
+  const getCourseById = (id: string) => {
+    return courses.find((course) => course.id === id);
+  };
+
   return (
     <DataContext.Provider
       value={{
         events,
         institutions,
+        courses,
         addEvent,
         updateEventStatus,
         assignPhotographer,
@@ -614,6 +683,11 @@ export const DataProvider: React.FC<{ children: ReactNode }> = ({
         updateInstitution,
         getInstitutionsByUserId,
         getInstitutionById,
+        addCourse,
+        updateCourse,
+        getCoursesByInstitutionId,
+        getActiveCoursesByInstitutionId,
+        getCourseById,
       }}
     >
       {children}

frontend/pages/CourseManagement.tsx

@@ -0,0 +1,329 @@
+import React, { useState } from 'react';
+import { useData } from '../contexts/DataContext';
+import { useAuth } from '../contexts/AuthContext';
+import { UserRole, Course } from '../types';
+import { CourseForm } from '../components/CourseForm';
+import { GraduationCap, Plus, Building2, ChevronRight, Edit, Trash2, CheckCircle, XCircle } from 'lucide-react';
+import { Button } from '../components/Button';
+
+export const CourseManagement: React.FC = () => {
+  const { user } = useAuth();
+  const { 
+    institutions, 
+    courses, 
+    addCourse, 
+    updateCourse,
+    getCoursesByInstitutionId 
+  } = useData();
+  
+  const [selectedInstitution, setSelectedInstitution] = useState<string | null>(null);
+  const [showCourseForm, setShowCourseForm] = useState(false);
+  const [editingCourse, setEditingCourse] = useState<Course | undefined>(undefined);
+
+  // Verificar se é admin
+  const isAdmin = user?.role === UserRole.SUPERADMIN || user?.role === UserRole.BUSINESS_OWNER;
+
+  if (!isAdmin) {
+    return (
+      <div className="min-h-screen bg-gray-50 pt-32 pb-12">
+        <div className="max-w-7xl mx-auto px-4 text-center">
+          <h1 className="text-2xl font-bold text-red-600">Acesso Negado</h1>
+          <p className="text-gray-600 mt-2">Apenas administradores podem acessar esta página.</p>
+        </div>
+      </div>
+    );
+  }
+
+  const selectedInstitutionData = institutions.find(inst => inst.id === selectedInstitution);
+  const institutionCourses = selectedInstitution ? getCoursesByInstitutionId(selectedInstitution) : [];
+
+  const handleAddCourse = () => {
+    setEditingCourse(undefined);
+    setShowCourseForm(true);
+  };
+
+  const handleEditCourse = (course: Course) => {
+    setEditingCourse(course);
+    setShowCourseForm(true);
+  };
+
+  const handleSubmitCourse = (courseData: Partial<Course>) => {
+    if (editingCourse) {
+      updateCourse(editingCourse.id, courseData);
+    } else {
+      const newCourse: Course = {
+        id: `course-${Date.now()}`,
+        name: courseData.name!,
+        institutionId: selectedInstitution || courseData.institutionId!,
+        year: courseData.year!,
+        semester: courseData.semester,
+        graduationType: courseData.graduationType!,
+        createdAt: new Date().toISOString(),
+        createdBy: user?.id || '',
+        isActive: courseData.isActive !== false,
+      };
+      addCourse(newCourse);
+    }
+    setShowCourseForm(false);
+    setEditingCourse(undefined);
+  };
+
+  const handleToggleActive = (course: Course) => {
+    updateCourse(course.id, { isActive: !course.isActive });
+  };
+
+  return (
+    <div className="min-h-screen bg-gray-50 pt-20 sm:pt-24 md:pt-28 lg:pt-32 pb-8 sm:pb-12">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        {/* Header */}
+        <div className="mb-6 sm:mb-8">
+          <div className="flex items-center space-x-3 mb-2">
+            <h1 className="text-2xl sm:text-3xl font-serif font-bold text-brand-black">
+              Gestão de Cursos e Turmas
+            </h1>
+          </div>
+          <p className="text-sm sm:text-base text-gray-600">
+            Cadastre e gerencie os cursos/turmas disponíveis em cada universidade
+          </p>
+        </div>
+
+        {/* Course Form Modal */}
+        {showCourseForm && (
+          <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4 overflow-y-auto">
+            <CourseForm
+              onCancel={() => {
+                setShowCourseForm(false);
+                setEditingCourse(undefined);
+              }}
+              onSubmit={handleSubmitCourse}
+              initialData={editingCourse}
+              userId={user?.id || ''}
+              institutions={institutions}
+            />
+          </div>
+        )}
+
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+          {/* Left Panel - Institutions Table */}
+          <div className="bg-white rounded-lg shadow border border-gray-200">
+            <div className="px-6 py-4 border-b border-gray-200 bg-gray-50">
+              <div className="flex items-center justify-between">
+                <div className="flex items-center space-x-2">
+                  <Building2 className="text-brand-gold h-5 w-5" />
+                  <h2 className="text-lg font-semibold text-gray-900">
+                    Universidades Cadastradas
+                  </h2>
+                </div>
+                <span className="text-sm text-gray-500 bg-gray-100 px-3 py-1 rounded-full">
+                  {institutions.length} {institutions.length === 1 ? 'instituição' : 'instituições'}
+                </span>
+              </div>
+            </div>
+
+            <div className="overflow-x-auto">
+              <table className="w-full">
+                <thead className="bg-gray-50 border-b border-gray-200">
+                  <tr>
+                    <th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                      Universidade
+                    </th>
+                    <th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                      Tipo
+                    </th>
+                    <th className="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">
+                      Cursos
+                    </th>
+                    <th className="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">
+                      Ação
+                    </th>
+                  </tr>
+                </thead>
+                <tbody className="divide-y divide-gray-200">
+                  {institutions.length === 0 ? (
+                    <tr>
+                      <td colSpan={4} className="px-4 py-8 text-center text-gray-500">
+                        Nenhuma universidade cadastrada
+                      </td>
+                    </tr>
+                  ) : (
+                    institutions.map((institution) => {
+                      const coursesCount = getCoursesByInstitutionId(institution.id).length;
+                      const isSelected = selectedInstitution === institution.id;
+
+                      return (
+                        <tr
+                          key={institution.id}
+                          className={`hover:bg-gray-50 transition-colors cursor-pointer ${
+                            isSelected ? 'bg-blue-50 border-l-4 border-brand-gold' : ''
+                          }`}
+                          onClick={() => setSelectedInstitution(isSelected ? null : institution.id)}
+                        >
+                          <td className="px-4 py-4">
+                            <div className="text-sm font-medium text-gray-900">
+                              {institution.name}
+                            </div>
+                            <div className="text-xs text-gray-500 mt-0.5">
+                              {institution.address?.city}, {institution.address?.state}
+                            </div>
+                          </td>
+                          <td className="px-4 py-4">
+                            <span className="text-xs font-medium text-gray-600 bg-gray-100 px-2 py-1 rounded">
+                              {institution.type}
+                            </span>
+                          </td>
+                          <td className="px-4 py-4 text-center">
+                            <span className={`inline-flex items-center justify-center w-8 h-8 rounded-full text-sm font-semibold ${
+                              coursesCount > 0 
+                                ? 'bg-green-100 text-green-700' 
+                                : 'bg-gray-100 text-gray-500'
+                            }`}>
+                              {coursesCount}
+                            </span>
+                          </td>
+                          <td className="px-4 py-4 text-center">
+                            <ChevronRight 
+                              className={`inline-block transition-transform ${
+                                isSelected ? 'rotate-90 text-brand-gold' : 'text-gray-400'
+                              }`} 
+                              size={20} 
+                            />
+                          </td>
+                        </tr>
+                      );
+                    })
+                  )}
+                </tbody>
+              </table>
+            </div>
+          </div>
+
+          {/* Right Panel - Courses Table */}
+          <div className="bg-white rounded-lg shadow border border-gray-200">
+            <div className="px-6 py-4 border-b border-gray-200 bg-gray-50">
+              <div className="flex items-center justify-between">
+                <div>
+                  <h2 className="text-lg font-semibold text-gray-900">
+                    {selectedInstitutionData ? (
+                      <>Cursos - {selectedInstitutionData.name}</>
+                    ) : (
+                      <>Cursos da Universidade</>
+                    )}
+                  </h2>
+                  {selectedInstitutionData && (
+                    <p className="text-xs text-gray-500 mt-1">
+                      {institutionCourses.length} {institutionCourses.length === 1 ? 'curso cadastrado' : 'cursos cadastrados'}
+                    </p>
+                  )}
+                </div>
+                {selectedInstitution && (
+                  <Button
+                    onClick={handleAddCourse}
+                    variant="secondary"
+                    className="flex items-center space-x-2"
+                  >
+                    <Plus size={16} />
+                    <span>Cadastrar Turma</span>
+                  </Button>
+                )}
+              </div>
+            </div>
+
+            <div className="overflow-x-auto">
+              {!selectedInstitution ? (
+                <div className="px-6 py-12 text-center">
+                  <Building2 className="mx-auto h-12 w-12 text-gray-300 mb-3" />
+                  <p className="text-gray-500 text-sm">
+                    Selecione uma universidade para ver seus cursos
+                  </p>
+                </div>
+              ) : institutionCourses.length === 0 ? (
+                <div className="px-6 py-12 text-center">
+                  <GraduationCap className="mx-auto h-12 w-12 text-gray-300 mb-3" />
+                  <p className="text-gray-500 text-sm mb-4">
+                    Nenhum curso cadastrado nesta universidade
+                  </p>
+                  <Button onClick={handleAddCourse} variant="secondary">
+                    <Plus size={16} className="mr-2" />
+                    Cadastrar Primeiro Curso
+                  </Button>
+                </div>
+              ) : (
+                <table className="w-full">
+                  <thead className="bg-gray-50 border-b border-gray-200">
+                    <tr>
+                      <th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        Curso/Turma
+                      </th>
+                      <th className="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        Tipo
+                      </th>
+                      <th className="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        Período
+                      </th>
+                      <th className="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        Status
+                      </th>
+                      <th className="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        Ações
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody className="divide-y divide-gray-200">
+                    {institutionCourses.map((course) => (
+                      <tr key={course.id} className="hover:bg-gray-50">
+                        <td className="px-4 py-4">
+                          <div className="text-sm font-medium text-gray-900">
+                            {course.name}
+                          </div>
+                        </td>
+                        <td className="px-4 py-4">
+                          <span className="text-xs font-medium text-gray-600 bg-gray-100 px-2 py-1 rounded">
+                            {course.graduationType}
+                          </span>
+                        </td>
+                        <td className="px-4 py-4 text-center">
+                          <span className="text-xs text-gray-600">
+                            {course.year}/{course.semester}º
+                          </span>
+                        </td>
+                        <td className="px-4 py-4 text-center">
+                          <button
+                            onClick={() => handleToggleActive(course)}
+                            className="inline-flex items-center space-x-1"
+                          >
+                            {course.isActive ? (
+                              <>
+                                <CheckCircle size={16} className="text-green-500" />
+                                <span className="text-xs text-green-700 font-medium">Ativo</span>
+                              </>
+                            ) : (
+                              <>
+                                <XCircle size={16} className="text-gray-400" />
+                                <span className="text-xs text-gray-500 font-medium">Inativo</span>
+                              </>
+                            )}
+                          </button>
+                        </td>
+                        <td className="px-4 py-4">
+                          <div className="flex items-center justify-center space-x-2">
+                            <button
+                              onClick={() => handleEditCourse(course)}
+                              className="p-1.5 text-blue-600 hover:bg-blue-50 rounded transition-colors"
+                              title="Editar curso"
+                            >
+                              <Edit size={16} />
+                            </button>
+                          </div>
+                        </td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};

frontend/pages/Settings.tsx

@@ -1,9 +1,13 @@
 import React, { useState } from 'react';
-import { User, Mail, Phone, MapPin, Lock, Bell, Palette, Globe, Save, Camera } from 'lucide-react';
+import { User, Mail, Phone, MapPin, Lock, Bell, Palette, Globe, Save, Camera, GraduationCap } from 'lucide-react';
 import { Button } from '../components/Button';
+import { useAuth } from '../contexts/AuthContext';
+import { UserRole } from '../types';
 
 export const SettingsPage: React.FC = () => {
-    const [activeTab, setActiveTab] = useState<'profile' | 'account' | 'notifications' | 'appearance'>('profile');
+    const { user } = useAuth();
+    const isAdmin = user?.role === UserRole.SUPERADMIN || user?.role === UserRole.BUSINESS_OWNER;
+    const [activeTab, setActiveTab] = useState<'profile' | 'account' | 'notifications' | 'appearance' | 'courses'>('profile');
     const [profileData, setProfileData] = useState({
         name: 'João Silva',
         email: 'joao.silva@photum.com',

frontend/types.ts

@@ -47,6 +47,18 @@ export interface Institution {
   ownerId: string; // ID do usuário que criou a instituição
 }
 
+export interface Course {
+  id: string;
+  name: string; // Ex: "Engenharia Civil 2025", "Medicina - Turma A"
+  institutionId: string; // ID da instituição vinculada
+  year: number; // Ano da turma
+  semester?: number; // Semestre (opcional)
+  graduationType: string; // Ex: "Bacharelado", "Licenciatura", "Tecnológico"
+  createdAt: string;
+  createdBy: string; // ID do admin que cadastrou
+  isActive: boolean; // Permite desativar turmas antigas
+}
+
 export interface Address {
   street: string;
   number: string;
@@ -91,5 +103,5 @@ export interface EventData {
   photographerIds: string[]; // IDs dos fotógrafos designados
   institutionId?: string; // ID da instituição vinculada (obrigatório)
   attendees?: number; // Número de pessoas participantes
-  course?: string; // Curso relacionado ao evento
+  courseId?: string; // ID do curso/turma relacionado ao evento
 }