Skeleton Avatar Content

                    <div class="flex w-full max-w-md mx-auto p-4">
  <div class="flex w-full flex-col gap-4">
    <!-- User with Avatar Skeleton Layout -->
    <div class="flex items-center gap-4">
      <!-- Avatar Circle Skeleton -->
      <div class="skeleton h-16 w-16 shrink-0 rounded-full bg-gray-200 animate-pulse"></div>
      <div class="flex flex-col gap-4">
        <!-- Username Skeleton -->
        <div class="skeleton h-4 w-20 bg-gray-200 animate-pulse rounded"></div>
        <!-- User Status Skeleton -->
        <div class="skeleton h-4 w-28 bg-gray-200 animate-pulse rounded"></div>
      </div>
    </div>
    <!-- Content Area Skeleton -->
    <div class="skeleton h-32 w-full bg-gray-200 animate-pulse rounded"></div>
  </div>
</div>