@php
    $breadcrumbs = [
        ['label' => __('common.home'), 'url' => route('dashboard.index')],
        ['label' => __('operational_ui.workflow_inbox.title')],
    ];
    $ops = $inbox['ops'] ?? null;
    $hr = $inbox['hr'] ?? null;
    $procurementInbox = $inbox['procurementInbox'] ?? null;
    $salesInbox = $inbox['salesInbox'] ?? null;
@endphp

<x-ui.layout.page
    :title="__('operational_ui.workflow_inbox.title')"
    :subtitle="__('operational_ui.workflow_inbox.subtitle')"
    page-icon="fe fe-inbox"
    :breadcrumbs="$breadcrumbs"
>
    <div class="row g-3">
        <div class="col-lg-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-header bg-white fw-semibold" style="color: {{ config('theme.colors.text') }};">
                    {{ __('operational_ui.workflow_inbox.section_approvals') }}
                </div>
                <div class="card-body small">
                    @if ($hr === null && ($inbox['pendingPermissions'] ?? null) === null && ($inbox['pendingOvertime'] ?? null) === null)
                        <p class="text-muted mb-0">{{ __('operational_ui.workflow_inbox.empty_hr') }}</p>
                    @else
                        <ul class="list-unstyled mb-0">
                            @if ($hr !== null && $inbox['leaveUrl'])
                                <li class="mb-2 d-flex justify-content-between">
                                    <span>{{ __('dashboard.action_center.alerts.pending_manager_title') }}</span>
                                    <a href="{{ $inbox['leaveUrl'] }}">{{ $hr->pendingLeaveManager }}</a>
                                </li>
                                <li class="mb-2 d-flex justify-content-between">
                                    <span>{{ __('dashboard.action_center.alerts.pending_hr_title') }}</span>
                                    <a href="{{ $inbox['leaveUrl'] }}">{{ $hr->pendingLeaveHr }}</a>
                                </li>
                            @endif
                            @if ($hr !== null && $inbox['exceptionsUrl'])
                                <li class="mb-2 d-flex justify-content-between">
                                    <span>{{ __('dashboard.action_center.alerts.exceptions_critical_title') }}</span>
                                    <a href="{{ $inbox['exceptionsUrl'] }}">{{ $hr->criticalAttendanceExceptions }}</a>
                                </li>
                            @endif
                            @if (($inbox['pendingPermissions'] ?? null) !== null && ($inbox['permissionsUrl'] ?? null))
                                <li class="mb-2 d-flex justify-content-between">
                                    <span>{{ __('operational_ui.workflow_inbox.pending_permissions') }}</span>
                                    <a href="{{ $inbox['permissionsUrl'] }}">{{ $inbox['pendingPermissions'] }}</a>
                                </li>
                            @endif
                            @if (($inbox['pendingOvertime'] ?? null) !== null && ($inbox['overtimeUrl'] ?? null))
                                <li class="d-flex justify-content-between">
                                    <span>{{ __('operational_ui.workflow_inbox.pending_overtime') }}</span>
                                    <a href="{{ $inbox['overtimeUrl'] }}">{{ $inbox['pendingOvertime'] }}</a>
                                </li>
                            @endif
                        </ul>
                    @endif
                </div>
            </div>
        </div>
        <div class="col-lg-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-header bg-white fw-semibold" style="color: {{ config('theme.colors.text') }};">
                    {{ __('operational_ui.workflow_inbox.section_ops') }}
                </div>
                <div class="card-body small">
                    @if ($ops === null)
                        <p class="text-muted mb-0">{{ __('operational_ui.workflow_inbox.no_ops_access') }}</p>
                    @else
                        <ul class="list-unstyled mb-3">
                            <li class="mb-1">{{ __('operational_ui.inbox.failed_receipts') }}:
                                <strong>{{ count($ops['failedReceipts'] ?? []) }}</strong></li>
                            <li class="mb-1">{{ __('operational_ui.inbox.stale_draft_receipts') }}:
                                <strong>{{ count($ops['staleDraftReceipts'] ?? []) }}</strong></li>
                            <li class="mb-1">{{ __('operational_ui.inbox.quarantined') }}:
                                <strong>{{ count($ops['quarantinedReceipts'] ?? []) }}</strong></li>
                        </ul>
                        <a href="{{ route('operations.control-center.index') }}" class="btn btn-sm btn-outline-primary">
                            {{ __('operational_ui.workflow_inbox.view_control_center') }}
                        </a>
                    @endif
                </div>
            </div>
        </div>
        <div class="col-lg-4">
            @include('pages.operations.partials.workflow-inbox-procurement')
        </div>
        <div class="col-lg-6">
            @include('pages.operations.partials.workflow-inbox-sales')
        </div>
        <div class="col-lg-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-header bg-white fw-semibold" style="color: {{ config('theme.colors.text') }};">
                    {{ __('operational_ui.workflow_inbox.section_reconciliation') }}
                </div>
                <div class="card-body small">
                    @if ($ops === null)
                        <p class="text-muted mb-0">{{ __('operational_ui.workflow_inbox.no_ops_access') }}</p>
                    @else
                        @php $drift = (bool) ($ops['projectionDrift'] ?? false); @endphp
                        <p class="mb-1">{{ __('operational_ui.inbox.projection_mismatch') }}:
                            <strong>{{ $drift ? __('common.yes') : __('common.no') }}</strong></p>
                        <p class="mb-0 text-muted">{{ __('operational_ui.inbox.reconcile_hint') }}</p>
                    @endif
                </div>
            </div>
        </div>
    </div>
</x-ui.layout.page>
