@extends('employee.layouts.app')
@section('title', get_setting('site_name').' | '.__('Disciplinary'))
@section('content')
    <style>
        .emp-dm-wrap .card {
            border-radius: 14px;
            border: 1px solid #edf0f6;
            box-shadow: 0 0.125rem 0.5rem rgba(15, 23, 42, 0.04);
        }
        .emp-dm-wrap .card-header {
            background: #fff;
            border-bottom: 1px solid #edf0f6;
            font-weight: 700;
            padding: 0.9rem 1.15rem;
        }
        .emp-dm-wrap .card-body.p-2 { padding: 0.5rem !important; }
        .emp-dm-wrap .card-footer {
            background: #fff;
            border-top: 1px solid #edf0f6;
            padding: 0.75rem 1.15rem;
        }
        .emp-dm-stat {
            background: #fff;
            border: 1px solid #edf0f6;
            border-radius: 10px;
            padding: 10px 14px;
            text-align: center;
            height: 100%;
        }
        .emp-dm-stat .num { font-size: 1.25rem; font-weight: 800; line-height: 1.2; }
        .emp-dm-stat .lbl {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: #64748b;
        }
        .emp-dm-hint {
            font-size: 0.8125rem;
            color: #64748b;
            padding: 0.85rem 1rem;
            background: #f0f9ff;
            border: 1px solid #bae6fd;
            border-radius: 10px;
            margin-bottom: 1rem;
        }
        .emp-dm-table { margin-bottom: 0; font-size: 13px; }
        .emp-dm-table thead th {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: rgba(15, 23, 42, .65);
            border-top: 0;
            white-space: nowrap;
            padding: 0.75rem 0.85rem;
        }
        .emp-dm-table tbody td {
            vertical-align: middle;
            padding: 0.85rem;
        }
        .emp-dm-table .emp-dm-empty {
            padding: 2rem 1rem !important;
            text-align: center;
            color: #64748b;
        }
        .emp-dm-case-id {
            font-weight: 800;
            color: #64748b;
            font-variant-numeric: tabular-nums;
        }
        .emp-dm-badge {
            display: inline-flex;
            align-items: center;
            padding: 4px 10px;
            border-radius: 999px;
            font-size: 11px;
            font-weight: 800;
            white-space: nowrap;
        }
        .emp-dm-badge.open { background: rgba(14, 165, 233, .12); color: #0369a1; }
        .emp-dm-badge.investigation { background: rgba(245, 158, 11, .14); color: #b45309; }
        .emp-dm-badge.show_cause { background: rgba(239, 68, 68, .12); color: #991b1b; }
        .emp-dm-badge.verdict_pending { background: rgba(139, 92, 246, .12); color: #6d28d9; }
        .emp-dm-badge.closed { background: rgba(100, 116, 139, .14); color: #334155; }
        .emp-dm-badge.dismissed { background: rgba(34, 197, 94, .12); color: #166534; }
        .emp-dm-actions { display: inline-flex; gap: 4px; justify-content: flex-end; }
    </style>

    <div class="container-fluid emp-dm-wrap">
        <div class="row mt-3">
            <div class="col-12 col-xl-10 mx-auto">

                <div class="mb-3">
                    <h4 class="page-title mb-0">{{ __('Disciplinary cases') }}</h4>
                    <p class="text-muted mb-0 small">{{ __('View your disciplinary records and submit replies when required.') }}</p>
                </div>

                <div class="form-row mb-3">
                    <div class="col-6 col-md-4 mb-2">
                        <div class="emp-dm-stat">
                            <div class="num text-primary">{{ (int) ($dmStats->total ?? 0) }}</div>
                            <div class="lbl">{{ __('Total cases') }}</div>
                        </div>
                    </div>
                    <div class="col-6 col-md-4 mb-2">
                        <div class="emp-dm-stat">
                            <div class="num text-warning">{{ (int) ($dmStats->active ?? 0) }}</div>
                            <div class="lbl">{{ __('Active') }}</div>
                        </div>
                    </div>
                    <div class="col-12 col-md-4 mb-2">
                        <div class="emp-dm-stat">
                            <div class="num text-danger">{{ (int) ($dmStats->show_cause ?? 0) }}</div>
                            <div class="lbl">{{ __('Show cause') }}</div>
                        </div>
                    </div>
                </div>

                <div class="card">
                    <div class="card-header">
                        <i class="fas fa-gavel mr-1 text-muted"></i> {{ __('My disciplinary cases') }}
                    </div>
                    <div class="card-body p-2">
                        @if($settings?->grievance_instructions)
                            <div class="emp-dm-hint mx-2 mt-2">
                                <i class="fas fa-info-circle mr-1"></i>
                                {!! nl2br(e($settings->grievance_instructions)) !!}
                            </div>
                        @endif

                        <div class="table-responsive">
                            <table class="table table-hover emp-dm-table">
                                <thead class="thead-light">
                                <tr>
                                    <th>#</th>
                                    <th>{{ __('Category') }}</th>
                                    <th>{{ __('Incident date') }}</th>
                                    <th class="text-center">{{ __('Status') }}</th>
                                    <th class="text-right">{{ __('Action') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @forelse($rows as $c)
                                    @php
                                        $statusKey = str_replace('-', '_', (string) $c->status);
                                    @endphp
                                    <tr>
                                        <td class="emp-dm-case-id">#{{ $c->id }}</td>
                                        <td><strong>{{ $c->incident->category->name ?? '—' }}</strong></td>
                                        <td style="font-variant-numeric: tabular-nums;">
                                            {{ $c->incident->incident_date?->format('Y-m-d') ?? '—' }}
                                        </td>
                                        <td class="text-center">
                                            <span class="emp-dm-badge {{ $statusKey }}">{{ \App\Models\DisciplinaryCase::statusLabel($c->status) }}</span>
                                        </td>
                                        <td class="text-right emp-dm-actions">
                                            <a href="{{ route('employee.dm.cases.show', $c->id) }}" class="btn btn-sm btn-primary">
                                                <i class="fas fa-eye"></i> {{ __('View') }}
                                            </a>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="5" class="emp-dm-empty">{{ __('No disciplinary records.') }}</td>
                                    </tr>
                                @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                    @if($rows->hasPages())
                        <div class="card-footer">{{ $rows->links() }}</div>
                    @endif
                </div>

            </div>
        </div>
    </div>
@endsection