{{-- 잔여연차 현황 (HTMX로 로드) --}}
@php
    $currentSort = $sort ?? 'hire_date';
    $currentDir = $direction ?? 'asc';
    $sortColumns = [
        'name' => ['label' => '사원', 'align' => 'left'],
        'department' => ['label' => '부서', 'align' => 'left'],
        'status' => ['label' => '상태', 'align' => 'center'],
        'hire_date' => ['label' => '입사일', 'align' => 'center'],
        'resign_date' => ['label' => '퇴사일', 'align' => 'center'],
        'tenure' => ['label' => '근속', 'align' => 'center', 'sortable' => false],
        'total_days' => ['label' => '부여', 'align' => 'center'],
        'used_days' => ['label' => '사용', 'align' => 'center'],
        'remaining' => ['label' => '잔여', 'align' => 'center'],
        'rate' => ['label' => '소진율', 'align' => 'center'],
    ];
@endphp

<x-table-swipe>
    <table class="min-w-full">
        <thead class="bg-gray-50 border-b border-gray-200">
            <tr>
                @foreach($sortColumns as $col => $meta)
                    @php
                        $sortable = $meta['sortable'] ?? true;
                        $isActive = $sortable && $currentSort === $col;
                        $nextDir = $isActive && $currentDir === 'asc' ? 'desc' : 'asc';
                        $align = $meta['align'] === 'left' ? 'text-left' : 'text-center';
                    @endphp
                    <th class="px-6 py-3 {{ $align }} text-sm font-semibold {{ $isActive ? 'text-blue-700' : 'text-gray-600' }}">
                        @if($sortable)
                            <button type="button"
                                    onclick="loadBalance('{{ $col }}', '{{ $nextDir }}')"
                                    class="inline-flex items-center gap-1 hover:text-blue-600 transition-colors">
                                {{ $meta['label'] }}
                                @if($isActive)
                                    <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        @if($currentDir === 'asc')
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"/>
                                        @else
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
                                        @endif
                                    </svg>
                                @else
                                    <svg class="w-3.5 h-3.5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4"/>
                                    </svg>
                                @endif
                            </button>
                        @else
                            {{ $meta['label'] }}
                        @endif
                    </th>
                @endforeach
            </tr>
        </thead>
        <tbody class="bg-white divide-y divide-gray-100">
            @forelse($balances as $balance)
            @php
                $employee = $balance->employee ?? null;
                $displayName = $employee?->display_name ?? $balance->user?->name ?? '-';
                $department = $employee?->department;
                $hireDate = $employee?->hire_date;
                $isResigned = $employee?->employee_status === 'resigned';
                $isLeave = $employee?->employee_status === 'leave';
                $tenureParts = null;
                if ($hireDate) {
                    $hire = \Carbon\Carbon::parse($hireDate);
                    // 퇴사자: 입사일~퇴사일, 재직자: 입사일~오늘
                    $tenureEnd = ($isResigned && $employee?->resign_date) ? \Carbon\Carbon::parse($employee->resign_date) : now();
                    $tenureYears = (int) $hire->diffInYears($tenureEnd);
                    $tenureMonths = (int) $hire->copy()->addYears($tenureYears)->diffInMonths($tenureEnd);
                    $tenureParts = ['years' => $tenureYears, 'months' => $tenureMonths];
                }
                $remaining = $balance->total_days - $balance->used_days;
                $rate = $balance->total_days > 0 ? round(($balance->used_days / $balance->total_days) * 100) : 0;
                $barColor = $rate >= 90 ? 'bg-red-500' : ($rate >= 70 ? 'bg-amber-500' : 'bg-blue-500');
            @endphp
            <tr class="{{ $isResigned ? 'bg-gray-100 opacity-75' : 'hover:bg-gray-50' }} transition-colors">
                {{-- 사원 --}}
                <td class="px-6 py-4 whitespace-nowrap">
                    <div class="flex items-center gap-2">
                        <div class="shrink-0 w-8 h-8 rounded-full {{ $isResigned ? 'bg-gray-200 text-gray-500' : 'bg-blue-100 text-blue-600' }} flex items-center justify-center text-xs font-medium">
                            {{ mb_substr($displayName, 0, 1) }}
                        </div>
                        <span class="text-sm font-medium {{ $isResigned ? 'text-gray-500' : 'text-gray-900' }}">{{ $displayName }}</span>
                    </div>
                </td>

                {{-- 부서 --}}
                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700">
                    {{ $department?->name ?? '-' }}
                </td>

                {{-- 상태 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center">
                    @if($isResigned)
                        <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-200 text-gray-600">퇴사</span>
                    @elseif($isLeave)
                        <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700">휴직</span>
                    @else
                        <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-700">재직</span>
                    @endif
                </td>

                {{-- 입사일 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-700">
                    {{ $hireDate ?? '-' }}
                </td>

                {{-- 퇴사일 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-700">
                    {{ $employee?->resign_date ?? '-' }}
                </td>

                {{-- 근속 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-700">
                    @if($tenureParts !== null)
                        @if($tenureParts['years'] > 0 && $tenureParts['months'] > 0)
                            {{ $tenureParts['years'] }}년 {{ $tenureParts['months'] }}개월
                        @elseif($tenureParts['years'] > 0)
                            {{ $tenureParts['years'] }}년
                        @elseif($tenureParts['months'] > 0)
                            {{ $tenureParts['months'] }}개월
                        @else
                            1개월 미만
                        @endif
                    @else
                        -
                    @endif
                </td>

                {{-- 부여 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-700 font-medium">
                    {{ $balance->total_days }}일
                </td>

                {{-- 사용 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-700">
                    {{ $balance->used_days }}일
                </td>

                {{-- 잔여 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center">
                    <span class="text-sm font-semibold {{ $remaining <= 3 ? 'text-red-600' : 'text-blue-600' }}">
                        {{ $remaining }}일
                    </span>
                </td>

                {{-- 소진율 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center" style="min-width: 120px;">
                    <div class="flex items-center gap-2 justify-center">
                        <div class="flex-1 bg-gray-200 rounded-full h-2" style="max-width: 80px;">
                            <div class="{{ $barColor }} h-2 rounded-full" style="width: {{ $rate }}%;"></div>
                        </div>
                        <span class="text-xs text-gray-500">{{ $rate }}%</span>
                    </div>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="10" class="px-6 py-12 text-center">
                    <div class="flex flex-col items-center gap-2">
                        <svg class="w-12 h-12 text-gray-300" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 7h6m0 10v-3m-3 3h.01M9 17h.01M9 14h.01M12 14h.01M15 11h.01M12 11h.01M9 11h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"/>
                        </svg>
                        <p class="text-gray-500">{{ $year }}년 연차 정보가 없습니다.</p>
                    </div>
                </td>
            </tr>
            @endforelse
        </tbody>
    </table>
</x-table-swipe>

@if($balances->count())
@php
    $statusLabel = match($empStatus ?? null) {
        'active' => '재직자',
        'resigned' => '퇴직자',
        default => '전체',
    };
@endphp
<div class="px-6 py-3 bg-gray-50 border-t border-gray-200 text-sm text-gray-500">
    총 {{ $balances->count() }}명 | 부여합계: {{ $balances->sum('total_days') }}일 | 사용합계: {{ $balances->sum('used_days') }}일 | 잔여합계: {{ $balances->sum('total_days') - $balances->sum('used_days') }}일
</div>
@endif
