@props([
    'label' => '',
    'value' => '',
    'icon' => null,
    'afterValue' => null,
    'valueColors' => 'text-gray-900 dark:text-white',
])
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
    <div class="flex items-start justify-between">
        <div>
            <p class="text-sm font-medium text-gray-600 dark:text-gray-400">{{ $label }}</p>
            <p class="mt-2 text-3xl font-semibold {{ $valueColors }}">
                {{ $value }}
            </p>
            @isset($afterValue)
                {{ $afterValue }}
            @endisset
        </div>
        @isset($icon)
            {{ $icon }}
        @endisset
    </div>
</div>