@extends('layouts.app')
@section('title', 'Command & Control Center - ICMIS')

@push('styles')
<style>
    .cc-wrap{--bg:#0f1b2d;--panel:#15263d;--line:#22344f;--muted:#8aa0bd;--txt:#e8eef6}
    .cc-wrap{background:var(--bg);margin:-2rem;padding:1.5rem;min-height:100vh;color:var(--txt)}
    .cc-head{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;margin-bottom:1.25rem}
    .cc-head h2{font-weight:700;margin:0;letter-spacing:.3px}
    .cc-head .sub{color:var(--muted);font-size:.85rem}
    .cc-clock{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.1rem}
    .cc-status{display:inline-flex;align-items:center;gap:.4rem;background:rgba(39,174,96,.15);
        color:#43d17a;border:1px solid rgba(39,174,96,.35);padding:.25rem .6rem;border-radius:20px;font-size:.78rem;font-weight:600}

    .cc-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px}
    .cc-panel>.h{padding:.7rem 1rem;border-bottom:1px solid var(--line);font-weight:600;font-size:.9rem;
        display:flex;align-items:center;justify-content:space-between}
    .cc-panel>.b{padding:1rem}

    .cc-tile{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1rem;height:100%;position:relative;overflow:hidden}
    .cc-tile .lab{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.5px;font-weight:700}
    .cc-tile .val{font-size:2rem;font-weight:800;line-height:1.1;margin-top:.2rem}
    .cc-tile .ic{position:absolute;right:.7rem;top:.7rem;font-size:1.3rem;opacity:.25}
    .cc-tile.warn{border-color:rgba(243,156,18,.5)} .cc-tile.warn .val{color:#f6b73c}
    .cc-tile.dang{border-color:rgba(231,76,60,.55)} .cc-tile.dang .val{color:#ff6b5e}
    .cc-tile.ok .val{color:#43d17a}

    .feed{max-height:320px;overflow:auto}
    .feed .row-i{display:flex;gap:.6rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
    .feed .row-i:last-child{border-bottom:none}
    .feed .dot{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.8rem}
    .d-red{background:rgba(231,76,60,.18);color:#ff6b5e}.d-amber{background:rgba(243,156,18,.18);color:#f6b73c}
    .d-blue{background:rgba(52,152,219,.18);color:#5cb3f0}.d-green{background:rgba(39,174,96,.18);color:#43d17a}

    .cc-act{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border:1px solid var(--line);border-radius:10px;
        color:var(--txt);text-decoration:none;font-size:.85rem;font-weight:600;background:rgba(255,255,255,.02);transition:all .15s}
    .cc-act:hover{background:rgba(52,152,219,.15);border-color:#3498db;color:#fff}
    .cc-act i{width:18px;text-align:center;color:#5cb3f0}

    .integ{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem;border:1px dashed var(--line);border-radius:10px;color:var(--muted)}
    .integ .badge-soon{font-size:.62rem;background:#22344f;color:#9fb4d0;padding:.1rem .4rem;border-radius:6px;margin-left:auto}
    .cc-panel .text-muted2{color:var(--muted)!important}
</style>
@endpush

@section('content')
@php
    // Branch-scoped probation incident snapshot (verified models; no controller change needed)
    $PC = \App\Models\ProbationCase::class;
    $pcIds = $PC::forCurrentBranch()->pluck('id');
    $ccBreaches = \App\Models\SupervisionBreach::whereIn('case_id', $pcIds)
        ->where(fn($q)=>$q->whereNull('action')->orWhere('action',''))->count();
    $ccPendingReports = \App\Models\CaseReport::whereIn('case_id', $pcIds)
        ->whereIn('status', ['Submitted','Under Review'])->count();
    $ccRecentBreaches = \App\Models\SupervisionBreach::whereIn('case_id', $pcIds)
        ->with('case.prisoner')->latest('reported_on')->limit(5)->get();
@endphp

<div class="cc-wrap">

    <div class="cc-head">
        <div>
            <h2><i class="fas fa-satellite-dish me-2"></i>Integrated Command &amp; Control Center</h2>
            <div class="sub">{{ optional(auth()->user())->name }} &middot; <span id="ccDate"></span></div>
        </div>
        <div class="d-flex align-items-center gap-3">
            <span class="cc-clock" id="ccClock">--:--:--</span>
            <span class="cc-status"><i class="fas fa-circle" style="font-size:.5rem"></i> Operational</span>
            <div class="form-check form-switch text-muted2 mb-0">
                <input class="form-check-input" type="checkbox" id="ccLive" checked>
                <label class="form-check-label small" for="ccLive">Live 30s</label>
            </div>
        </div>
    </div>

    {{-- LIVE STATUS TILES --}}
    <div class="row g-3 mb-3">
        <div class="col-6 col-md-2"><div class="cc-tile"><i class="fas fa-users ic"></i>
            <div class="lab">In Custody</div><div class="val">{{ number_format($currentOccupancy) }}</div></div></div>
        <div class="col-6 col-md-2"><div class="cc-tile ok"><i class="fas fa-arrow-right-to-bracket ic"></i>
            <div class="lab">Intake Today</div><div class="val">{{ number_format($todayIntake) }}</div></div></div>
        <div class="col-6 col-md-2"><div class="cc-tile"><i class="fas fa-arrow-right-from-bracket ic"></i>
            <div class="lab">Releases Today</div><div class="val">{{ number_format($todayReleases) }}</div></div></div>
        <div class="col-6 col-md-2"><div class="cc-tile warn"><i class="fas fa-truck ic"></i>
            <div class="lab">In Transit</div><div class="val">{{ number_format($activeTransfers) }}</div></div></div>
        <div class="col-6 col-md-2"><div class="cc-tile warn"><i class="fas fa-id-card ic"></i>
            <div class="lab">Pending Verify</div><div class="val">{{ number_format($pendingVerifications) }}</div></div></div>
        <div class="col-6 col-md-2"><div class="cc-tile dang"><i class="fas fa-person-walking-arrow-right ic"></i>
            <div class="lab">Knocked-Out</div><div class="val">{{ number_format($knockedOut) }}</div></div></div>
    </div>

    <div class="row g-3">
        {{-- INCIDENT & SECURITY FEED --}}
        <div class="col-lg-5">
            <div class="cc-panel">
                <div class="h"><span><i class="fas fa-triangle-exclamation text-warning me-1"></i> Incidents &amp; Security</span>
                    <span class="badge bg-danger">{{ $knockedOut + $ccBreaches }} active</span></div>
                <div class="b feed">
                    @if($knockedOut > 0)
                        <div class="row-i"><div class="dot d-red"><i class="fas fa-person-running"></i></div>
                            <div><div class="fw-semibold">{{ $knockedOut }} prisoner(s) knocked-out, not knocked-in</div>
                                <small class="text-muted2">Movement unaccounted — verify against biometric counts.</small></div></div>
                    @endif
                    @if($activeTransfers > 0)
                        <div class="row-i"><div class="dot d-amber"><i class="fas fa-truck"></i></div>
                            <div><div class="fw-semibold">{{ $activeTransfers }} transfer(s) in transit</div>
                                <small class="text-muted2">Confirm arrival at receiving station within the time limit.</small></div></div>
                    @endif
                    @forelse($ccRecentBreaches as $b)
                        <div class="row-i"><div class="dot d-red"><i class="fas fa-gavel"></i></div>
                            <div><div class="fw-semibold">Order breach — {{ optional(optional($b->case)->prisoner)->name ?? 'Case #'.$b->case_id }}</div>
                                <small class="text-muted2">{{ \Illuminate\Support\Str::limit($b->description, 70) }} · triggers warrant/discharge</small></div></div>
                    @empty
                        @if($knockedOut == 0 && $activeTransfers == 0)
                            <div class="row-i"><div class="dot d-green"><i class="fas fa-check"></i></div>
                                <div><div class="fw-semibold">No active incidents</div>
                                    <small class="text-muted2">All movements and orders accounted for.</small></div></div>
                        @endif
                    @endforelse
                </div>
            </div>
        </div>

        {{-- MOVEMENT & QUEUES --}}
        <div class="col-lg-4">
            <div class="cc-panel mb-3">
                <div class="h"><span><i class="fas fa-arrows-turn-to-dots text-info me-1"></i> Movement Control</span></div>
                <div class="b">
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Intake today</span><strong>{{ $todayIntake }}</strong></div>
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Releases today</span><strong>{{ $todayReleases }}</strong></div>
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Transfers in transit</span><strong>{{ $activeTransfers }}</strong></div>
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Verification queue</span><strong>{{ $pendingVerifications }}</strong></div>
                </div>
            </div>
            <div class="cc-panel">
                <div class="h"><span><i class="fas fa-user-shield text-primary me-1"></i> Probation Watch</span></div>
                <div class="b">
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Breaches needing warrant</span><strong class="text-danger">{{ $ccBreaches }}</strong></div>
                    <div class="d-flex justify-content-between py-1"><span class="text-muted2">Reports awaiting approval</span><strong>{{ $ccPendingReports }}</strong></div>
                </div>
            </div>
        </div>

        {{-- COMMAND ACTIONS --}}
        <div class="col-lg-3">
            <div class="cc-panel">
                <div class="h"><span><i class="fas fa-bolt text-warning me-1"></i> Command Actions</span></div>
                <div class="b d-grid gap-2">
                    <a class="cc-act" href="{{ route('prison.transfers.index') }}"><i class="fas fa-truck-ramp-box"></i> Transfers</a>
                    <a class="cc-act" href="{{ route('prison.reception.index') }}"><i class="fas fa-clipboard-check"></i> Reception desk</a>
                    <a class="cc-act" href="{{ route('prison.court-production.index') }}"><i class="fas fa-gavel"></i> Court productions</a>
                    <a class="cc-act" href="{{ route('prison.discharges.index') }}"><i class="fas fa-sign-out-alt"></i> Discharges</a>
                    <a class="cc-act" href="{{ route('reports.breaches') }}"><i class="fas fa-triangle-exclamation"></i> Breach &amp; warrant</a>
                    <a class="cc-act" href="{{ route('reports.analytics') }}"><i class="fas fa-chart-pie"></i> Analytics</a>
                </div>
            </div>
        </div>
    </div>

    {{-- INTEGRATIONS (wiring points per tender 23.0) --}}
    <div class="row g-3 mt-1">
        <div class="col-12">
            <div class="cc-panel">
                <div class="h"><span><i class="fas fa-network-wired text-info me-1"></i> Integrations &amp; Escalation</span>
                    <small class="text-muted2">tender §23.0 — to be wired to live systems</small></div>
                <div class="b">
                    <div class="row g-2">
                        <div class="col-md-4"><div class="integ"><i class="fas fa-video"></i>
                            <div><div class="fw-semibold">CCTV &amp; access control</div><small>Live feeds and door/movement events per facility.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                        <div class="col-md-4"><div class="integ"><i class="fas fa-cube"></i>
                            <div><div class="fw-semibold">3D facility view</div><small>Spatial view of every prison and accommodation unit.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                        <div class="col-md-4"><div class="integ"><i class="fas fa-tower-broadcast"></i>
                            <div><div class="fw-semibold">Agency alerts</div><small>Broadcast to CGP, RCs &amp; security agencies on breach.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                        <div class="col-md-4"><div class="integ"><i class="fas fa-location-dot"></i>
                            <div><div class="fw-semibold">GPS &amp; fleet</div><small>Transfer vehicle tracking and offender GPS.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                        <div class="col-md-4"><div class="integ"><i class="fas fa-shield-halved"></i>
                            <div><div class="fw-semibold">Penetration detection</div><small>Alert on attempted system intrusion; notify C&amp;CC + CGP.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                        <div class="col-md-4"><div class="integ"><i class="fas fa-power-off"></i>
                            <div><div class="fw-semibold">Sub-center control</div><small>Disable station command centers and assume central control.</small></div>
                            <span class="badge-soon">CONNECT</span></div></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script>
(function () {
    function tick(){
        var n = new Date();
        var c = document.getElementById('ccClock'); if (c) c.textContent = n.toLocaleTimeString();
        var d = document.getElementById('ccDate'); if (d) d.textContent = n.toLocaleDateString(undefined,{weekday:'long',year:'numeric',month:'long',day:'numeric'});
    }
    tick(); setInterval(tick, 1000);

    var live = document.getElementById('ccLive'), t = null;
    function arm(){ t = setInterval(function(){ location.reload(); }, 30000); }
    if (live.checked) arm();
    live.addEventListener('change', function(){ this.checked ? arm() : clearInterval(t); });
})();
</script>
@endpush