<?php $attributes ??= new \Illuminate\View\ComponentAttributeBag;

$__newAttributes = [];
$__propNames = \Illuminate\View\ComponentAttributeBag::extractPropNames(([
    'percent' => 0,
    'color' => 'indigo',
    'size' => 'md',
    'showLabel' => false,
]));

foreach ($attributes->all() as $__key => $__value) {
    if (in_array($__key, $__propNames)) {
        $$__key = $$__key ?? $__value;
    } else {
        $__newAttributes[$__key] = $__value;
    }
}

$attributes = new \Illuminate\View\ComponentAttributeBag($__newAttributes);

unset($__propNames);
unset($__newAttributes);

foreach (array_filter(([
    'percent' => 0,
    'color' => 'indigo',
    'size' => 'md',
    'showLabel' => false,
]), 'is_string', ARRAY_FILTER_USE_KEY) as $__key => $__value) {
    $$__key = $$__key ?? $__value;
}

$__defined_vars = get_defined_vars();

foreach ($attributes->all() as $__key => $__value) {
    if (array_key_exists($__key, $__defined_vars)) unset($$__key);
}

unset($__defined_vars, $__key, $__value); ?>

<?php
    $percent = min(100, max(0, $percent));

    $colors = [
        'indigo' => 'bg-indigo-600 dark:bg-indigo-500',
        'green' => 'bg-green-600 dark:bg-green-500',
        'red' => 'bg-red-600 dark:bg-red-500',
        'blue' => 'bg-blue-600 dark:bg-blue-500',
        'yellow' => 'bg-yellow-500 dark:bg-yellow-400',
        'purple' => 'bg-purple-600 dark:bg-purple-500',
    ];

    $sizes = [
        'sm' => 'h-1.5',
        'md' => 'h-2.5',
        'lg' => 'h-4',
    ];

    // Auto color based on percentage for budget tracking
    if ($color === 'auto') {
        $color = match(true) {
            $percent >= 100 => 'red',
            $percent >= 80 => 'yellow',
            default => 'green',
        };
    }
?>

<div <?php echo e($attributes->merge(['class' => 'w-full'])); ?>>
    <?php if($showLabel): ?>
        <div class="flex justify-between items-center mb-1">
            <span class="text-sm text-gray-600 dark:text-gray-400"><?php echo e($slot); ?></span>
            <span class="text-sm font-medium text-gray-900 dark:text-white"><?php echo e(number_format($percent, 0)); ?>%</span>
        </div>
    <?php endif; ?>

    <div class="w-full bg-gray-200 dark:bg-gray-700 rounded-full <?php echo e($sizes[$size] ?? $sizes['md']); ?> overflow-hidden">
        <div class="<?php echo e($colors[$color] ?? $colors['indigo']); ?> <?php echo e($sizes[$size] ?? $sizes['md']); ?> rounded-full transition-all duration-300"
             style="width: <?php echo e($percent); ?>%"></div>
    </div>
</div>
<?php /**PATH C:\xampp\htdocs\mymoney-app\resources\views\components\progress-bar.blade.php ENDPATH**/ ?>