{{-- 영업파트너 수당 현황 카드 --}}
<div class="bg-white rounded-lg shadow-sm overflow-hidden">
    <div class="px-6 py-4 border-b border-gray-200">
        <div class="flex items-center justify-between">
            <h3 class="text-lg font-semibold text-gray-800">내 수당 현황</h3>
            <a href="{{ route('finance.sales-commissions.index') }}"
               class="text-sm text-emerald-600 hover:text-emerald-700">
                전체보기 &rarr;
            </a>
        </div>
    </div>

    <div class="p-6">
        {{-- 수당 요약 (기존) --}}
        <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
            {{-- 이번 달 지급예정 --}}
            <div class="bg-emerald-50 rounded-lg p-4">
                <div class="text-sm text-emerald-600 mb-1">이번 달 지급예정</div>
                <div class="text-xl font-bold text-emerald-700">
                    {{ number_format($commissionSummary['scheduled_this_month'] ?? 0) }}원
                </div>
            </div>

            {{-- 누적 수령액 --}}
            <div class="bg-blue-50 rounded-lg p-4">
                <div class="text-sm text-blue-600 mb-1">누적 수령액</div>
                <div class="text-xl font-bold text-blue-700">
                    {{ number_format($commissionSummary['total_received'] ?? 0) }}원
                </div>
            </div>

            {{-- 대기중 수당 --}}
            <div class="bg-yellow-50 rounded-lg p-4">
                <div class="text-sm text-yellow-600 mb-1">대기중 수당</div>
                <div class="text-xl font-bold text-yellow-700">
                    {{ number_format($commissionSummary['pending_amount'] ?? 0) }}원
                </div>
            </div>

            {{-- 이번 달 계약 건수 --}}
            <div class="bg-purple-50 rounded-lg p-4">
                <div class="text-sm text-purple-600 mb-1">이번 달 계약</div>
                <div class="text-xl font-bold text-purple-700">
                    {{ $commissionSummary['contracts_this_month'] ?? 0 }}건
                </div>
            </div>
        </div>

        {{-- 1차/2차 수당 상세 현황 --}}
        @if(isset($commissionSummary['first_commission']) || isset($commissionSummary['second_commission']))
        <div class="border border-gray-200 rounded-xl p-4 mb-6">
            <h4 class="text-sm font-semibold text-gray-700 mb-4 flex items-center gap-2">
                <svg class="w-5 h-5 text-blue-500" 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>
                개발비 수당 지급 현황
                <span class="text-xs text-gray-400 font-normal">(개발비의 50%씩 1차/2차 분할 지급)</span>
            </h4>

            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                {{-- 1차 수당 --}}
                @php
                    $first = $commissionSummary['first_commission'] ?? ['total' => 0, 'pending' => 0, 'scheduled' => 0, 'paid' => 0];
                    $firstTotal = $first['total'];
                    $firstPaidPercent = $firstTotal > 0 ? round(($first['paid'] / $firstTotal) * 100) : 0;
                @endphp
                <div class="bg-gradient-to-br from-blue-50 to-indigo-50 rounded-xl p-4 border border-blue-100">
                    <div class="flex items-center justify-between mb-3">
                        <div class="flex items-center gap-2">
                            <span class="inline-flex items-center justify-center w-6 h-6 text-xs font-bold text-white bg-blue-500 rounded-full">1</span>
                            <span class="font-semibold text-gray-800">1차 수당</span>
                        </div>
                        <span class="text-lg font-bold text-blue-700">{{ number_format($firstTotal) }}원</span>
                    </div>

                    {{-- 진행 바 --}}
                    <div class="relative h-3 bg-gray-200 rounded-full overflow-hidden mb-3">
                        <div class="absolute inset-y-0 left-0 bg-blue-500 rounded-full transition-all duration-300"
                             style="width: {{ $firstPaidPercent }}%"></div>
                    </div>

                    {{-- 상태별 금액 --}}
                    <div class="grid grid-cols-3 gap-2 text-center text-xs">
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-gray-500 mb-0.5">입금대기</div>
                            <div class="font-semibold text-gray-600">{{ number_format($first['pending']) }}원</div>
                        </div>
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-amber-600 mb-0.5">지급예정</div>
                            <div class="font-semibold text-amber-700">{{ number_format($first['scheduled']) }}원</div>
                        </div>
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-emerald-600 mb-0.5">지급완료</div>
                            <div class="font-semibold text-emerald-700">{{ number_format($first['paid']) }}원</div>
                        </div>
                    </div>
                </div>

                {{-- 2차 수당 --}}
                @php
                    $second = $commissionSummary['second_commission'] ?? ['total' => 0, 'pending' => 0, 'scheduled' => 0, 'paid' => 0];
                    $secondTotal = $second['total'];
                    $secondPaidPercent = $secondTotal > 0 ? round(($second['paid'] / $secondTotal) * 100) : 0;
                @endphp
                <div class="bg-gradient-to-br from-purple-50 to-pink-50 rounded-xl p-4 border border-purple-100">
                    <div class="flex items-center justify-between mb-3">
                        <div class="flex items-center gap-2">
                            <span class="inline-flex items-center justify-center w-6 h-6 text-xs font-bold text-white bg-purple-500 rounded-full">2</span>
                            <span class="font-semibold text-gray-800">2차 수당</span>
                        </div>
                        <span class="text-lg font-bold text-purple-700">{{ number_format($secondTotal) }}원</span>
                    </div>

                    {{-- 진행 바 --}}
                    <div class="relative h-3 bg-gray-200 rounded-full overflow-hidden mb-3">
                        <div class="absolute inset-y-0 left-0 bg-purple-500 rounded-full transition-all duration-300"
                             style="width: {{ $secondPaidPercent }}%"></div>
                    </div>

                    {{-- 상태별 금액 --}}
                    <div class="grid grid-cols-3 gap-2 text-center text-xs">
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-gray-500 mb-0.5">입금대기</div>
                            <div class="font-semibold text-gray-600">{{ number_format($second['pending']) }}원</div>
                        </div>
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-amber-600 mb-0.5">지급예정</div>
                            <div class="font-semibold text-amber-700">{{ number_format($second['scheduled']) }}원</div>
                        </div>
                        <div class="bg-white/60 rounded-lg p-2">
                            <div class="text-emerald-600 mb-0.5">지급완료</div>
                            <div class="font-semibold text-emerald-700">{{ number_format($second['paid']) }}원</div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- 수당 지급 프로세스 안내 --}}
            <div class="mt-4 p-3 bg-gray-50 rounded-lg">
                <div class="flex items-start gap-2 text-xs text-gray-600">
                    <svg class="w-4 h-4 text-gray-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
                    </svg>
                    <div>
                        <p class="mb-1"><strong>수당 지급 프로세스:</strong></p>
                        <p>• <span class="text-gray-500">입금대기</span>: 고객의 개발비 입금 대기 중</p>
                        <p>• <span class="text-amber-600">지급예정</span>: 개발비 입금 완료, 익월 10일 수당 지급 예정</p>
                        <p>• <span class="text-emerald-600">지급완료</span>: 수당 지급 완료</p>
                    </div>
                </div>
            </div>
        </div>
        @endif

        {{-- 최근 수당 내역 --}}
        @if (isset($recentCommissions) && $recentCommissions->count() > 0)
            <div>
                <h4 class="text-sm font-medium text-gray-700 mb-3">최근 수당 내역</h4>
                <div class="space-y-2">
                    @foreach ($recentCommissions as $commission)
                        <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                            <div class="flex items-center gap-3">
                                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium
                                    {{ $commission->payment_type === 'deposit' ? 'bg-blue-100 text-blue-700' : 'bg-green-100 text-green-700' }}">
                                    {{ $commission->payment_type_label }}
                                </span>
                                <div>
                                    <div class="text-sm font-medium text-gray-900">
                                        {{ $commission->tenant->name ?? $commission->tenant->company_name ?? '-' }}
                                    </div>
                                    <div class="text-xs text-gray-500">
                                        {{ $commission->payment_date->format('Y-m-d') }}
                                    </div>
                                </div>
                            </div>
                            <div class="text-right">
                                <div class="text-sm font-bold text-emerald-600">
                                    +{{ number_format($commission->partner_commission) }}원
                                </div>
                                @php
                                    $statusColors = [
                                        'pending' => 'text-yellow-600',
                                        'approved' => 'text-blue-600',
                                        'paid' => 'text-green-600',
                                        'cancelled' => 'text-red-600',
                                    ];
                                @endphp
                                <div class="text-xs {{ $statusColors[$commission->status] ?? 'text-gray-500' }}">
                                    {{ $commission->status_label }}
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        @else
            <div class="text-center py-8 text-gray-500">
                <svg class="w-12 h-12 mx-auto text-gray-300 mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                </svg>
                <p>아직 수당 내역이 없습니다.</p>
            </div>
        @endif
    </div>
</div>
