<div
    class="skeleton-list-item animate-pulse flex items-center gap-4 p-4 bg-menu-background rounded-xl border border-input-border basis-full"
    aria-hidden="true"
>
    <!-- Avatar placeholder -->
    <div class="h-28 w-28 bg-menu-item-background-focus rounded-xl shrink-0"></div>

    <!-- Text placeholders -->
    <div class="basis-full shrink-0 space-y-2">
        <div class="h-4 bg-menu-item-background-focus rounded w-1/3"></div>
        <div class="h-4 bg-menu-item-background-focus rounded w-1/5"></div>
        <div class="h-4 bg-menu-item-background-focus rounded w-2/3"></div>
        <div class="h-4 bg-menu-item-background-focus rounded w-1/2"></div>

    </div>
</div>
