{{-- resources/views/probation/cases/_interventions.blade.php
     Interventions = Tool C treatment-plan areas (added automatically) + any other
     intervention the officer records. Plan-sourced entries are edited in Tool C;
     here their type and progress are updated. --}}
@php
    $types    = config('probation_supervision.intervention_types');
    $statuses = config('probation_supervision.intervention_statuses');
    $fromPlan = $case->interventions->filter(fn ($i) => $i->treatment_plan_item_id)->sortBy('id');
    $own      = $case->interventions->reject(fn ($i) => $i->treatment_plan_item_id)->sortByDesc('id');
    $badge    = ['planned' => 'bg-secondary', 'ongoing' => 'bg-primary', 'completed' => 'bg-success'];
    $count    = $case->interventions->groupBy('status')->map->count();
@endphp

<div class="card tab-card"><div class="card-body">
    <div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
        <h6 class="text-uppercase small text-muted mb-0">Interventions</h6>
        <div class="small">
            @foreach($statuses as $k => $l)<span class="badge {{ $badge[$k] }} me-1">{{ $l }}: {{ $count[$k] ?? 0 }}</span>@endforeach
        </div>
    </div>

    {{-- ---------- from the treatment plan ---------- --}}
    <div class="d-flex justify-content-between align-items-center mb-1">
        <div class="fw-bold small"><i class="fas fa-clipboard-list text-primary"></i> From the treatment plan (Tool C)</div>
        <button type="button" class="btn btn-link btn-sm p-0" onclick="var b=document.querySelector('[data-bs-target=&quot;#t-superv&quot;]'); if(b){bootstrap.Tab.getOrCreateInstance(b).show(); var s=document.querySelector('[data-bs-target=&quot;#sv-plan&quot;]'); if(s) bootstrap.Tab.getOrCreateInstance(s).show();}">
            <i class="fas fa-pen"></i> Edit treatment plan</button>
    </div>
    @if($fromPlan->isEmpty())
        <p class="text-muted mini">Nothing yet — areas saved in Supervision → Treatment Plan (Tool C) appear here automatically.</p>
    @else
        <div class="table-responsive"><table class="table table-sm align-middle mini mb-3">
            <thead class="table-light"><tr><th>Area</th><th>Needs</th><th>Action plan</th><th>Time frame</th><th>Responsible</th><th style="width:270px">Type · Progress</th></tr></thead>
            <tbody>
            @foreach($fromPlan as $iv)
                <tr>
                    <td><strong>{{ $iv->area_title }}</strong></td>
                    <td style="white-space:pre-line">{{ $iv->description }}</td>
                    <td style="white-space:pre-line">{{ $iv->interventions_used }}</td>
                    <td>{{ $iv->time_frame }}</td>
                    <td>{{ $iv->provider }}</td>
                    <td>
                        <form method="POST" action="{{ route('probation.supervision.intervention.update', $iv->id) }}" class="d-flex gap-1">
                            @csrf @method('PUT')
                            <select name="plan_type" class="form-select form-select-sm">
                                @foreach($types as $k => $l)<option value="{{ $k }}" {{ $iv->plan_type === $k ? 'selected' : '' }}>{{ $l }}</option>@endforeach
                            </select>
                            <select name="status" class="form-select form-select-sm" onchange="this.form.submit()">
                                @foreach($statuses as $k => $l)<option value="{{ $k }}" {{ $iv->status === $k ? 'selected' : '' }}>{{ $l }}</option>@endforeach
                            </select>
                            <button class="btn btn-sm btn-outline-primary" title="Save"><i class="fas fa-check"></i></button>
                        </form>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table></div>
    @endif

    {{-- ---------- other interventions ---------- --}}
    <div class="fw-bold small mb-1"><i class="fas fa-hand-holding-medical text-success"></i> Other interventions</div>
    @forelse($own as $iv)
        <div class="border-bottom py-2 mini">
            <div class="d-flex justify-content-between align-items-start gap-2">
                <div>
                    <strong>{{ $types[$iv->plan_type] ?? ucwords($iv->plan_type) }}</strong>@if($iv->area_title) — {{ $iv->area_title }}@endif
                    <span class="badge {{ $badge[$iv->status] ?? 'bg-secondary' }}">{{ $statuses[$iv->status] ?? $iv->status }}</span>
                    @if($iv->description)<div style="white-space:pre-line">{{ $iv->description }}</div>@endif
                    <div class="text-muted">
                        @if($iv->interventions_used)Action: {{ $iv->interventions_used }} · @endif
                        @if($iv->time_frame)Time frame: {{ $iv->time_frame }} · @endif
                        {{ $iv->provider }}
                    </div>
                </div>
                <div class="d-flex gap-1 flex-shrink-0">
                    <button type="button" class="btn btn-sm btn-outline-secondary" data-bs-toggle="collapse" data-bs-target="#ivEdit{{ $iv->id }}" title="Edit"><i class="fas fa-edit"></i></button>
                    <form method="POST" action="{{ route('probation.supervision.intervention.destroy', $iv->id) }}" onsubmit="return confirm('Delete this intervention?')">
                        @csrf @method('DELETE')
                        <button class="btn btn-sm btn-outline-danger" title="Delete"><i class="fas fa-trash"></i></button>
                    </form>
                </div>
            </div>
            <form method="POST" action="{{ route('probation.supervision.intervention.update', $iv->id) }}" class="collapse row g-2 mt-1" id="ivEdit{{ $iv->id }}">
                @csrf @method('PUT')
                <div class="col-md-3"><select name="plan_type" class="form-select form-select-sm">
                    @foreach($types as $k => $l)<option value="{{ $k }}" {{ $iv->plan_type === $k ? 'selected' : '' }}>{{ $l }}</option>@endforeach</select></div>
                <div class="col-md-3"><select name="status" class="form-select form-select-sm">
                    @foreach($statuses as $k => $l)<option value="{{ $k }}" {{ $iv->status === $k ? 'selected' : '' }}>{{ $l }}</option>@endforeach</select></div>
                <div class="col-md-6"><input name="area_title" class="form-control form-control-sm" value="{{ $iv->area_title }}" placeholder="Area / focus"></div>
                <div class="col-md-6"><textarea name="description" rows="2" class="form-control form-control-sm" placeholder="Description / need">{{ $iv->description }}</textarea></div>
                <div class="col-md-6"><textarea name="interventions_used" rows="2" class="form-control form-control-sm" placeholder="Action / intervention used">{{ $iv->interventions_used }}</textarea></div>
                <div class="col-md-4"><input name="time_frame" class="form-control form-control-sm" value="{{ $iv->time_frame }}" placeholder="Time frame"></div>
                <div class="col-md-6"><input name="provider" class="form-control form-control-sm" value="{{ $iv->provider }}" placeholder="Provider / responsible"></div>
                <div class="col-md-2"><button class="btn btn-sm btn-primary w-100">Save</button></div>
            </form>
        </div>
    @empty<p class="text-muted mini">No other interventions.</p>@endforelse

    <form method="POST" action="{{ route('probation.cases.intervention.store', $case->id) }}" class="row g-2 mt-2 border-top pt-2">
        @csrf
        <div class="col-12 small fw-bold">Add another intervention</div>
        <div class="col-md-3"><select name="plan_type" class="form-select form-select-sm" required>
            @foreach($types as $k => $l)<option value="{{ $k }}">{{ $l }}</option>@endforeach</select></div>
        <div class="col-md-4"><input name="area_title" class="form-control form-control-sm" placeholder="Area / focus (optional)"></div>
        <div class="col-md-5"><input name="description" class="form-control form-control-sm" placeholder="Description / need"></div>
        <div class="col-md-5"><input name="interventions_used" class="form-control form-control-sm" placeholder="Action / intervention used"></div>
        <div class="col-md-2"><input name="time_frame" class="form-control form-control-sm" placeholder="Time frame"></div>
        <div class="col-md-3"><input name="provider" class="form-control form-control-sm" placeholder="Provider / responsible"></div>
        <div class="col-md-2"><button class="btn btn-sm btn-primary w-100"><i class="fas fa-plus"></i> Add</button></div>
    </form>
</div></div>