@props(['title' => '', 'subtitle' => '', 'icon' => '', 'color' => 'primary', 'value' => '', 'class' => ''])

<div class="card {{ $class }}">
    <div class="card-body">
        <div class="d-flex align-items-center">
            @if($icon)
                <div class="flex-shrink-0">
                    <i class="{{ $icon }} fa-2x text-{{ $color }}"></i>
                </div>
            @endif
            <div class="flex-grow-1 ms-3">
                @if($title)
                    <h6 class="card-title mb-1">{{ $title }}</h6>
                @endif
                @if($subtitle)
                    <p class="card-text text-muted mb-0">{{ $subtitle }}</p>
                @endif
                @if($value)
                    <h4 class="mb-0 text-{{ $color }}">{{ $value }}</h4>
                @endif
            </div>
        </div>
    </div>
</div>