@extends('layouts.app')
@section('title','New Discipline Case')
@section('page-title','Discipline Management')
@section('content')
<div class="page-header">
    <div class="d-flex align-items-center gap-2 flex-wrap">
        <a href="{{ route('discipline.index') }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-arrow-left"></i></a>
        <div><h1>New Discipline Case</h1>
        <nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="{{ route('discipline.index') }}">Discipline</a></li><li class="breadcrumb-item active">New Case</li></ol></nav></div>
    </div>
</div>
<div class="row g-3">
    <div class="col-12 col-lg-8">
        <div class="card">
            <div class="card-header"><i class="bi bi-shield-exclamation me-2" style="color:var(--ul-primary);"></i>Case Information</div>
            <div class="card-body">
                <form method="POST" action="{{ route('discipline.store') }}">
                    @csrf
                    <div class="row g-3 mb-3">
                        <div class="col-12 col-sm-6">
                            <label class="form-label">Employee *</label>
                            <select name="employee_id" class="form-select" required>
                                <option value="">— Select Employee —</option>
                                @foreach($employees as $emp)
                                <option value="{{ $emp->id }}" {{ old('employee_id')==$emp->id?'selected':'' }}>{{ $emp->full_name }} ({{ $emp->employee_number }})</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12 col-sm-6">
                            <label class="form-label">Infraction Type *</label>
                            <select name="infraction_type" class="form-select" required>
                                <option value="">— Select —</option>
                                @foreach(['Attendance','Insubordination','Misconduct','Policy Violation','Harassment','Gross Negligence','Theft','Other'] as $t)
                                <option value="{{ $t }}" {{ old('infraction_type')===$t?'selected':'' }}>{{ $t }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-6">
                            <label class="form-label">Incident Date *</label>
                            <input type="date" name="incident_date" class="form-control" value="{{ old('incident_date') }}" required max="{{ today()->format('Y-m-d') }}">
                        </div>
                        <div class="col-6">
                            <label class="form-label">Location</label>
                            <input type="text" name="location" class="form-control" value="{{ old('location') }}" placeholder="e.g. Admin Building, Room 201">
                        </div>
                        <div class="col-12">
                            <label class="form-label">Description *</label>
                            <textarea name="description" class="form-control" rows="4" required placeholder="Describe the incident in full detail — date, time, what occurred, witnesses present…">{{ old('description') }}</textarea>
                        </div>
                        <div class="col-12">
                            <label class="form-label">Evidence / Witnesses</label>
                            <textarea name="evidence" class="form-control" rows="3" placeholder="List any documents, CCTV references, or witness names…">{{ old('evidence') }}</textarea>
                        </div>
                        <div class="col-12">
                            <div class="d-flex gap-4">
                                <label style="display:flex;align-items:center;gap:.5rem;font-size:.85rem;cursor:pointer;font-weight:600;">
                                    <input type="checkbox" name="hearing_required" value="1" {{ old('hearing_required')?'checked':'' }}> Formal Hearing Required
                                </label>
                                <label style="display:flex;align-items:center;gap:.5rem;font-size:.85rem;cursor:pointer;font-weight:600;">
                                    <input type="checkbox" name="immediate_suspension" value="1"> Immediate Suspension Needed
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary"><i class="bi bi-shield-exclamation me-1"></i>Create Case</button>
                        <a href="{{ route('discipline.index') }}" class="btn btn-outline-secondary">Cancel</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="col-12 col-lg-4">
        <div class="card">
            <div class="card-header" style="font-size:.85rem;"><i class="bi bi-info-circle me-2" style="color:var(--ul-primary);"></i>Discipline Process</div>
            <div class="card-body"><div class="timeline">
                <div class="timeline-item"><div class="timeline-icon bg-warning text-white"><i class="bi bi-1-circle"></i></div><div class="timeline-body"><div style="font-weight:700;font-size:.83rem;">Case Opened</div><div style="font-size:.75rem;color:var(--text-2);">HR records incident, employee notified</div></div></div>
                <div class="timeline-item"><div class="timeline-icon bg-info text-white"><i class="bi bi-2-circle"></i></div><div class="timeline-body"><div style="font-weight:700;font-size:.83rem;">Investigation</div><div style="font-size:.75rem;color:var(--text-2);">Evidence gathered, witnesses interviewed</div></div></div>
                <div class="timeline-item"><div class="timeline-icon" style="background:var(--ul-primary);color:#fff;"><i class="bi bi-3-circle"></i></div><div class="timeline-body"><div style="font-weight:700;font-size:.83rem;">Hearing (if required)</div><div style="font-size:.75rem;color:var(--text-2);">Employee given opportunity to respond</div></div></div>
                <div class="timeline-item" style="margin-bottom:0;"><div class="timeline-icon bg-success text-white"><i class="bi bi-4-circle"></i></div><div class="timeline-body"><div style="font-weight:700;font-size:.83rem;">Resolution</div><div style="font-size:.75rem;color:var(--text-2);">Warning, suspension, or termination</div></div></div>
            </div></div>
        </div>
    </div>
</div>
@endsection
