@can('employees.salary.view')
    <dl class="row mb-4">
        <dt class="col-sm-3">{{ __('employees.fields.salary') }}</dt>
        <dd class="col-sm-9">{{ $employee->salary }}</dd>
    </dl>
@endcan

@if ($tabData === null || $tabData->isEmpty())
    <x-ui.operational.empty-state :title="__('employees.empty_tab.payroll')" />
@else
    <x-ui.table.table :columns="[
        ['label' => __('employees.payroll.period')],
        ['label' => __('employees.payroll.base_salary')],
        ['label' => __('employees.payroll.gross')],
        ['label' => __('employees.payroll.generated_at')],
    ]">
        @foreach ($tabData as $snapshot)
            <x-ui.table.row>
                <td>{{ $snapshot->period?->name ?? '—' }}</td>
                <td>{{ $snapshot->base_salary }}</td>
                <td>{{ $snapshot->gross_amount }}</td>
                <td>{{ $snapshot->generated_at?->format('Y-m-d H:i') ?: '—' }}</td>
            </x-ui.table.row>
        @endforeach
    </x-ui.table.table>
@endif
