Update RoleSwitcher.vue to reflect role terminology changes

- Changed user role type from 'individual' to 'private' to align with project terminology.

app/components/navigation/RoleSwitcher.vue

@@ -12,7 +12,7 @@ import {
 import { Button } from '@/components/ui/button'
 
 // User role types matching our database schema
-type UserRole = 'individual' | 'educator' | 'company'
+type UserRole = 'private' | 'educator' | 'company'
 
 interface RoleOption {
   value: UserRole
@@ -26,7 +26,7 @@ interface RoleOption {
 
 const roles: RoleOption[] = [
   {
-    value: 'individual',
+    value: 'private',
     label: 'Privatperson',
     description: 'Private Nutzung',
     icon: User,
@@ -54,7 +54,7 @@ const roles: RoleOption[] = [
 ]
 
 // Current role - will come from user session later
-const currentRole = ref<UserRole>('individual')
+const currentRole = ref<UserRole>('private')
 
 const currentRoleData = computed(() => {
   return roles.find((r) => r.value === currentRole.value) || roles[0]
@@ -100,8 +100,9 @@ function switchRole(role: UserRole) {
 
         <div class="flex-1 flex flex-col gap-1">
           <span class="text-sm font-semibold">{{ role.label }}</span>
-          <span class="text-sm text-muted-foreground group-hover:text-foreground group-data-[highlighted]:text-accent-foreground transition-colors">{{
+          <span
-            role.description }}</span>
+            class="text-sm text-muted-foreground group-hover:text-foreground group-data-[highlighted]:text-accent-foreground transition-colors">{{
+              role.description }}</span>
         </div>
 
         <!-- High-contrast checkmark for colorblind accessibility -->