import { t as AdminLayout_default } from "./AdminLayout-DcKfAlG1.js";
import { Head, router, useForm, usePage } from "@inertiajs/vue3";
import { Fragment, computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderList, toDisplayString, unref, useSSRContext, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
import { ssrIncludeBooleanAttr, ssrInterpolate, ssrRenderAttr, ssrRenderClass, ssrRenderComponent, ssrRenderList } from "vue/server-renderer";
import { AlertCircle, Check, Edit3, Key, Lock, Plus, Save, Search, Shield, ShieldAlert, Trash2 } from "lucide-vue-next";
//#region resources/js/Pages/Rbac/Index.vue?vue&type=script&setup=true&lang.ts
var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
	__name: "Index",
	__ssrInlineRender: true,
	props: {
		roles: {},
		permissions: {}
	},
	setup(__props) {
		const props = __props;
		const currentTab = ref("roles");
		const permissionSearch = ref("");
		const filteredPermissions = computed(() => {
			const search = permissionSearch.value.toLowerCase().trim();
			if (!search) return props.permissions;
			return props.permissions.filter((p) => p.name.toLowerCase().includes(search) || p.category.toLowerCase().includes(search));
		});
		const getRolesForPermission = (permissionName) => {
			return props.roles.filter((role) => role.permissions.includes(permissionName));
		};
		const activeRoleId = ref(props.roles[0]?.id || 0);
		const activeRole = computed(() => {
			return props.roles.find((r) => r.id === activeRoleId.value) || null;
		});
		const permissionsByCategory = computed(() => {
			const groups = {};
			props.permissions.forEach((p) => {
				if (!groups[p.category]) groups[p.category] = [];
				groups[p.category].push(p);
			});
			return groups;
		});
		const isCreatingRole = ref(false);
		const isDeletingRole = ref(false);
		const newRoleForm = useForm({ name: "" });
		const editPermissionsForm = useForm({
			name: "",
			permissions: []
		});
		const isCreatingPermission = ref(false);
		const isEditingPermission = ref(false);
		const isDeletingPermission = ref(false);
		const permissionToEdit = ref(null);
		const permissionToDelete = ref(null);
		const newPermissionForm = useForm({ name: "" });
		const editPermissionForm = useForm({ name: "" });
		const page = usePage();
		watch(activeRole, (newRole) => {
			if (newRole) {
				editPermissionsForm.name = newRole.name;
				editPermissionsForm.permissions = [...newRole.permissions];
				editPermissionsForm.clearErrors();
			}
		}, { immediate: true });
		const selectRole = (id) => {
			activeRoleId.value = id;
		};
		const createRole = () => {
			newRoleForm.post(route("rbac.store"), { onSuccess: () => {
				isCreatingRole.value = false;
				newRoleForm.reset();
				if (props.roles.length > 0) {
					const latestRole = props.roles[props.roles.length - 1];
					if (latestRole) activeRoleId.value = latestRole.id;
				}
			} });
		};
		const saveRoleSettings = () => {
			if (!activeRole.value) return;
			editPermissionsForm.put(route("rbac.update", activeRole.value.id), { onSuccess: () => {
				editPermissionsForm.defaults();
			} });
		};
		const deleteRole = () => {
			if (!activeRole.value) return;
			router.delete(route("rbac.destroy", activeRole.value.id), { onSuccess: () => {
				isDeletingRole.value = false;
				if (props.roles.length > 0) activeRoleId.value = props.roles[0].id;
			} });
		};
		const togglePermission = (permissionName) => {
			if (activeRole.value?.name === "Super Admin") return;
			const idx = editPermissionsForm.permissions.indexOf(permissionName);
			if (idx > -1) editPermissionsForm.permissions.splice(idx, 1);
			else editPermissionsForm.permissions.push(permissionName);
		};
		const isPermissionSelected = (permissionName) => {
			if (activeRole.value?.name === "Super Admin") return true;
			return editPermissionsForm.permissions.includes(permissionName);
		};
		const createPermission = () => {
			newPermissionForm.post(route("rbac.permissions.store"), { onSuccess: () => {
				isCreatingPermission.value = false;
				newPermissionForm.reset();
			} });
		};
		const openEditPermissionModal = (permission) => {
			permissionToEdit.value = permission;
			editPermissionForm.name = permission.name;
			editPermissionForm.clearErrors();
			isEditingPermission.value = true;
		};
		const updatePermission = () => {
			if (!permissionToEdit.value) return;
			editPermissionForm.put(route("rbac.permissions.update", permissionToEdit.value.id), { onSuccess: () => {
				isEditingPermission.value = false;
				permissionToEdit.value = null;
				editPermissionForm.reset();
			} });
		};
		const openDeletePermissionModal = (permission) => {
			permissionToDelete.value = permission;
			isDeletingPermission.value = true;
		};
		const deletePermission = () => {
			if (!permissionToDelete.value) return;
			router.delete(route("rbac.permissions.destroy", permissionToDelete.value.id), { onSuccess: () => {
				isDeletingPermission.value = false;
				permissionToDelete.value = null;
			} });
		};
		return (_ctx, _push, _parent, _attrs) => {
			_push(`<!--[-->`);
			_push(ssrRenderComponent(unref(Head), { title: "Roles & Permissions" }, null, _parent));
			_push(ssrRenderComponent(AdminLayout_default, null, {
				default: withCtx((_, _push, _parent, _scopeId) => {
					if (_push) {
						_push(`<div class="space-y-6"${_scopeId}><div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between"${_scopeId}><div${_scopeId}><h1 class="text-2xl font-bold tracking-tight text-slate-900 dark:text-slate-50"${_scopeId}>Roles &amp; Permissions</h1><p class="text-sm text-slate-500 dark:text-slate-400 mt-1"${_scopeId}> Configure security access control levels, user groups, and capability guards. </p></div></div>`);
						if (unref(page).props.flash?.success) {
							_push(`<div class="bg-emerald-50 dark:bg-emerald-950/30 border border-emerald-200 dark:border-emerald-900/50 text-emerald-800 dark:text-emerald-400 rounded-xl p-4 text-sm flex items-center gap-3"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Check), { class: "h-5 w-5 text-emerald-600 dark:text-emerald-400 shrink-0" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>${ssrInterpolate(unref(page).props.flash?.success)}</span></div>`);
						} else _push(`<!---->`);
						if (unref(page).props.flash?.error) {
							_push(`<div class="bg-rose-50 dark:bg-rose-950/30 border border-rose-200 dark:border-rose-900/50 text-rose-800 dark:text-rose-400 rounded-xl p-4 text-sm flex items-center gap-3"${_scopeId}>`);
							_push(ssrRenderComponent(unref(AlertCircle), { class: "h-5 w-5 text-rose-600 dark:text-rose-400 shrink-0" }, null, _parent, _scopeId));
							_push(`<span${_scopeId}>${ssrInterpolate(unref(page).props.flash?.error)}</span></div>`);
						} else _push(`<!---->`);
						_push(`<div class="flex border-b border-slate-200 dark:border-slate-800"${_scopeId}><button class="${ssrRenderClass(["px-4 py-2.5 text-sm font-medium border-b-2 transition-all cursor-pointer focus:outline-none", currentTab.value === "roles" ? "border-red-600 text-red-650 dark:border-red-400 dark:text-red-450 font-semibold" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"])}"${_scopeId}> Role Permissions Matrix </button><button class="${ssrRenderClass(["px-4 py-2.5 text-sm font-medium border-b-2 transition-all cursor-pointer focus:outline-none", currentTab.value === "permissions" ? "border-red-600 text-red-650 dark:border-red-400 dark:text-red-450 font-semibold" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"])}"${_scopeId}> Permissions Manager </button></div>`);
						if (currentTab.value === "roles") {
							_push(`<div class="grid grid-cols-1 lg:grid-cols-12 gap-6 items-start animate-in fade-in duration-200"${_scopeId}><div class="lg:col-span-4 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-4 shadow-sm space-y-4"${_scopeId}><div class="flex items-center justify-between"${_scopeId}><h3 class="text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider"${_scopeId}>Security Roles</h3><button class="inline-flex items-center gap-1 text-xs font-semibold text-red-600 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Plus), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
							_push(` Add Role </button></div>`);
							if (isCreatingRole.value) {
								_push(`<div class="border border-slate-200 dark:border-slate-800 rounded-lg p-3 bg-slate-50 dark:bg-slate-900/40 animate-in slide-in-from-top-2 duration-200"${_scopeId}><form class="space-y-3"${_scopeId}><div class="space-y-1"${_scopeId}><label for="role-name-input" class="block text-[10px] font-semibold uppercase text-slate-400"${_scopeId}>Role Name</label><input id="role-name-input"${ssrRenderAttr("value", unref(newRoleForm).name)} type="text" required placeholder="e.g. Moderator" class="w-full px-3 py-1.5 text-xs bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-1 focus:ring-red-500 transition-all"${_scopeId}>`);
								if (unref(newRoleForm).errors.name) _push(`<span class="text-[10px] text-red-600 dark:text-red-400 font-medium block"${_scopeId}>${ssrInterpolate(unref(newRoleForm).errors.name)}</span>`);
								else _push(`<!---->`);
								_push(`</div><div class="flex items-center justify-end gap-2 text-xs"${_scopeId}><button type="button" class="px-2.5 py-1 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300"${_scopeId}> Cancel </button><button type="submit"${ssrIncludeBooleanAttr(unref(newRoleForm).processing) ? " disabled" : ""} class="px-2.5 py-1 text-white bg-red-600 hover:bg-red-700 rounded-md font-semibold disabled:opacity-50"${_scopeId}> Create </button></div></form></div>`);
							} else _push(`<!---->`);
							_push(`<div class="space-y-1 max-h-[60vh] overflow-y-auto"${_scopeId}><!--[-->`);
							ssrRenderList(__props.roles, (role) => {
								_push(`<button class="${ssrRenderClass(["w-full text-left px-3 py-2.5 rounded-lg flex items-center justify-between border transition-all duration-200", activeRoleId.value === role.id ? "bg-red-50/70 border-red-200 dark:bg-red-950/20 dark:border-red-900/40 text-red-900 dark:text-red-200 font-semibold" : "bg-transparent border-transparent hover:bg-slate-50 dark:hover:bg-slate-900/50 text-slate-700 dark:text-slate-350"])}"${_scopeId}><span class="text-sm capitalize flex items-center gap-2"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Shield), { class: ["h-4 w-4 shrink-0 text-slate-400", { "text-red-500": activeRoleId.value === role.id }] }, null, _parent, _scopeId));
								_push(` ${ssrInterpolate(role.name)}</span>`);
								if (role.is_system) _push(`<span class="text-[9px] font-semibold px-1.5 py-0.5 rounded bg-slate-100 text-slate-500 border border-slate-200/55 dark:bg-slate-900 dark:text-slate-400 dark:border-slate-800"${_scopeId}> SYSTEM </span>`);
								else _push(`<!---->`);
								_push(`</button>`);
							});
							_push(`<!--]--></div></div>`);
							if (activeRole.value) {
								_push(`<div class="lg:col-span-8 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-6 shadow-sm space-y-6"${_scopeId}><div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between border-b border-slate-200 dark:border-slate-800 pb-4"${_scopeId}><div class="space-y-1"${_scopeId}><div class="flex items-center gap-2"${_scopeId}><h2 class="text-lg font-bold text-slate-900 dark:text-slate-50 capitalize"${_scopeId}>${ssrInterpolate(activeRole.value.name)} Role</h2>`);
								if (activeRole.value.is_system) _push(ssrRenderComponent(unref(Lock), {
									class: "h-4 w-4 text-slate-400",
									title: "System protected role"
								}, null, _parent, _scopeId));
								else _push(`<!---->`);
								_push(`</div><p class="text-xs text-slate-400 dark:text-slate-500"${_scopeId}> Set capabilities and permission gates for users belonging to this security level. </p></div>`);
								if (!activeRole.value.is_system) {
									_push(`<div class="flex items-center gap-2"${_scopeId}><button class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-xs font-semibold border border-red-200 dark:border-red-950 bg-red-50 dark:bg-red-950/20 text-red-600 dark:text-red-400 hover:bg-red-100 dark:hover:bg-red-950/40 transition-colors"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
									_push(` Delete Role </button></div>`);
								} else _push(`<!---->`);
								_push(`</div>`);
								if (activeRole.value.name === "Super Admin") {
									_push(`<div class="bg-slate-900 dark:bg-slate-50 text-slate-200 dark:text-slate-900 rounded-xl p-4 border border-slate-800 dark:border-slate-200 text-xs flex gap-3 leading-relaxed"${_scopeId}>`);
									_push(ssrRenderComponent(unref(ShieldAlert), { class: "h-5 w-5 text-red-500 dark:text-red-600 shrink-0" }, null, _parent, _scopeId));
									_push(`<div${_scopeId}><span class="font-bold block mb-0.5"${_scopeId}>Super Admin Gate Bypass Enabled</span> The Super Admin role inherently bypasses all authorization gate checks. System permissions are fully enabled and cannot be revoked to prevent lockout. </div></div>`);
								} else _push(`<!---->`);
								if (!activeRole.value.is_system) {
									_push(`<div class="space-y-2 max-w-sm"${_scopeId}><label for="edit-role-name" class="block text-xs font-semibold uppercase text-slate-400"${_scopeId}>Rename Role</label><div class="flex items-center gap-2"${_scopeId}><div class="relative flex-1"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Edit3), { class: "absolute left-3 top-2.5 h-4 w-4 text-slate-400" }, null, _parent, _scopeId));
									_push(`<input id="edit-role-name"${ssrRenderAttr("value", unref(editPermissionsForm).name)} type="text" required class="w-full pl-9 pr-4 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}></div></div>`);
									if (unref(editPermissionsForm).errors.name) _push(`<span class="text-xs text-red-600 dark:text-red-400 font-medium"${_scopeId}>${ssrInterpolate(unref(editPermissionsForm).errors.name)}</span>`);
									else _push(`<!---->`);
									_push(`</div>`);
								} else _push(`<!---->`);
								_push(`<div class="space-y-6"${_scopeId}><h3 class="text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider"${_scopeId}>Configure Permissions</h3><div class="space-y-6"${_scopeId}><!--[-->`);
								ssrRenderList(permissionsByCategory.value, (perms, category) => {
									_push(`<div class="space-y-3"${_scopeId}><span class="text-xs font-bold text-slate-700 dark:text-slate-355 block border-b border-slate-100 dark:border-slate-900 pb-1.5 capitalize font-semibold"${_scopeId}>${ssrInterpolate(category)} Permissions </span><div class="grid grid-cols-1 md:grid-cols-2 gap-3"${_scopeId}><!--[-->`);
									ssrRenderList(perms, (perm) => {
										_push(`<div class="${ssrRenderClass([
											"border rounded-xl p-3.5 flex items-center justify-between select-none transition-all duration-200",
											activeRole.value.name === "Super Admin" ? "cursor-not-allowed opacity-80" : "cursor-pointer",
											isPermissionSelected(perm.name) ? "bg-red-50/30 border-red-200 dark:bg-red-950/10 dark:border-red-900/30" : "bg-white dark:bg-slate-950 border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/50"
										])}"${_scopeId}><div class="space-y-0.5"${_scopeId}><span class="text-sm font-semibold text-slate-900 dark:text-slate-100 capitalize"${_scopeId}>${ssrInterpolate(perm.name.replace("-", " "))}</span><span class="text-[10px] text-slate-400 dark:text-slate-500 block font-mono"${_scopeId}>${ssrInterpolate(perm.name)}</span></div><div class="${ssrRenderClass(["h-5 w-5 rounded border flex items-center justify-center transition-all", isPermissionSelected(perm.name) ? "bg-red-500 border-red-500 text-white" : "border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-900"])}"${_scopeId}>`);
										if (isPermissionSelected(perm.name)) _push(ssrRenderComponent(unref(Check), { class: "h-3.5 w-3.5 stroke-[3]" }, null, _parent, _scopeId));
										else _push(`<!---->`);
										_push(`</div></div>`);
									});
									_push(`<!--]--></div></div>`);
								});
								_push(`<!--]--></div></div>`);
								if (activeRole.value.name !== "Super Admin") {
									_push(`<div class="flex justify-end pt-4 border-t border-slate-200 dark:border-slate-800"${_scopeId}><button${ssrIncludeBooleanAttr(unref(editPermissionsForm).processing) ? " disabled" : ""} class="inline-flex items-center gap-2 px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 disabled:opacity-50"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Save), { class: "h-4 w-4" }, null, _parent, _scopeId));
									if (unref(editPermissionsForm).processing) _push(`<span${_scopeId}>Saving settings...</span>`);
									else _push(`<span${_scopeId}>Save Role settings</span>`);
									_push(`</button></div>`);
								} else _push(`<!---->`);
								_push(`</div>`);
							} else _push(`<!---->`);
							_push(`</div>`);
						} else if (currentTab.value === "permissions") {
							_push(`<div class="space-y-6 animate-in fade-in duration-200"${_scopeId}><div class="bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-6 shadow-sm space-y-6"${_scopeId}><div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4"${_scopeId}><div class="relative max-w-md w-full"${_scopeId}><span class="absolute left-3 top-2.5 text-slate-400"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Search), { class: "h-4.5 w-4.5" }, null, _parent, _scopeId));
							_push(`</span><input${ssrRenderAttr("value", permissionSearch.value)} type="text" placeholder="Search permissions by name or category..." class="w-full pl-9 pr-4 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"${_scopeId}></div><button class="inline-flex items-center justify-center gap-2 px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer whitespace-nowrap"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Plus), { class: "h-4 w-4" }, null, _parent, _scopeId));
							_push(` Add Permission </button></div><div class="border border-slate-200 dark:border-slate-800 rounded-xl overflow-hidden bg-white dark:bg-slate-950"${_scopeId}><div class="overflow-x-auto"${_scopeId}><table class="w-full text-left border-collapse"${_scopeId}><thead${_scopeId}><tr class="bg-slate-50 dark:bg-slate-900/60 text-xs font-semibold uppercase tracking-wider text-slate-500 border-b border-slate-200 dark:border-slate-800"${_scopeId}><th class="px-6 py-3.5"${_scopeId}>Permission Name</th><th class="px-6 py-3.5"${_scopeId}>Category</th><th class="px-6 py-3.5"${_scopeId}>Assigned Roles</th><th class="px-6 py-3.5"${_scopeId}>Type</th><th class="px-6 py-3.5 text-right"${_scopeId}>Actions</th></tr></thead><tbody class="divide-y divide-slate-100 dark:divide-slate-900 text-sm"${_scopeId}>`);
							if (filteredPermissions.value.length === 0) _push(`<tr${_scopeId}><td colspan="5" class="px-6 py-10 text-center text-slate-500 dark:text-slate-400 italic"${_scopeId}> No permissions found. </td></tr>`);
							else _push(`<!---->`);
							_push(`<!--[-->`);
							ssrRenderList(filteredPermissions.value, (perm) => {
								_push(`<tr class="hover:bg-slate-50/50 dark:hover:bg-slate-900/20 transition-colors"${_scopeId}><td class="px-6 py-4 font-semibold text-slate-900 dark:text-slate-100"${_scopeId}><div class="flex items-center gap-2"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Key), { class: "h-4 w-4 text-slate-400 shrink-0" }, null, _parent, _scopeId));
								_push(`<span${_scopeId}>${ssrInterpolate(perm.name)}</span></div></td><td class="px-6 py-4 whitespace-nowrap"${_scopeId}><span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-slate-100 dark:bg-slate-900 text-slate-600 dark:text-slate-400 border border-slate-200/40 dark:border-slate-800"${_scopeId}>${ssrInterpolate(perm.category)}</span></td><td class="px-6 py-4"${_scopeId}><div class="flex flex-wrap gap-1.5"${_scopeId}>`);
								if (getRolesForPermission(perm.name).length === 0) _push(`<span class="text-xs text-slate-400 italic"${_scopeId}>None</span>`);
								else _push(`<!---->`);
								_push(`<!--[-->`);
								ssrRenderList(getRolesForPermission(perm.name), (role) => {
									_push(`<span class="${ssrRenderClass(["inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-semibold border", role.name === "Super Admin" || role.name === "Admin" ? "bg-red-50 text-red-700 border-red-100 dark:bg-red-950/20 dark:text-red-400 dark:border-red-900/40" : "bg-slate-100 text-slate-700 border-slate-200 dark:bg-slate-900 dark:text-slate-350 dark:border-slate-800"])}"${_scopeId}>${ssrInterpolate(role.name)}</span>`);
								});
								_push(`<!--]--></div></td><td class="px-6 py-4 whitespace-nowrap"${_scopeId}>`);
								if (perm.is_system) _push(`<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold bg-slate-100 text-slate-500 border border-slate-200/50 dark:bg-slate-900 dark:text-slate-400 dark:border-slate-800"${_scopeId}> System Core </span>`);
								else _push(`<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold bg-emerald-50 text-emerald-700 border border-emerald-100 dark:bg-emerald-950/20 dark:text-emerald-450 dark:border-emerald-900/40"${_scopeId}> Custom </span>`);
								_push(`</td><td class="px-6 py-4 whitespace-nowrap text-right"${_scopeId}><div class="flex items-center justify-end gap-2"${_scopeId}>`);
								if (perm.is_system) _push(ssrRenderComponent(unref(Lock), {
									class: "h-4 w-4 text-slate-400",
									title: "System permissions are locked"
								}, null, _parent, _scopeId));
								else {
									_push(`<!--[--><button class="p-1 rounded-lg text-slate-505 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-900 dark:hover:text-slate-200 transition-colors cursor-pointer" title="Rename Permission"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Edit3), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
									_push(`</button><button class="p-1 rounded-lg text-slate-400 hover:bg-red-50 dark:hover:bg-red-950/20 hover:text-red-650 transition-colors cursor-pointer" title="Delete Permission"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
									_push(`</button><!--]-->`);
								}
								_push(`</div></td></tr>`);
							});
							_push(`<!--]--></tbody></table></div></div></div></div>`);
						} else _push(`<!---->`);
						_push(`</div>`);
						if (isDeletingRole.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"${_scopeId}><div class="fixed inset-0 bg-slate-950/60 backdrop-blur-sm"${_scopeId}></div><div class="relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200"${_scopeId}><div class="p-6 text-center space-y-4"${_scopeId}><div class="mx-auto h-12 w-12 rounded-full bg-red-50 dark:bg-red-905/30 flex items-center justify-center border border-red-100 dark:border-red-900/50 text-red-600 dark:text-red-400"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Trash2), { class: "h-6 w-6" }, null, _parent, _scopeId));
							_push(`</div><div class="space-y-1"${_scopeId}><h3 class="text-base font-bold text-slate-900 dark:text-slate-50"${_scopeId}>Delete Security Role</h3><p class="text-sm text-slate-500 dark:text-slate-400 leading-normal"${_scopeId}> Are you sure you want to delete the security role <span class="font-semibold text-slate-900 dark:text-slate-50 capitalize"${_scopeId}>${ssrInterpolate(activeRole.value?.name)}</span>? Users currently assigned to this role will lose its permissions. </p></div></div><div class="px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end gap-3 bg-slate-50/50 dark:bg-slate-900/50"${_scopeId}><button type="button" class="px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors"${_scopeId}> Cancel </button><button type="button" class="px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2"${_scopeId}> Yes, Delete Role </button></div></div></div>`);
						} else _push(`<!---->`);
						if (isCreatingPermission.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"${_scopeId}><div class="fixed inset-0 bg-slate-950/60 backdrop-blur-sm"${_scopeId}></div><div class="relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between bg-slate-50/50 dark:bg-slate-900/50"${_scopeId}><h3 class="text-base font-semibold text-slate-900 dark:text-slate-50"${_scopeId}>Add Security Permission</h3><button class="rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-650 cursor-pointer text-xl"${_scopeId}> × </button></div><form class="space-y-4 p-6"${_scopeId}><div class="space-y-1.5"${_scopeId}><label for="perm-name" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Permission Name</label><input id="perm-name"${ssrRenderAttr("value", unref(newPermissionForm).name)} type="text" required placeholder="e.g. view analytics" class="w-full px-3 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"${_scopeId}>`);
							if (unref(newPermissionForm).errors.name) _push(`<span class="text-xs text-red-600 dark:text-red-400 font-medium block mt-1"${_scopeId}>${ssrInterpolate(unref(newPermissionForm).errors.name)}</span>`);
							else _push(`<!---->`);
							_push(`</div><div class="flex justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-900"${_scopeId}><button type="button" class="px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-300 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors focus:outline-none cursor-pointer"${_scopeId}> Cancel </button><button type="submit"${ssrIncludeBooleanAttr(unref(newPermissionForm).processing) ? " disabled" : ""} class="px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:ring-offset-2 disabled:opacity-50 cursor-pointer"${_scopeId}> Create </button></div></form></div></div>`);
						} else _push(`<!---->`);
						if (isEditingPermission.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"${_scopeId}><div class="fixed inset-0 bg-slate-950/60 backdrop-blur-sm"${_scopeId}></div><div class="relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200"${_scopeId}><div class="px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between bg-slate-50/50 dark:bg-slate-900/50"${_scopeId}><h3 class="text-base font-semibold text-slate-900 dark:text-slate-50"${_scopeId}>Rename Permission</h3><button class="rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-650 cursor-pointer text-xl"${_scopeId}> × </button></div><form class="space-y-4 p-6"${_scopeId}><div class="space-y-1.5"${_scopeId}><label for="edit-perm-name" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Permission Name</label><input id="edit-perm-name"${ssrRenderAttr("value", unref(editPermissionForm).name)} type="text" required class="w-full px-3 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-900 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"${_scopeId}>`);
							if (unref(editPermissionForm).errors.name) _push(`<span class="text-xs text-red-600 dark:text-red-400 font-medium block mt-1"${_scopeId}>${ssrInterpolate(unref(editPermissionForm).errors.name)}</span>`);
							else _push(`<!---->`);
							_push(`</div><div class="flex justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-900"${_scopeId}><button type="button" class="px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors focus:outline-none cursor-pointer"${_scopeId}> Cancel </button><button type="submit"${ssrIncludeBooleanAttr(unref(editPermissionForm).processing) ? " disabled" : ""} class="px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 disabled:opacity-50 cursor-pointer"${_scopeId}> Save Changes </button></div></form></div></div>`);
						} else _push(`<!---->`);
						if (isDeletingPermission.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"${_scopeId}><div class="fixed inset-0 bg-slate-950/60 backdrop-blur-sm"${_scopeId}></div><div class="relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200"${_scopeId}><div class="p-6 text-center space-y-4"${_scopeId}><div class="mx-auto h-12 w-12 rounded-full bg-red-50 dark:bg-red-905/30 flex items-center justify-center border border-red-100 dark:border-red-900/50 text-red-600 dark:text-red-400"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Trash2), { class: "h-6 w-6" }, null, _parent, _scopeId));
							_push(`</div><div class="space-y-1"${_scopeId}><h3 class="text-base font-bold text-slate-900 dark:text-slate-50"${_scopeId}>Delete Security Permission</h3><p class="text-sm text-slate-500 dark:text-slate-400 leading-normal"${_scopeId}> Are you sure you want to delete the permission <span class="font-semibold text-slate-900 dark:text-slate-50 font-mono"${_scopeId}>${ssrInterpolate(permissionToDelete.value?.name)}</span>? This will permanently remove it from the system and detach it from all roles. </p></div></div><div class="px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end gap-3 bg-slate-50/50 dark:bg-slate-900/50"${_scopeId}><button type="button" class="px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors cursor-pointer"${_scopeId}> Cancel </button><button type="button" class="px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer"${_scopeId}> Yes, Delete Permission </button></div></div></div>`);
						} else _push(`<!---->`);
					} else return [
						createVNode("div", { class: "space-y-6" }, [
							createVNode("div", { class: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between" }, [createVNode("div", null, [createVNode("h1", { class: "text-2xl font-bold tracking-tight text-slate-900 dark:text-slate-50" }, "Roles & Permissions"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 mt-1" }, " Configure security access control levels, user groups, and capability guards. ")])]),
							unref(page).props.flash?.success ? (openBlock(), createBlock("div", {
								key: 0,
								class: "bg-emerald-50 dark:bg-emerald-950/30 border border-emerald-200 dark:border-emerald-900/50 text-emerald-800 dark:text-emerald-400 rounded-xl p-4 text-sm flex items-center gap-3"
							}, [createVNode(unref(Check), { class: "h-5 w-5 text-emerald-600 dark:text-emerald-400 shrink-0" }), createVNode("span", null, toDisplayString(unref(page).props.flash?.success), 1)])) : createCommentVNode("", true),
							unref(page).props.flash?.error ? (openBlock(), createBlock("div", {
								key: 1,
								class: "bg-rose-50 dark:bg-rose-950/30 border border-rose-200 dark:border-rose-900/50 text-rose-800 dark:text-rose-400 rounded-xl p-4 text-sm flex items-center gap-3"
							}, [createVNode(unref(AlertCircle), { class: "h-5 w-5 text-rose-600 dark:text-rose-400 shrink-0" }), createVNode("span", null, toDisplayString(unref(page).props.flash?.error), 1)])) : createCommentVNode("", true),
							createVNode("div", { class: "flex border-b border-slate-200 dark:border-slate-800" }, [createVNode("button", {
								onClick: ($event) => currentTab.value = "roles",
								class: ["px-4 py-2.5 text-sm font-medium border-b-2 transition-all cursor-pointer focus:outline-none", currentTab.value === "roles" ? "border-red-600 text-red-650 dark:border-red-400 dark:text-red-450 font-semibold" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"]
							}, " Role Permissions Matrix ", 10, ["onClick"]), createVNode("button", {
								onClick: ($event) => currentTab.value = "permissions",
								class: ["px-4 py-2.5 text-sm font-medium border-b-2 transition-all cursor-pointer focus:outline-none", currentTab.value === "permissions" ? "border-red-600 text-red-650 dark:border-red-400 dark:text-red-450 font-semibold" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"]
							}, " Permissions Manager ", 10, ["onClick"])]),
							currentTab.value === "roles" ? (openBlock(), createBlock("div", {
								key: 2,
								class: "grid grid-cols-1 lg:grid-cols-12 gap-6 items-start animate-in fade-in duration-200"
							}, [createVNode("div", { class: "lg:col-span-4 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-4 shadow-sm space-y-4" }, [
								createVNode("div", { class: "flex items-center justify-between" }, [createVNode("h3", { class: "text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider" }, "Security Roles"), createVNode("button", {
									onClick: ($event) => isCreatingRole.value = true,
									class: "inline-flex items-center gap-1 text-xs font-semibold text-red-600 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"
								}, [createVNode(unref(Plus), { class: "h-3.5 w-3.5" }), createTextVNode(" Add Role ")], 8, ["onClick"])]),
								isCreatingRole.value ? (openBlock(), createBlock("div", {
									key: 0,
									class: "border border-slate-200 dark:border-slate-800 rounded-lg p-3 bg-slate-50 dark:bg-slate-900/40 animate-in slide-in-from-top-2 duration-200"
								}, [createVNode("form", {
									onSubmit: withModifiers(createRole, ["prevent"]),
									class: "space-y-3"
								}, [createVNode("div", { class: "space-y-1" }, [
									createVNode("label", {
										for: "role-name-input",
										class: "block text-[10px] font-semibold uppercase text-slate-400"
									}, "Role Name"),
									withDirectives(createVNode("input", {
										id: "role-name-input",
										"onUpdate:modelValue": ($event) => unref(newRoleForm).name = $event,
										type: "text",
										required: "",
										placeholder: "e.g. Moderator",
										class: "w-full px-3 py-1.5 text-xs bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-1 focus:ring-red-500 transition-all"
									}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(newRoleForm).name]]),
									unref(newRoleForm).errors.name ? (openBlock(), createBlock("span", {
										key: 0,
										class: "text-[10px] text-red-600 dark:text-red-400 font-medium block"
									}, toDisplayString(unref(newRoleForm).errors.name), 1)) : createCommentVNode("", true)
								]), createVNode("div", { class: "flex items-center justify-end gap-2 text-xs" }, [createVNode("button", {
									type: "button",
									onClick: ($event) => isCreatingRole.value = false,
									class: "px-2.5 py-1 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300"
								}, " Cancel ", 8, ["onClick"]), createVNode("button", {
									type: "submit",
									disabled: unref(newRoleForm).processing,
									class: "px-2.5 py-1 text-white bg-red-600 hover:bg-red-700 rounded-md font-semibold disabled:opacity-50"
								}, " Create ", 8, ["disabled"])])], 32)])) : createCommentVNode("", true),
								createVNode("div", { class: "space-y-1 max-h-[60vh] overflow-y-auto" }, [(openBlock(true), createBlock(Fragment, null, renderList(__props.roles, (role) => {
									return openBlock(), createBlock("button", {
										key: role.id,
										onClick: ($event) => selectRole(role.id),
										class: ["w-full text-left px-3 py-2.5 rounded-lg flex items-center justify-between border transition-all duration-200", activeRoleId.value === role.id ? "bg-red-50/70 border-red-200 dark:bg-red-950/20 dark:border-red-900/40 text-red-900 dark:text-red-200 font-semibold" : "bg-transparent border-transparent hover:bg-slate-50 dark:hover:bg-slate-900/50 text-slate-700 dark:text-slate-350"]
									}, [createVNode("span", { class: "text-sm capitalize flex items-center gap-2" }, [createVNode(unref(Shield), { class: ["h-4 w-4 shrink-0 text-slate-400", { "text-red-500": activeRoleId.value === role.id }] }, null, 8, ["class"]), createTextVNode(" " + toDisplayString(role.name), 1)]), role.is_system ? (openBlock(), createBlock("span", {
										key: 0,
										class: "text-[9px] font-semibold px-1.5 py-0.5 rounded bg-slate-100 text-slate-500 border border-slate-200/55 dark:bg-slate-900 dark:text-slate-400 dark:border-slate-800"
									}, " SYSTEM ")) : createCommentVNode("", true)], 10, ["onClick"]);
								}), 128))])
							]), activeRole.value ? (openBlock(), createBlock("div", {
								key: 0,
								class: "lg:col-span-8 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-6 shadow-sm space-y-6"
							}, [
								createVNode("div", { class: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between border-b border-slate-200 dark:border-slate-800 pb-4" }, [createVNode("div", { class: "space-y-1" }, [createVNode("div", { class: "flex items-center gap-2" }, [createVNode("h2", { class: "text-lg font-bold text-slate-900 dark:text-slate-50 capitalize" }, toDisplayString(activeRole.value.name) + " Role", 1), activeRole.value.is_system ? (openBlock(), createBlock(unref(Lock), {
									key: 0,
									class: "h-4 w-4 text-slate-400",
									title: "System protected role"
								})) : createCommentVNode("", true)]), createVNode("p", { class: "text-xs text-slate-400 dark:text-slate-500" }, " Set capabilities and permission gates for users belonging to this security level. ")]), !activeRole.value.is_system ? (openBlock(), createBlock("div", {
									key: 0,
									class: "flex items-center gap-2"
								}, [createVNode("button", {
									onClick: ($event) => isDeletingRole.value = true,
									class: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-xs font-semibold border border-red-200 dark:border-red-950 bg-red-50 dark:bg-red-950/20 text-red-600 dark:text-red-400 hover:bg-red-100 dark:hover:bg-red-950/40 transition-colors"
								}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" }), createTextVNode(" Delete Role ")], 8, ["onClick"])])) : createCommentVNode("", true)]),
								activeRole.value.name === "Super Admin" ? (openBlock(), createBlock("div", {
									key: 0,
									class: "bg-slate-900 dark:bg-slate-50 text-slate-200 dark:text-slate-900 rounded-xl p-4 border border-slate-800 dark:border-slate-200 text-xs flex gap-3 leading-relaxed"
								}, [createVNode(unref(ShieldAlert), { class: "h-5 w-5 text-red-500 dark:text-red-600 shrink-0" }), createVNode("div", null, [createVNode("span", { class: "font-bold block mb-0.5" }, "Super Admin Gate Bypass Enabled"), createTextVNode(" The Super Admin role inherently bypasses all authorization gate checks. System permissions are fully enabled and cannot be revoked to prevent lockout. ")])])) : createCommentVNode("", true),
								!activeRole.value.is_system ? (openBlock(), createBlock("div", {
									key: 1,
									class: "space-y-2 max-w-sm"
								}, [
									createVNode("label", {
										for: "edit-role-name",
										class: "block text-xs font-semibold uppercase text-slate-400"
									}, "Rename Role"),
									createVNode("div", { class: "flex items-center gap-2" }, [createVNode("div", { class: "relative flex-1" }, [createVNode(unref(Edit3), { class: "absolute left-3 top-2.5 h-4 w-4 text-slate-400" }), withDirectives(createVNode("input", {
										id: "edit-role-name",
										"onUpdate:modelValue": ($event) => unref(editPermissionsForm).name = $event,
										type: "text",
										required: "",
										class: "w-full pl-9 pr-4 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
									}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(editPermissionsForm).name]])])]),
									unref(editPermissionsForm).errors.name ? (openBlock(), createBlock("span", {
										key: 0,
										class: "text-xs text-red-600 dark:text-red-400 font-medium"
									}, toDisplayString(unref(editPermissionsForm).errors.name), 1)) : createCommentVNode("", true)
								])) : createCommentVNode("", true),
								createVNode("div", { class: "space-y-6" }, [createVNode("h3", { class: "text-xs font-semibold text-slate-500 dark:text-slate-400 uppercase tracking-wider" }, "Configure Permissions"), createVNode("div", { class: "space-y-6" }, [(openBlock(true), createBlock(Fragment, null, renderList(permissionsByCategory.value, (perms, category) => {
									return openBlock(), createBlock("div", {
										key: category,
										class: "space-y-3"
									}, [createVNode("span", { class: "text-xs font-bold text-slate-700 dark:text-slate-355 block border-b border-slate-100 dark:border-slate-900 pb-1.5 capitalize font-semibold" }, toDisplayString(category) + " Permissions ", 1), createVNode("div", { class: "grid grid-cols-1 md:grid-cols-2 gap-3" }, [(openBlock(true), createBlock(Fragment, null, renderList(perms, (perm) => {
										return openBlock(), createBlock("div", {
											key: perm.id,
											onClick: ($event) => togglePermission(perm.name),
											class: [
												"border rounded-xl p-3.5 flex items-center justify-between select-none transition-all duration-200",
												activeRole.value.name === "Super Admin" ? "cursor-not-allowed opacity-80" : "cursor-pointer",
												isPermissionSelected(perm.name) ? "bg-red-50/30 border-red-200 dark:bg-red-950/10 dark:border-red-900/30" : "bg-white dark:bg-slate-950 border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900/50"
											]
										}, [createVNode("div", { class: "space-y-0.5" }, [createVNode("span", { class: "text-sm font-semibold text-slate-900 dark:text-slate-100 capitalize" }, toDisplayString(perm.name.replace("-", " ")), 1), createVNode("span", { class: "text-[10px] text-slate-400 dark:text-slate-500 block font-mono" }, toDisplayString(perm.name), 1)]), createVNode("div", { class: ["h-5 w-5 rounded border flex items-center justify-center transition-all", isPermissionSelected(perm.name) ? "bg-red-500 border-red-500 text-white" : "border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-900"] }, [isPermissionSelected(perm.name) ? (openBlock(), createBlock(unref(Check), {
											key: 0,
											class: "h-3.5 w-3.5 stroke-[3]"
										})) : createCommentVNode("", true)], 2)], 10, ["onClick"]);
									}), 128))])]);
								}), 128))])]),
								activeRole.value.name !== "Super Admin" ? (openBlock(), createBlock("div", {
									key: 2,
									class: "flex justify-end pt-4 border-t border-slate-200 dark:border-slate-800"
								}, [createVNode("button", {
									onClick: saveRoleSettings,
									disabled: unref(editPermissionsForm).processing,
									class: "inline-flex items-center gap-2 px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 disabled:opacity-50"
								}, [createVNode(unref(Save), { class: "h-4 w-4" }), unref(editPermissionsForm).processing ? (openBlock(), createBlock("span", { key: 0 }, "Saving settings...")) : (openBlock(), createBlock("span", { key: 1 }, "Save Role settings"))], 8, ["disabled"])])) : createCommentVNode("", true)
							])) : createCommentVNode("", true)])) : currentTab.value === "permissions" ? (openBlock(), createBlock("div", {
								key: 3,
								class: "space-y-6 animate-in fade-in duration-200"
							}, [createVNode("div", { class: "bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-6 shadow-sm space-y-6" }, [createVNode("div", { class: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4" }, [createVNode("div", { class: "relative max-w-md w-full" }, [createVNode("span", { class: "absolute left-3 top-2.5 text-slate-400" }, [createVNode(unref(Search), { class: "h-4.5 w-4.5" })]), withDirectives(createVNode("input", {
								"onUpdate:modelValue": ($event) => permissionSearch.value = $event,
								type: "text",
								placeholder: "Search permissions by name or category...",
								class: "w-full pl-9 pr-4 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, permissionSearch.value]])]), createVNode("button", {
								onClick: ($event) => isCreatingPermission.value = true,
								class: "inline-flex items-center justify-center gap-2 px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer whitespace-nowrap"
							}, [createVNode(unref(Plus), { class: "h-4 w-4" }), createTextVNode(" Add Permission ")], 8, ["onClick"])]), createVNode("div", { class: "border border-slate-200 dark:border-slate-800 rounded-xl overflow-hidden bg-white dark:bg-slate-950" }, [createVNode("div", { class: "overflow-x-auto" }, [createVNode("table", { class: "w-full text-left border-collapse" }, [createVNode("thead", null, [createVNode("tr", { class: "bg-slate-50 dark:bg-slate-900/60 text-xs font-semibold uppercase tracking-wider text-slate-500 border-b border-slate-200 dark:border-slate-800" }, [
								createVNode("th", { class: "px-6 py-3.5" }, "Permission Name"),
								createVNode("th", { class: "px-6 py-3.5" }, "Category"),
								createVNode("th", { class: "px-6 py-3.5" }, "Assigned Roles"),
								createVNode("th", { class: "px-6 py-3.5" }, "Type"),
								createVNode("th", { class: "px-6 py-3.5 text-right" }, "Actions")
							])]), createVNode("tbody", { class: "divide-y divide-slate-100 dark:divide-slate-900 text-sm" }, [filteredPermissions.value.length === 0 ? (openBlock(), createBlock("tr", { key: 0 }, [createVNode("td", {
								colspan: "5",
								class: "px-6 py-10 text-center text-slate-500 dark:text-slate-400 italic"
							}, " No permissions found. ")])) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(filteredPermissions.value, (perm) => {
								return openBlock(), createBlock("tr", {
									key: perm.id,
									class: "hover:bg-slate-50/50 dark:hover:bg-slate-900/20 transition-colors"
								}, [
									createVNode("td", { class: "px-6 py-4 font-semibold text-slate-900 dark:text-slate-100" }, [createVNode("div", { class: "flex items-center gap-2" }, [createVNode(unref(Key), { class: "h-4 w-4 text-slate-400 shrink-0" }), createVNode("span", null, toDisplayString(perm.name), 1)])]),
									createVNode("td", { class: "px-6 py-4 whitespace-nowrap" }, [createVNode("span", { class: "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-slate-100 dark:bg-slate-900 text-slate-600 dark:text-slate-400 border border-slate-200/40 dark:border-slate-800" }, toDisplayString(perm.category), 1)]),
									createVNode("td", { class: "px-6 py-4" }, [createVNode("div", { class: "flex flex-wrap gap-1.5" }, [getRolesForPermission(perm.name).length === 0 ? (openBlock(), createBlock("span", {
										key: 0,
										class: "text-xs text-slate-400 italic"
									}, "None")) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(getRolesForPermission(perm.name), (role) => {
										return openBlock(), createBlock("span", {
											key: role.id,
											class: ["inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-semibold border", role.name === "Super Admin" || role.name === "Admin" ? "bg-red-50 text-red-700 border-red-100 dark:bg-red-950/20 dark:text-red-400 dark:border-red-900/40" : "bg-slate-100 text-slate-700 border-slate-200 dark:bg-slate-900 dark:text-slate-350 dark:border-slate-800"]
										}, toDisplayString(role.name), 3);
									}), 128))])]),
									createVNode("td", { class: "px-6 py-4 whitespace-nowrap" }, [perm.is_system ? (openBlock(), createBlock("span", {
										key: 0,
										class: "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold bg-slate-100 text-slate-500 border border-slate-200/50 dark:bg-slate-900 dark:text-slate-400 dark:border-slate-800"
									}, " System Core ")) : (openBlock(), createBlock("span", {
										key: 1,
										class: "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold bg-emerald-50 text-emerald-700 border border-emerald-100 dark:bg-emerald-950/20 dark:text-emerald-450 dark:border-emerald-900/40"
									}, " Custom "))]),
									createVNode("td", { class: "px-6 py-4 whitespace-nowrap text-right" }, [createVNode("div", { class: "flex items-center justify-end gap-2" }, [perm.is_system ? (openBlock(), createBlock(unref(Lock), {
										key: 0,
										class: "h-4 w-4 text-slate-400",
										title: "System permissions are locked"
									})) : (openBlock(), createBlock(Fragment, { key: 1 }, [createVNode("button", {
										onClick: ($event) => openEditPermissionModal(perm),
										class: "p-1 rounded-lg text-slate-505 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-900 dark:hover:text-slate-200 transition-colors cursor-pointer",
										title: "Rename Permission"
									}, [createVNode(unref(Edit3), { class: "h-3.5 w-3.5" })], 8, ["onClick"]), createVNode("button", {
										onClick: ($event) => openDeletePermissionModal(perm),
										class: "p-1 rounded-lg text-slate-400 hover:bg-red-50 dark:hover:bg-red-950/20 hover:text-red-650 transition-colors cursor-pointer",
										title: "Delete Permission"
									}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" })], 8, ["onClick"])], 64))])])
								]);
							}), 128))])])])])])])) : createCommentVNode("", true)
						]),
						isDeletingRole.value ? (openBlock(), createBlock("div", {
							key: 0,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"
						}, [createVNode("div", {
							onClick: ($event) => isDeletingRole.value = false,
							class: "fixed inset-0 bg-slate-950/60 backdrop-blur-sm"
						}, null, 8, ["onClick"]), createVNode("div", { class: "relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200" }, [createVNode("div", { class: "p-6 text-center space-y-4" }, [createVNode("div", { class: "mx-auto h-12 w-12 rounded-full bg-red-50 dark:bg-red-905/30 flex items-center justify-center border border-red-100 dark:border-red-900/50 text-red-600 dark:text-red-400" }, [createVNode(unref(Trash2), { class: "h-6 w-6" })]), createVNode("div", { class: "space-y-1" }, [createVNode("h3", { class: "text-base font-bold text-slate-900 dark:text-slate-50" }, "Delete Security Role"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 leading-normal" }, [
							createTextVNode(" Are you sure you want to delete the security role "),
							createVNode("span", { class: "font-semibold text-slate-900 dark:text-slate-50 capitalize" }, toDisplayString(activeRole.value?.name), 1),
							createTextVNode("? Users currently assigned to this role will lose its permissions. ")
						])])]), createVNode("div", { class: "px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end gap-3 bg-slate-50/50 dark:bg-slate-900/50" }, [createVNode("button", {
							type: "button",
							onClick: ($event) => isDeletingRole.value = false,
							class: "px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors"
						}, " Cancel ", 8, ["onClick"]), createVNode("button", {
							type: "button",
							onClick: deleteRole,
							class: "px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2"
						}, " Yes, Delete Role ")])])])) : createCommentVNode("", true),
						isCreatingPermission.value ? (openBlock(), createBlock("div", {
							key: 1,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"
						}, [createVNode("div", {
							onClick: ($event) => isCreatingPermission.value = false,
							class: "fixed inset-0 bg-slate-950/60 backdrop-blur-sm"
						}, null, 8, ["onClick"]), createVNode("div", { class: "relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200" }, [createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between bg-slate-50/50 dark:bg-slate-900/50" }, [createVNode("h3", { class: "text-base font-semibold text-slate-900 dark:text-slate-50" }, "Add Security Permission"), createVNode("button", {
							onClick: ($event) => isCreatingPermission.value = false,
							class: "rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-650 cursor-pointer text-xl"
						}, " × ", 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(createPermission, ["prevent"]),
							class: "space-y-4 p-6"
						}, [createVNode("div", { class: "space-y-1.5" }, [
							createVNode("label", {
								for: "perm-name",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Permission Name"),
							withDirectives(createVNode("input", {
								id: "perm-name",
								"onUpdate:modelValue": ($event) => unref(newPermissionForm).name = $event,
								type: "text",
								required: "",
								placeholder: "e.g. view analytics",
								class: "w-full px-3 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-950 dark:text-slate-50 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(newPermissionForm).name]]),
							unref(newPermissionForm).errors.name ? (openBlock(), createBlock("span", {
								key: 0,
								class: "text-xs text-red-600 dark:text-red-400 font-medium block mt-1"
							}, toDisplayString(unref(newPermissionForm).errors.name), 1)) : createCommentVNode("", true)
						]), createVNode("div", { class: "flex justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-900" }, [createVNode("button", {
							type: "button",
							onClick: ($event) => isCreatingPermission.value = false,
							class: "px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-300 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors focus:outline-none cursor-pointer"
						}, " Cancel ", 8, ["onClick"]), createVNode("button", {
							type: "submit",
							disabled: unref(newPermissionForm).processing,
							class: "px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:ring-offset-2 disabled:opacity-50 cursor-pointer"
						}, " Create ", 8, ["disabled"])])], 32)])])) : createCommentVNode("", true),
						isEditingPermission.value ? (openBlock(), createBlock("div", {
							key: 2,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"
						}, [createVNode("div", {
							onClick: ($event) => isEditingPermission.value = false,
							class: "fixed inset-0 bg-slate-950/60 backdrop-blur-sm"
						}, null, 8, ["onClick"]), createVNode("div", { class: "relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200" }, [createVNode("div", { class: "px-6 py-4 border-b border-slate-200 dark:border-slate-800 flex items-center justify-between bg-slate-50/50 dark:bg-slate-900/50" }, [createVNode("h3", { class: "text-base font-semibold text-slate-900 dark:text-slate-50" }, "Rename Permission"), createVNode("button", {
							onClick: ($event) => isEditingPermission.value = false,
							class: "rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-650 cursor-pointer text-xl"
						}, " × ", 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(updatePermission, ["prevent"]),
							class: "space-y-4 p-6"
						}, [createVNode("div", { class: "space-y-1.5" }, [
							createVNode("label", {
								for: "edit-perm-name",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Permission Name"),
							withDirectives(createVNode("input", {
								id: "edit-perm-name",
								"onUpdate:modelValue": ($event) => unref(editPermissionForm).name = $event,
								type: "text",
								required: "",
								class: "w-full px-3 py-2 text-sm bg-slate-50 dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-lg text-slate-900 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500/20 focus:border-red-500 transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(editPermissionForm).name]]),
							unref(editPermissionForm).errors.name ? (openBlock(), createBlock("span", {
								key: 0,
								class: "text-xs text-red-600 dark:text-red-400 font-medium block mt-1"
							}, toDisplayString(unref(editPermissionForm).errors.name), 1)) : createCommentVNode("", true)
						]), createVNode("div", { class: "flex justify-end gap-3 pt-4 border-t border-slate-100 dark:border-slate-900" }, [createVNode("button", {
							type: "button",
							onClick: ($event) => isEditingPermission.value = false,
							class: "px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors focus:outline-none cursor-pointer"
						}, " Cancel ", 8, ["onClick"]), createVNode("button", {
							type: "submit",
							disabled: unref(editPermissionForm).processing,
							class: "px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 disabled:opacity-50 cursor-pointer"
						}, " Save Changes ", 8, ["disabled"])])], 32)])])) : createCommentVNode("", true),
						isDeletingPermission.value ? (openBlock(), createBlock("div", {
							key: 3,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"
						}, [createVNode("div", {
							onClick: ($event) => isDeletingPermission.value = false,
							class: "fixed inset-0 bg-slate-950/60 backdrop-blur-sm"
						}, null, 8, ["onClick"]), createVNode("div", { class: "relative bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl w-full max-w-md overflow-hidden flex flex-col animate-in zoom-in-95 duration-200" }, [createVNode("div", { class: "p-6 text-center space-y-4" }, [createVNode("div", { class: "mx-auto h-12 w-12 rounded-full bg-red-50 dark:bg-red-905/30 flex items-center justify-center border border-red-100 dark:border-red-900/50 text-red-600 dark:text-red-400" }, [createVNode(unref(Trash2), { class: "h-6 w-6" })]), createVNode("div", { class: "space-y-1" }, [createVNode("h3", { class: "text-base font-bold text-slate-900 dark:text-slate-50" }, "Delete Security Permission"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 leading-normal" }, [
							createTextVNode(" Are you sure you want to delete the permission "),
							createVNode("span", { class: "font-semibold text-slate-900 dark:text-slate-50 font-mono" }, toDisplayString(permissionToDelete.value?.name), 1),
							createTextVNode("? This will permanently remove it from the system and detach it from all roles. ")
						])])]), createVNode("div", { class: "px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end gap-3 bg-slate-50/50 dark:bg-slate-900/50" }, [createVNode("button", {
							type: "button",
							onClick: ($event) => isDeletingPermission.value = false,
							class: "px-4 py-2 text-sm font-medium text-slate-700 dark:text-slate-350 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-900 transition-colors cursor-pointer"
						}, " Cancel ", 8, ["onClick"]), createVNode("button", {
							type: "button",
							onClick: deletePermission,
							class: "px-4 py-2 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer"
						}, " Yes, Delete Permission ")])])])) : createCommentVNode("", true)
					];
				}),
				_: 1
			}, _parent));
			_push(`<!--]-->`);
		};
	}
});
//#endregion
//#region resources/js/Pages/Rbac/Index.vue
var _sfc_setup = Index_vue_vue_type_script_setup_true_lang_default.setup;
Index_vue_vue_type_script_setup_true_lang_default.setup = (props, ctx) => {
	const ssrContext = useSSRContext();
	(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/Pages/Rbac/Index.vue");
	return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
var Index_default = Index_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { Index_default as default };
