@extends('layouts.admin')

@section('page_kicker', 'Access control')
@section('page_title', 'Staff roles (permissions)')

@section('content')
    <p class="text-sm text-slate-600">Adjust which Spatie permissions apply to <strong>doctor</strong>, <strong>pharmacist</strong>, <strong>nurse</strong>, <strong>receptionist</strong>, and <strong>patient</strong> for your workflows. Only a safe subset plus your <code class="rounded bg-slate-100 px-1 font-mono text-xs">hospital.*</code> keys are available.</p>
    <div class="mt-4">
        <a href="{{ route('hospital.rbac.permissions.index') }}" class="admin-btn-secondary">Custom permissions</a>
    </div>

    <div class="admin-content-card mt-6 space-y-3">
        @foreach($roles as $role)
            <div class="flex flex-wrap items-center justify-between gap-3 rounded-xl border border-slate-100 bg-slate-50/80 px-4 py-3">
                <div>
                    <p class="font-semibold capitalize text-slate-900">{{ $role->name }}</p>
                    <p class="text-xs text-slate-500">{{ $role->permissions_count }} permissions</p>
                </div>
                <a href="{{ route('hospital.rbac.roles.edit', $role) }}" class="admin-btn-primary text-xs py-2">Edit permissions</a>
            </div>
        @endforeach
    </div>
@endsection