

<?php $__env->startSection('title', 'Dashboard'); ?>
<?php $__env->startSection('heading', 'Dashboard'); ?>

<?php $__env->startSection('content'); ?>
    <?php
        $ctx = $homeContext ?? [];
        $kpis = $ctx['kpis'] ?? [];
        $actionQueue = $ctx['action_queue'] ?? [];
        $quickActions = $ctx['quick_actions'] ?? [];
        $secondaryStats = $ctx['secondary_stats'] ?? [];
        $toneClasses = [
            'sky' => 'bg-sky-100 text-sky-600',
            'emerald' => 'bg-emerald-100 text-emerald-600',
            'amber' => 'bg-amber-100 text-amber-600',
            'slate' => 'bg-slate-100 text-slate-600',
            'rose' => 'bg-rose-100 text-rose-600',
            'violet' => 'bg-violet-100 text-violet-600',
            'indigo' => 'bg-indigo-100 text-indigo-600',
        ];
        $kpiLeftAccents = [
            'sky' => 'bg-sky-500',
            'emerald' => 'bg-emerald-500',
            'amber' => 'bg-amber-500',
            'slate' => 'bg-slate-400',
            'rose' => 'bg-rose-500',
            'violet' => 'bg-violet-500',
            'indigo' => 'bg-indigo-500',
        ];
    ?>

    <div class="space-y-4">
        
        <div class="rounded-xl border border-slate-200 bg-gradient-to-r from-slate-800 via-slate-700 to-slate-800 px-4 py-4 text-white shadow-sm">
            <div class="flex flex-wrap items-start justify-between gap-3">
                <div>
                    <p class="text-xs font-semibold uppercase tracking-wider text-white/60"><?php echo e($ctx['zone'] ?? 'Overview'); ?></p>
                    <h2 class="mt-1 text-xl font-semibold"><?php echo e($ctx['greeting'] ?? 'Welcome'); ?></h2>
                    <p class="mt-1 text-sm text-white/75"><?php echo e($ctx['date_label'] ?? now()->format('l, j F Y')); ?></p>
                </div>
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($secondaryStats)): ?>
                    <div class="flex flex-wrap gap-3">
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $secondaryStats; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $stat): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <div class="rounded-lg bg-white/10 px-3 py-2 text-center">
                                <p class="text-xs text-white/70"><?php echo e($stat['label']); ?></p>
                                <p class="text-lg font-semibold"><?php echo e($stat['value']); ?></p>
                            </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
            </div>
        </div>

        <div class="grid gap-4 xl:grid-cols-3">
            <div class="space-y-4 xl:col-span-2">
                
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($actionQueue)): ?>
                    <div class="rounded-xl border border-amber-200 bg-amber-50/60 p-4 shadow-sm">
                        <div class="mb-3 flex items-center justify-between gap-2">
                            <h3 class="text-sm font-semibold text-amber-900">Needs your attention</h3>
                            <span class="rounded-full bg-amber-200 px-2 py-0.5 text-xs font-medium text-amber-900"><?php echo e(count($actionQueue)); ?></span>
                        </div>
                        <div class="grid gap-3 lg:grid-cols-2">
                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $actionQueue; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <div class="rounded-lg border border-amber-100 bg-white p-3">
                                    <div class="flex items-center justify-between gap-2">
                                        <a href="<?php echo e($item['href']); ?>" class="text-sm font-semibold text-slate-900 hover:text-primary"><?php echo e($item['title']); ?></a>
                                        <span class="rounded-full bg-slate-100 px-2 py-0.5 text-xs font-medium text-slate-700"><?php echo e($item['count']); ?></span>
                                    </div>
                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($item['rows'])): ?>
                                        <ul class="mt-2 space-y-1.5">
                                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $item['rows']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $row): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <li>
                                                    <a href="<?php echo e($row['href'] ?? $item['href']); ?>" class="flex items-center justify-between gap-2 rounded-md px-2 py-1.5 text-xs hover:bg-slate-50">
                                                        <span class="font-medium text-slate-800"><?php echo e($row['name']); ?></span>
                                                        <span class="text-slate-500"><?php echo e($row['meta'] ?? ''); ?></span>
                                                    </a>
                                                </li>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                        </ul>
                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                </div>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                        </div>
                    </div>
                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($kpis)): ?>
                    <div class="grid gap-4 sm:grid-cols-2">
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $kpis; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $kpi): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <?php
                                $iconTone = $toneClasses[$kpi['tone'] ?? 'slate'] ?? $toneClasses['slate'];
                                $leftAccent = $kpiLeftAccents[$kpi['tone'] ?? 'slate'] ?? $kpiLeftAccents['slate'];
                                $isLeaveKpi = ($kpi['key'] ?? '') === 'leave';
                                $leaveRows = collect($kpi['leave_rows'] ?? [])->filter();
                            ?>
                            <a href="<?php echo e($kpi['href'] ?? '#'); ?>"
                               <?php if($isLeaveKpi && $leaveRows->isNotEmpty()): ?>
                                   x-data="{ leaveOpen: false }"
                                   @click.outside="leaveOpen = false"
                                   :class="leaveOpen ? 'z-20' : ''"
                               <?php endif; ?>
                               class="group relative block rounded-2xl border border-slate-200 bg-white p-4 pl-5 shadow-sm transition hover:-translate-y-0.5 hover:border-slate-300 hover:shadow-md <?php echo e($isLeaveKpi ? 'overflow-visible z-10 hover:z-20 focus-within:z-20' : 'overflow-hidden'); ?>">
                                
                                <span class="pointer-events-none absolute inset-0 z-0 overflow-hidden rounded-2xl" aria-hidden="true">
                                    <span class="absolute inset-y-0 left-0 w-1.5 <?php echo e($leftAccent); ?>"></span>
                                </span>
                                <div class="relative z-10 flex items-start justify-between gap-3">
                                    <div class="min-w-0">
                                        <p class="text-sm font-medium text-slate-500"><?php echo e($kpi['title']); ?></p>
                                        <p class="mt-1 text-xl font-semibold text-slate-900"><?php echo e($kpi['value']); ?></p>
                                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($kpi['hint']) && ! $isLeaveKpi): ?>
                                            <p class="mt-1 text-xs text-slate-500"><?php echo e($kpi['hint']); ?></p>
                                        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                    </div>
                                    <div class="flex shrink-0 items-center gap-1">
                                        <div class="flex h-9 w-9 items-center justify-center rounded-lg <?php echo e($iconTone); ?>">
                                            <i class="bi <?php echo e($kpi['icon'] ?? 'bi-graph-up'); ?> text-lg"></i>
                                        </div>
                                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($isLeaveKpi && $leaveRows->isNotEmpty()): ?>
                                            <button type="button"
                                                    class="inline-flex h-7 w-7 items-center justify-center rounded-md text-slate-400 transition hover:bg-amber-50 hover:text-amber-600"
                                                    :class="leaveOpen ? 'bg-amber-50 text-amber-600' : 'group-hover:text-amber-600'"
                                                    @click.prevent.stop="leaveOpen = !leaveOpen"
                                                    :aria-expanded="leaveOpen.toString()"
                                                    aria-label="Show people on leave">
                                                <i class="bi bi-chevron-right text-sm transition" :class="leaveOpen ? 'rotate-90' : ''" aria-hidden="true"></i>
                                            </button>
                                        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                    </div>
                                </div>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($isLeaveKpi && $leaveRows->isNotEmpty()): ?>
                                    <div class="absolute left-full top-1/2 z-30 ml-2 w-max max-w-[min(24rem,calc(100vw-8rem))] -translate-y-1/2 rounded-xl border border-slate-200 bg-white p-4 shadow-lg transition"
                                         :class="leaveOpen
                                            ? 'pointer-events-auto visible opacity-100'
                                            : 'pointer-events-none invisible opacity-0 group-hover:pointer-events-auto group-hover:visible group-hover:opacity-100'"
                                         @click.prevent.stop>
                                        
                                        <span class="absolute left-0 top-1/2 h-3.5 w-3.5 -translate-x-1/2 -translate-y-1/2 rotate-45 border-b border-l border-slate-200 bg-white" aria-hidden="true"></span>
                                        <p class="mb-3 px-1 text-xs font-semibold uppercase tracking-wide text-slate-400">On leave today</p>
                                        <div class="flex flex-nowrap items-start gap-3">
                                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $leaveRows->take(6); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $row): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <div class="flex w-16 flex-col items-center gap-1.5 text-center">
                                                    <?php if (isset($component)) { $__componentOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.user-avatar','data' => ['user' => $row['user'] ?? null,'size' => 'md','class' => 'shrink-0']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('user-avatar'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['user' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute($row['user'] ?? null),'size' => 'md','class' => 'shrink-0']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e)): ?>
<?php $attributes = $__attributesOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e; ?>
<?php unset($__attributesOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e)): ?>
<?php $component = $__componentOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e; ?>
<?php unset($__componentOriginalaa6ddd3b8ee0acee5a2d1d7ac5c7e40e); ?>
<?php endif; ?>
                                                    <span class="w-full truncate text-xs font-medium leading-tight text-slate-700"><?php echo e($row['name'] ?? '—'); ?></span>
                                                </div>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                        </div>
                                    </div>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </a>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(! empty($quickActions)): ?>
                    <?php
                        $quickActionStyles = [
                            'sky' => 'border-sky-200 bg-sky-50 text-sky-800 hover:bg-sky-100',
                            'rose' => 'border-rose-200 bg-rose-50 text-rose-800 hover:bg-rose-100',
                            'violet' => 'border-violet-200 bg-violet-50 text-violet-800 hover:bg-violet-100',
                            'emerald' => 'border-emerald-200 bg-emerald-50 text-emerald-800 hover:bg-emerald-100',
                            'amber' => 'border-amber-200 bg-amber-50 text-amber-900 hover:bg-amber-100',
                            'teal' => 'border-teal-200 bg-teal-50 text-teal-800 hover:bg-teal-100',
                            'indigo' => 'border-indigo-200 bg-indigo-50 text-indigo-800 hover:bg-indigo-100',
                            'orange' => 'border-orange-200 bg-orange-50 text-orange-800 hover:bg-orange-100',
                            'slate' => 'border-slate-200 bg-slate-100 text-slate-700 hover:bg-slate-200',
                        ];
                        $quickActionCycle = array_keys($quickActionStyles);
                    ?>
                    <div>
                        <h2 class="mb-3 text-sm font-semibold uppercase tracking-wider text-slate-500">Quick actions</h2>
                        <div class="flex flex-wrap gap-3">
                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $quickActions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $action): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <?php
                                    $tone = $action['tone'] ?? $quickActionCycle[$index % count($quickActionCycle)];
                                    $toneClass = $quickActionStyles[$tone] ?? $quickActionStyles['slate'];
                                ?>
                                <a href="<?php echo e($action['href']); ?>"
                                   class="inline-flex items-center gap-2 rounded-full border px-3.5 py-1.5 text-sm font-medium shadow-sm transition <?php echo e($toneClass); ?>">
                                    <i class="bi <?php echo e($action['icon']); ?> text-sm"></i>
                                    <?php echo e($action['label']); ?>

                                </a>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                        </div>
                    </div>
                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                
                <div class="grid gap-4 lg:grid-cols-2">
                    <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => ['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-emerald-50/20 to-slate-50/80 p-4 shadow-sm']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-emerald-50/20 to-slate-50/80 p-4 shadow-sm']); ?>
                        <div class="mb-3">
                            <p class="text-xs font-semibold uppercase tracking-[0.18em] text-emerald-600">Attendance</p>
                            <h3 class="mt-1 text-base font-semibold text-slate-900">7-day trend</h3>
                            <p class="mt-1 text-sm text-slate-500">Distinct employees clocked in per day.</p>
                        </div>
                        <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
                            <div class="h-56 w-full">
                                <canvas id="attendanceChart" class="h-full w-full"></canvas>
                            </div>
                        </div>
                     <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>

                    <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => ['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-sky-50/20 to-slate-50/80 p-4 shadow-sm']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-sky-50/20 to-slate-50/80 p-4 shadow-sm']); ?>
                        <div class="mb-3">
                            <p class="text-xs font-semibold uppercase tracking-[0.18em] text-sky-600">Departments</p>
                            <h3 class="mt-1 text-base font-semibold text-slate-900">Headcount mix</h3>
                            <p class="mt-1 text-sm text-slate-500">Active employees by department.</p>
                        </div>
                        <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
                            <div class="h-56 w-full">
                                <canvas id="departmentChart" class="h-full w-full"></canvas>
                            </div>
                        </div>
                     <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>

                    <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => ['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-blue-50/20 to-slate-50/80 p-4 shadow-sm lg:col-span-2']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['class' => 'group min-w-0 rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-blue-50/20 to-slate-50/80 p-4 shadow-sm lg:col-span-2']); ?>
                        <div class="mb-3">
                            <p class="text-xs font-semibold uppercase tracking-[0.18em] text-blue-600">Leaves</p>
                            <h3 class="mt-1 text-base font-semibold text-slate-900">Leave utilization</h3>
                            <p class="mt-1 text-sm text-slate-500">Approved leave days by type.</p>
                        </div>
                        <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
                            <div class="h-56 w-full">
                                <canvas id="leaveTypesChart" class="h-full w-full"></canvas>
                            </div>
                        </div>
                     <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
                </div>
            </div>

            <aside class="xl:col-span-1">
                <div class="xl:sticky xl:top-20">
                    <div class="xl:max-h-[calc(100vh-7rem)] xl:overflow-y-auto xl:pr-1">
                        <?php echo $__env->make('dashboard.partials.mixed-feed', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                    </div>
                </div>
            </aside>
        </div>
    </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            if (typeof Chart === 'undefined') return;

            var palette = {
                text: '#334155',
                muted: '#94a3b8',
                grid: 'rgba(148, 163, 184, 0.2)',
                border: '#ffffff',
                tooltipBg: 'rgba(255, 255, 255, 0.98)',
                tooltipText: '#0f172a'
            };

            Chart.defaults.color = palette.text;
            Chart.defaults.font.family = 'ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif';
            Chart.defaults.font.size = 12;
            Chart.defaults.borderColor = palette.grid;

            var baseOptions = {
                responsive: true,
                maintainAspectRatio: false,
                normalized: true,
                animation: { duration: 700, easing: 'easeOutQuart' },
                interaction: { mode: 'index', intersect: false },
                plugins: {
                    legend: {
                        labels: {
                            color: palette.text,
                            boxWidth: 10,
                            boxHeight: 10,
                            padding: 16,
                            usePointStyle: true,
                            pointStyle: 'circle'
                        }
                    },
                    tooltip: {
                        backgroundColor: palette.tooltipBg,
                        titleColor: palette.tooltipText,
                        bodyColor: palette.tooltipText,
                        borderColor: palette.grid,
                        borderWidth: 1,
                        padding: 10,
                        displayColors: true
                    }
                }
            };

            var attendanceLabels = <?php echo json_encode($chartAttendance['labels'] ?? [], 15, 512) ?>;
            var attendanceData = <?php echo json_encode($chartAttendance['data'] ?? [], 15, 512) ?>;
            var ctx1 = document.getElementById('attendanceChart');
            if (ctx1) {
                var lineCtx = ctx1.getContext('2d');
                var lineGradient = lineCtx.createLinearGradient(0, 0, 0, ctx1.height || 260);
                lineGradient.addColorStop(0, 'rgba(16, 185, 129, 0.35)');
                lineGradient.addColorStop(1, 'rgba(16, 185, 129, 0.02)');

                new Chart(ctx1.getContext('2d'), {
                    type: 'line',
                    data: {
                        labels: attendanceLabels,
                        datasets: [{
                            label: 'Present employees',
                            data: attendanceData,
                            borderColor: '#10b981',
                            borderWidth: 2.5,
                            tension: 0.42,
                            fill: true,
                            backgroundColor: lineGradient,
                            pointRadius: 0,
                            pointHoverRadius: 5,
                            pointHoverBorderWidth: 2,
                            pointHoverBackgroundColor: '#ffffff',
                            pointHoverBorderColor: '#10b981'
                        }]
                    },
                    options: Object.assign({}, baseOptions, {
                        plugins: { legend: { display: false }, tooltip: baseOptions.plugins.tooltip },
                        scales: {
                            x: { grid: { display: false }, ticks: { color: palette.muted } },
                            y: { beginAtZero: true, ticks: { color: palette.muted, precision: 0 } }
                        }
                    })
                });
            }

            var deptLabels = <?php echo json_encode($chartDepartments['labels'] ?? [], 15, 512) ?>;
            var deptData = <?php echo json_encode($chartDepartments['data'] ?? [], 15, 512) ?>;
            var ctx2 = document.getElementById('departmentChart');
            if (ctx2) {
                var isTabletOrMobile = window.innerWidth < 1280;
                var deptPalette = [
                    '#10b981', '#0ea5e9', '#f59e0b', '#ef4444', '#8b5cf6',
                    '#14b8a6', '#f97316', '#3b82f6', '#ec4899', '#84cc16',
                    '#06b6d4', '#a855f7', '#eab308', '#22c55e', '#6366f1',
                    '#fb7185', '#2dd4bf', '#f472b6', '#38bdf8', '#4ade80'
                ];
                var deptColors = deptLabels.map(function(_, index) {
                    if (index < deptPalette.length) {
                        return deptPalette[index];
                    }
                    var hue = Math.round((index * 137.508) % 360);
                    return 'hsl(' + hue + ' 70% 48%)';
                });
                var deptHoverColors = deptColors.map(function(color) {
                    if (color.indexOf('hsl(') === 0) {
                        return color.replace('48%', '40%');
                    }
                    return color;
                });

                new Chart(ctx2.getContext('2d'), {
                    type: 'doughnut',
                    data: {
                        labels: deptLabels,
                        datasets: [{
                            data: deptData,
                            backgroundColor: deptColors,
                            hoverBackgroundColor: deptHoverColors,
                            borderColor: palette.border,
                            borderWidth: 2,
                            hoverOffset: 8
                        }]
                    },
                    options: Object.assign({}, baseOptions, {
                        interaction: { mode: 'nearest', intersect: true },
                        cutout: '58%',
                        plugins: {
                            legend: Object.assign({}, baseOptions.plugins.legend, {
                                position: isTabletOrMobile ? 'bottom' : 'right',
                                align: 'center'
                            }),
                            tooltip: Object.assign({}, baseOptions.plugins.tooltip, {
                                callbacks: {
                                    label: function(context) {
                                        return context.label + ': ' + context.formattedValue;
                                    }
                                }
                            })
                        }
                    })
                });
            }

            var leaveLabels = <?php echo json_encode($chartLeaveTypes['labels'] ?? [], 15, 512) ?>;
            var leaveData = <?php echo json_encode($chartLeaveTypes['data'] ?? [], 15, 512) ?>;
            var ctx3 = document.getElementById('leaveTypesChart');
            if (ctx3) {
                new Chart(ctx3.getContext('2d'), {
                    type: 'bar',
                    data: {
                        labels: leaveLabels,
                        datasets: [{
                            label: 'Days taken',
                            data: leaveData,
                            backgroundColor: ['#10b981', '#0ea5e9', '#3b82f6', '#64748b', '#14b8a6', '#1d4ed8'],
                            hoverBackgroundColor: ['#059669', '#0284c7', '#2563eb', '#475569', '#0f766e', '#1e40af'],
                            borderRadius: 10,
                            borderSkipped: false,
                            maxBarThickness: 34
                        }]
                    },
                    options: Object.assign({}, baseOptions, {
                        scales: {
                            x: { grid: { display: false }, ticks: { color: palette.muted } },
                            y: { beginAtZero: true, ticks: { color: palette.muted, precision: 0 } }
                        },
                        plugins: { legend: { display: false }, tooltip: baseOptions.plugins.tooltip }
                    })
                });
            }
        });
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /var/www/html/kiyohr/v2_version/resources/views/dashboard.blade.php ENDPATH**/ ?>