{{-- 계좌 목록 테이블 (HTMX로 로드) --}}
<x-table-swipe>
    <table class="min-w-full">
        <thead class="bg-gray-50 border-b border-gray-200">
            <tr>
                <th class="px-6 py-3 text-left text-sm font-semibold text-gray-600">은행</th>
                <th class="px-6 py-3 text-left text-sm font-semibold text-gray-600">계좌번호</th>
                <th class="px-6 py-3 text-left text-sm font-semibold text-gray-600">예금종류</th>
                <th class="px-6 py-3 text-right text-sm font-semibold text-gray-600">잔액</th>
                <th class="px-6 py-3 text-center text-sm font-semibold text-gray-600">개설일자</th>
                <th class="px-6 py-3 text-center text-sm font-semibold text-gray-600">최종처리일시</th>
                <th class="px-6 py-3 text-center text-sm font-semibold text-gray-600">작업</th>
            </tr>
        </thead>
        <tbody class="bg-white divide-y divide-gray-100">
            @forelse($accounts as $account)
            <tr class="hover:bg-gray-50 transition-colors {{ $account->trashed() ? 'opacity-50 bg-red-50' : '' }}">
                {{-- 은행 --}}
                <td class="px-6 py-4 whitespace-nowrap">
                    <a href="{{ route('finance.accounts.show', $account->id) }}"
                       class="text-blue-600 hover:text-blue-800 hover:underline font-medium">
                        {{ $account->bank_name }}
                    </a>
                </td>

                {{-- 계좌번호 --}}
                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                    {{ $account->account_number }}
                </td>

                {{-- 예금종류 --}}
                <td class="px-6 py-4 whitespace-nowrap">
                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
                        {{ $account->account_type === '보통예금' ? 'bg-blue-100 text-blue-700' : '' }}
                        {{ $account->account_type === '정기예금' ? 'bg-purple-100 text-purple-700' : '' }}
                        {{ $account->account_type === '적금' ? 'bg-green-100 text-green-700' : '' }}
                        {{ !in_array($account->account_type, ['보통예금', '정기예금', '적금']) ? 'bg-gray-100 text-gray-700' : '' }}
                    ">
                        {{ $account->account_type }}
                    </span>
                </td>

                {{-- 잔액 --}}
                <td class="px-6 py-4 whitespace-nowrap text-right" data-account-number="{{ str_replace('-', '', $account->account_number) }}">
                    <span class="text-sm font-semibold account-balance {{ $account->balance >= 100000000 ? 'text-emerald-600' : 'text-gray-900' }}" data-original="{{ $account->balance }}">
                        {{ $account->formatted_balance }}
                    </span>
                </td>

                {{-- 개설일자 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-500">
                    {{ $account->opened_at?->format('Y-m-d') ?? '-' }}
                </td>

                {{-- 최종처리일시 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center text-sm text-gray-500">
                    @php
                        $lastTxDisplay = $account->last_transaction_at?->format('Y-m-d H:i');
                        if (!$lastTxDisplay && $account->latest_barobill_trans_date) {
                            $d = $account->latest_barobill_trans_date;
                            $t = $account->latest_barobill_trans_time;
                            $lastTxDisplay = substr($d,0,4).'-'.substr($d,4,2).'-'.substr($d,6,2);
                            if ($t) {
                                $lastTxDisplay .= ' '.substr($t,0,2).':'.substr($t,2,2);
                            }
                        }
                    @endphp
                    {{ $lastTxDisplay ?? '-' }}
                </td>

                {{-- 작업 버튼 --}}
                <td class="px-6 py-4 whitespace-nowrap text-center">
                    <div class="flex items-center justify-center gap-2">
                        @if($account->trashed())
                            {{-- 삭제된 항목: 복원/영구삭제 --}}
                            <button type="button"
                                    hx-post="{{ route('api.admin.bank-accounts.restore', $account->id) }}"
                                    hx-headers='{"X-CSRF-TOKEN": "{{ csrf_token() }}"}'
                                    hx-target="#accounts-table"
                                    hx-swap="innerHTML"
                                    hx-confirm="이 계좌를 복원하시겠습니까?"
                                    class="text-green-600 hover:text-green-800 text-sm font-medium">
                                복원
                            </button>
                            <button type="button"
                                    hx-delete="{{ route('api.admin.bank-accounts.force-delete', $account->id) }}"
                                    hx-headers='{"X-CSRF-TOKEN": "{{ csrf_token() }}"}'
                                    hx-target="#accounts-table"
                                    hx-swap="innerHTML"
                                    hx-confirm="이 계좌를 영구 삭제하시겠습니까? 이 작업은 되돌릴 수 없습니다."
                                    class="text-red-600 hover:text-red-800 text-sm font-medium">
                                영구삭제
                            </button>
                        @else
                            {{-- 거래내역 보기 --}}
                            <a href="{{ route('finance.accounts.show', $account->id) }}"
                               class="text-gray-600 hover:text-gray-800"
                               title="거래내역">
                                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
                                </svg>
                            </a>

                            {{-- 수정 --}}
                            <a href="{{ route('finance.accounts.edit', $account->id) }}"
                               class="text-blue-600 hover:text-blue-800"
                               title="수정">
                                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                                </svg>
                            </a>

                            {{-- 삭제 --}}
                            <button type="button"
                                    hx-delete="{{ route('api.admin.bank-accounts.destroy', $account->id) }}"
                                    hx-headers='{"X-CSRF-TOKEN": "{{ csrf_token() }}"}'
                                    hx-target="#accounts-table"
                                    hx-swap="innerHTML"
                                    hx-confirm="이 계좌를 삭제하시겠습니까?"
                                    class="text-red-600 hover:text-red-800"
                                    title="삭제">
                                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
                                </svg>
                            </button>
                        @endif
                    </div>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="7" 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="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"/>
                        </svg>
                        <p class="text-gray-500">등록된 계좌가 없습니다.</p>
                        <a href="{{ route('finance.accounts.create') }}"
                           class="mt-2 text-sm text-emerald-600 hover:text-emerald-700 font-medium">
                            첫 번째 계좌 등록하기 →
                        </a>
                    </div>
                </td>
            </tr>
            @endforelse
        </tbody>
    </table>
</x-table-swipe>

{{-- 페이지네이션 --}}
@if($accounts->hasPages())
<div class="px-6 py-4 border-t border-gray-200 bg-gray-50">
    {{ $accounts->links() }}
</div>
@endif