{{--
    Single protocol card. $p = VaProtocol with items relation eager-loaded.
    $isOwn = whether the current business owns this row (vs. system default).
--}}
<div class="pr-card">
    <div class="pr-card-head">
        <h3><i class="fa fa-syringe" style="color:#1a3a5c;"></i> {{ $p->name }}</h3>
        <span class="{{ $isOwn ? 'lbl-own' : 'lbl-system' }}">{{ $isOwn ? 'YOUR PROTOCOL' : 'SYSTEM' }}</span>
        @if($p->species)<span class="lbl-species">{{ ucfirst($p->species) }}</span>@else<span class="lbl-species">ANY SPECIES</span>@endif
        @if($p->status === 'inactive')<span class="lbl-inactive">INACTIVE</span>@endif

        <div style="display:flex;gap:5px;">
            @can('vet_admission.manage_admissions')
                <button class="btn btn-default btn-xs pr-clone" data-id="{{ $p->id }}" title="Clone to your protocols">
                    <i class="fa fa-copy"></i> Clone
                </button>
                @if($isOwn)
                    <button class="btn btn-default btn-xs pr-edit"
                            data-toggle="modal" data-target="#newProtocolModal"
                            data-id="{{ $p->id }}"
                            data-name="{{ $p->name }}"
                            data-species="{{ $p->species }}"
                            data-description="{{ $p->description }}"
                            title="Edit name / species / description">
                        <i class="fa fa-pen"></i> Edit
                    </button>
                    <button class="btn btn-default btn-xs"
                            data-toggle="modal" data-target="#addItemModal"
                            data-protocol-id="{{ $p->id }}">
                        <i class="fa fa-plus"></i> Add item
                    </button>
                    <button class="btn btn-default btn-xs pr-delete" data-id="{{ $p->id }}"
                            style="color:#b91c1c;" title="Deactivate">
                        <i class="fa fa-archive"></i>
                    </button>
                @endif
            @endcan
        </div>
    </div>

    <div class="pr-card-body">
        @if($p->description)
            <div class="pr-desc">{{ $p->description }}</div>
        @else
            <div class="pr-desc" style="background:#f8fafc;border-left-color:#cbd5e1;color:#94a3b8;font-style:italic;">
                No description set — click Edit to add one.
            </div>
        @endif

        @forelse($p->items as $it)
            @php
                $kindCls = $it->kind === 'medication' ? 'pr-kind-med'
                         : ($it->kind === 'fluid' ? 'pr-kind-fluid' : 'pr-kind-care');
                $payload = is_array($it->payload) ? $it->payload : [];
            @endphp
            <div class="pr-item">
                <div class="pr-item-kind {{ $kindCls }}">{{ str_replace('_',' ', $it->kind) }}</div>
                <div class="pr-item-body">
                    <div class="pr-item-label">{{ $it->label }}</div>
                    @if(!empty($payload))
                        <div class="pr-payload">{{ collect($payload)
                            ->map(fn($v, $k) => "$k: " . (is_array($v) ? '[' . implode(', ', $v) . ']' : $v))
                            ->implode(' · ') }}</div>
                    @endif
                </div>
                @if($isOwn)
                    @can('vet_admission.manage_admissions')
                    <button class="btn btn-xs btn-default pr-item-del" data-id="{{ $it->id }}"
                            style="color:#b91c1c;" title="Remove item">
                        <i class="fa fa-times"></i>
                    </button>
                    @endcan
                @endif
            </div>
        @empty
            <div class="pr-empty">No items in this protocol.</div>
        @endforelse
    </div>
</div>
