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

$__newAttributes = [];
$__propNames = \Illuminate\View\ComponentAttributeBag::extractPropNames((['id', 'label', 'icon' => null, 'count' => null, 'active' => 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((['id', 'label', 'icon' => null, 'count' => null, 'active' => 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); ?>

<div class="qv-tab <?php echo e($active ? 'active' : ''); ?>" onclick="switchQvTab('<?php echo e($id); ?>', this)" <?php echo e($attributes); ?>>
    <div class="qv-tab-inner">
        <?php if($icon): ?>
            <i class="<?php echo e($icon); ?> qv-tab-icon"></i>
        <?php endif; ?>
        <span class="qv-tab-label"><?php echo e($label); ?></span>
        <?php if($count !== null): ?>
            <span class="qv-tab-count"><?php echo e($count); ?></span>
        <?php endif; ?>
    </div>
    <div class="qv-tab-indicator"></div>
</div>

<style>
    .qv-tab { 
        position: relative; 
        padding: 0 1.25rem; 
        cursor: pointer; 
        transition: all 0.3s ease;
        height: 52px;
        display: flex;
        align-items: center;
    }
    .qv-tab-inner {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        color: #64748b;
        font-size: 0.88rem;
        font-weight: 700;
        transition: all 0.2s;
        z-index: 2;
    }
    .qv-tab:hover .qv-tab-inner { color: #1e293b; }
    .qv-tab.active .qv-tab-inner { color: #2563eb; }

    .qv-tab-icon { font-size: 1rem; opacity: 0.7; }
    .qv-tab.active .qv-tab-icon { opacity: 1; }

    .qv-tab-count { 
        font-size: 0.7rem; 
        background: #f1f5f9; 
        color: #64748b; 
        padding: 2px 8px; 
        border-radius: 6px; 
        font-weight: 800;
    }
    .qv-tab.active .qv-tab-count { background: #eff6ff; color: #2563eb; }

    .qv-tab-indicator {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: #2563eb;
        border-radius: 3px 3px 0 0;
        transform: scaleX(0);
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .qv-tab.active .qv-tab-indicator { transform: scaleX(1); }
</style>
<?php /**PATH C:\xampp\htdocs\acente\resources\views/components/quick-view/tab.blade.php ENDPATH**/ ?>