@using Microsoft.AspNetCore.Components

<div class="h-full flex flex-col bg-white dark:bg-gray-800 border-l border-gray-200 dark:border-gray-700">
    <!-- Header Skeleton -->
    <div class="p-4 border-b border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700">
        <div class="flex items-center justify-between mb-2">
            <SkeletonBase Height="24" AdditionalClasses="w-3/4">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
            <SkeletonBase Height="20" AdditionalClasses="w-5">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
        </div>
        <div class="space-y-2">
            <SkeletonBase Height="16" AdditionalClasses="w-1/2">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
            <SkeletonBase Height="16" AdditionalClasses="w-1/3">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
            <SkeletonBase Height="16" AdditionalClasses="w-1/4">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
            <SkeletonBase Height="16" AdditionalClasses="w-1/3">
                <div class="w-full h-full bg-gray-300 dark:bg-gray-600 rounded"></div>
            </SkeletonBase>
        </div>
    </div>

    <!-- Content Skeleton -->
    <div class="flex-1 overflow-y-auto p-4">
        <div class="space-y-4">

        </div>
    </div>
</div>