@props(['color' => 'primary', 'header' => false, 'title' => null, 'icon' => null])

<div {{ $attributes->merge(['class' => "card shadow-sm border-0"]) }} style="border-radius: 15px; overflow: hidden;">
    
    {{-- Header --}}
    @if($header || $title)
        <div class="card-header bg-white border-0 pt-4 px-4 d-flex align-items-center justify-content-between">
            @if($title)
                <h4 class="font-weight-bold text-dark mb-0">
                    @if($icon) <i class="{{ $icon }} mr-2 text-{{ $color }}"></i> @endif
                    {{ $title }}
                </h4>
            @else
                {{ $header }}
            @endif
        </div>
    @endif

    <div class="card-body px-4 pb-4">
        {{ $slot }}
    </div>
    
    {{-- Footer --}}
    @if(isset($footer))
        <div class="card-footer bg-light border-0 p-4">
            {{ $footer }}
        </div>
    @endif
</div>