@props(['user'])
@php
    $role = $user->roles->first()?->name ?? 'estudiante';
    $roleLabel = match($role) {
        'superadministrador' => 'Superadministrador',
        'administrador' => 'Administrador',
        'instructor' => 'Instructor',
        default => 'Estudiante',
    };
@endphp
<span {{ $attributes->class(['profile-avatar', 'user-avatar', 'user-avatar-'.$role]) }} role="img" aria-label="{{ $user->avatar_path ? 'Fotografía de '.$user->name : 'Perfil de '.$roleLabel }}">
    @if($user->avatar_path)
        <img src="{{ Storage::disk('public')->url($user->avatar_path) }}" alt="Fotografía de {{ $user->name }}">
    @else
        <svg class="user-avatar-portrait" viewBox="0 0 48 48" preserveAspectRatio="xMidYMid meet" aria-hidden="true">
            <circle class="avatar-vector-backdrop" cx="24" cy="24" r="23"/>
            <path class="avatar-vector-shadow" d="M7.2 43.8c1.1-9 7.3-14.2 16.8-14.2s15.7 5.2 16.8 14.2H7.2Z"/>
            <path class="avatar-vector-neck" d="M19.5 26.2h9v7.2h-9z"/>
            <circle class="avatar-vector-head" cx="24" cy="19" r="10.1"/>
            <path class="avatar-vector-hair" d="M14.2 18.1c.2-6.3 4.2-10.2 9.8-10.2 5.9 0 9.8 4.2 9.9 10.5-2.5-1.2-4.2-3-5.1-5.2-3.1 3-7.6 4.8-14.6 4.9Z"/>
            <path class="avatar-vector-ear" d="M14.2 19.4c-1.5 0-2.3 1-2 2.7.2 1.5 1.2 2.4 2.7 2.2M33.8 19.4c1.5 0 2.3 1 2 2.7-.2 1.5-1.2 2.4-2.7 2.2"/>
            <path class="avatar-vector-face" d="M20.2 19.7h.1M27.7 19.7h.1M21.1 24.1c1.8 1.3 4 1.3 5.8 0"/>
            <path class="avatar-vector-shirt" d="M7.2 43.8c1.1-9 7.3-14.2 16.8-14.2s15.7 5.2 16.8 14.2H7.2Z"/>
            <path class="avatar-vector-collar" d="m17.8 31 6.2 5.3 6.2-5.3"/>
        </svg>
    @endif
</span>