import { t as AdminLayout_default } from "./AdminLayout-CFTJa237.js";
import { Head, router, useForm, usePage } from "@inertiajs/vue3";
import { Fragment, computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderList, resolveDynamicComponent, toDisplayString, unref, useSSRContext, vModelSelect, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
import { ssrIncludeBooleanAttr, ssrInterpolate, ssrLooseContain, ssrLooseEqual, ssrRenderAttr, ssrRenderClass, ssrRenderComponent, ssrRenderList, ssrRenderVNode } from "vue/server-renderer";
import * as LucideIcons from "lucide-vue-next";
import { AlertCircle, Check, Edit2, Key, Plus, Settings, Shield, Trash2 } from "lucide-vue-next";
//#region resources/js/Pages/Menus/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: {
		menus: {},
		parentOptions: {},
		roles: {},
		permissions: {},
		groups: {}
	},
	setup(__props) {
		const props = __props;
		const page = usePage();
		const isFormModalOpen = ref(false);
		const isDeleteModalOpen = ref(false);
		const editingMenu = ref(null);
		const menuToDelete = ref(null);
		const isManageGroupsOpen = ref(false);
		const isRenamingGroup = ref(false);
		const isDeletingGroup = ref(false);
		const renameGroupForm = useForm({
			old_name: "",
			new_name: ""
		});
		const deleteGroupForm = useForm({ group_name: "" });
		const openRenameGroupModal = (name) => {
			renameGroupForm.old_name = name;
			renameGroupForm.new_name = name;
			renameGroupForm.clearErrors();
			isRenamingGroup.value = true;
		};
		const submitRenameGroup = () => {
			renameGroupForm.post(route("menus.groups.rename"), { onSuccess: () => {
				isRenamingGroup.value = false;
			} });
		};
		const openDeleteGroupModal = (name) => {
			deleteGroupForm.group_name = name;
			deleteGroupForm.clearErrors();
			isDeletingGroup.value = true;
		};
		const submitDeleteGroup = () => {
			deleteGroupForm.post(route("menus.groups.delete"), { onSuccess: () => {
				isDeletingGroup.value = false;
			} });
		};
		const availableIcons = [
			"LayoutDashboard",
			"Users",
			"ShieldCheck",
			"Settings",
			"History",
			"Menu",
			"Database",
			"FileText",
			"Folder",
			"Bell",
			"BookOpen",
			"HelpCircle",
			"Lock",
			"CreditCard",
			"BarChart3",
			"Mail"
		];
		const getIcon = (name) => {
			if (!name) return LucideIcons.HelpCircle;
			return LucideIcons[name] || LucideIcons.HelpCircle;
		};
		const selectedGroup = ref("Main Menu");
		const customGroupName = ref("");
		const availableGroups = computed(() => {
			const list = [...props.groups];
			["Main Menu", "Administration"].forEach((g) => {
				if (!list.includes(g)) list.push(g);
			});
			return list;
		});
		watch([selectedGroup, customGroupName], ([newSel, newCust]) => {
			if (newSel === "__new__") form.group_name = newCust;
			else form.group_name = newSel;
		});
		const form = useForm({
			title: "",
			href: "",
			group_name: "Main Menu",
			icon: "HelpCircle",
			roles: [],
			permissions: [],
			sort_order: 1,
			parent_id: ""
		});
		const openCreateModal = () => {
			editingMenu.value = null;
			form.clearErrors();
			form.reset();
			selectedGroup.value = "Main Menu";
			customGroupName.value = "";
			isFormModalOpen.value = true;
		};
		const openEditModal = (item) => {
			editingMenu.value = item;
			form.clearErrors();
			form.title = item.title;
			form.href = item.href;
			form.icon = item.icon || "HelpCircle";
			form.roles = item.roles || [];
			form.permissions = item.permissions || [];
			form.sort_order = item.sort_order;
			form.parent_id = item.parent_id || "";
			if (availableGroups.value.includes(item.group_name)) {
				selectedGroup.value = item.group_name;
				customGroupName.value = "";
			} else {
				selectedGroup.value = "__new__";
				customGroupName.value = item.group_name;
			}
			form.group_name = item.group_name;
			isFormModalOpen.value = true;
		};
		const submitForm = () => {
			const data = {
				...form.data(),
				parent_id: form.parent_id === "" ? null : Number(form.parent_id)
			};
			if (editingMenu.value) router.put(route("menus.update", editingMenu.value.id), data, { onSuccess: () => {
				isFormModalOpen.value = false;
				form.reset();
			} });
			else router.post(route("menus.store"), data, { onSuccess: () => {
				isFormModalOpen.value = false;
				form.reset();
			} });
		};
		const openDeleteModal = (item) => {
			menuToDelete.value = item;
			isDeleteModalOpen.value = true;
		};
		const deleteMenuItem = () => {
			if (!menuToDelete.value) return;
			router.delete(route("menus.destroy", menuToDelete.value.id), { onSuccess: () => {
				isDeleteModalOpen.value = false;
				menuToDelete.value = null;
			} });
		};
		const toggleRole = (roleName) => {
			const idx = form.roles.indexOf(roleName);
			if (idx > -1) form.roles.splice(idx, 1);
			else form.roles.push(roleName);
		};
		const togglePermission = (permName) => {
			const idx = form.permissions.indexOf(permName);
			if (idx > -1) form.permissions.splice(idx, 1);
			else form.permissions.push(permName);
		};
		const selectIcon = (iconName) => {
			form.icon = iconName;
		};
		return (_ctx, _push, _parent, _attrs) => {
			_push(`<!--[-->`);
			_push(ssrRenderComponent(unref(Head), { title: "Menu Manager" }, 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}>Menu Manager</h1><p class="text-sm text-slate-500 dark:text-slate-400 mt-1"${_scopeId}> Configure database-driven sidebar menus, sorting order, and access filters. </p></div><div class="flex items-center gap-3"${_scopeId}><button class="inline-flex items-center gap-2 px-4 py-2 text-sm font-semibold text-slate-700 dark:text-slate-200 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Settings), { class: "h-4 w-4" }, null, _parent, _scopeId));
						_push(` Manage Groups </button><button 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 focus:ring-offset-2 cursor-pointer"${_scopeId}>`);
						_push(ssrRenderComponent(unref(Plus), { class: "h-4 w-4" }, null, _parent, _scopeId));
						_push(` Add Menu Item </button></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="grid grid-cols-1 gap-6"${_scopeId}>`);
						if (__props.menus.length === 0) _push(`<div class="bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-12 text-center text-slate-500 dark:text-slate-400"${_scopeId}> No menu items found. Click &quot;Add Menu Item&quot; to create one. </div>`);
						else _push(`<!---->`);
						_push(`<!--[-->`);
						ssrRenderList(__props.menus, (parent) => {
							_push(`<div class="bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-sm p-5 space-y-4"${_scopeId}><div class="flex items-center justify-between border-b border-slate-100 dark:border-slate-900 pb-3"${_scopeId}><div class="flex items-center gap-3"${_scopeId}><div class="h-8 w-8 rounded-lg bg-red-50 dark:bg-red-950/30 flex items-center justify-center border border-red-100 dark:border-red-900/40"${_scopeId}>`);
							ssrRenderVNode(_push, createVNode(resolveDynamicComponent(getIcon(parent.icon)), { class: "h-4.5 w-4.5 text-red-600 dark:text-red-400" }, null), _parent, _scopeId);
							_push(`</div><div${_scopeId}><h3 class="text-sm font-semibold text-slate-900 dark:text-slate-100"${_scopeId}>${ssrInterpolate(parent.title)}</h3><span class="text-[10px] bg-slate-100 dark:bg-slate-900 px-1.5 py-0.5 rounded text-slate-500 dark:text-slate-400 font-mono"${_scopeId}>${ssrInterpolate(parent.href)}</span></div></div><div class="flex items-center gap-4"${_scopeId}><div class="text-xs text-slate-400 dark:text-slate-500"${_scopeId}> Order: <span class="font-semibold text-slate-700 dark:text-slate-300"${_scopeId}>#${ssrInterpolate(parent.sort_order)}</span> | Group: <span class="font-semibold text-slate-700 dark:text-slate-300"${_scopeId}>${ssrInterpolate(parent.group_name)}</span></div><div class="flex items-center gap-1.5"${_scopeId}><button class="p-1 rounded-lg text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-900 dark:hover:text-slate-200 transition-colors"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Edit2), { 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-600 dark:hover:text-red-400 transition-colors"${_scopeId}>`);
							_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
							_push(`</button></div></div></div><div class="flex flex-wrap gap-2 text-xs"${_scopeId}><span class="text-slate-400 select-none"${_scopeId}>Access restrictions:</span>`);
							if ((!parent.roles || parent.roles.length === 0) && (!parent.permissions || parent.permissions.length === 0)) _push(`<span class="text-emerald-600 dark:text-emerald-400 italic"${_scopeId}>Public (All users)</span>`);
							else _push(`<!---->`);
							_push(`<!--[-->`);
							ssrRenderList(parent.roles, (role) => {
								_push(`<span class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-slate-100 text-slate-700 border border-slate-200 dark:bg-slate-900 dark:text-slate-350 dark:border-slate-800"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Shield), { class: "h-3 w-3" }, null, _parent, _scopeId));
								_push(` Role: ${ssrInterpolate(role)}</span>`);
							});
							_push(`<!--]--><!--[-->`);
							ssrRenderList(parent.permissions, (perm) => {
								_push(`<span class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-red-50 text-red-700 border border-red-100 dark:bg-red-950/20 dark:text-red-400 dark:border-red-900/40"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Key), { class: "h-3 w-3" }, null, _parent, _scopeId));
								_push(` Perm: ${ssrInterpolate(perm)}</span>`);
							});
							_push(`<!--]--></div>`);
							if (parent.children && parent.children.length > 0) {
								_push(`<div class="pl-8 border-l border-slate-150 dark:border-slate-850 space-y-3 mt-3"${_scopeId}><!--[-->`);
								ssrRenderList(parent.children, (child) => {
									_push(`<div class="flex items-center justify-between py-1 bg-slate-50/40 dark:bg-slate-900/10 p-2 rounded-lg"${_scopeId}><div class="flex items-center gap-2.5"${_scopeId}>`);
									ssrRenderVNode(_push, createVNode(resolveDynamicComponent(getIcon(child.icon)), { class: "h-3.5 w-3.5 text-slate-450 dark:text-slate-500" }, null), _parent, _scopeId);
									_push(`<span class="text-xs font-medium text-slate-700 dark:text-slate-300"${_scopeId}>${ssrInterpolate(child.title)}</span><span class="text-[9px] bg-slate-100 dark:bg-slate-850 px-1 py-0.2 rounded text-slate-450 font-mono"${_scopeId}>${ssrInterpolate(child.href)}</span></div><div class="flex items-center gap-3"${_scopeId}><span class="text-[10px] text-slate-400 font-mono"${_scopeId}>Order: #${ssrInterpolate(child.sort_order)}</span><div class="flex items-center gap-1"${_scopeId}><button class="p-1 rounded text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 transition-colors"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Edit2), { class: "h-3 w-3" }, null, _parent, _scopeId));
									_push(`</button><button class="p-1 rounded text-slate-400 hover:bg-red-50 dark:hover:bg-red-950/20 hover:text-red-650 transition-colors"${_scopeId}>`);
									_push(ssrRenderComponent(unref(Trash2), { class: "h-3 w-3" }, null, _parent, _scopeId));
									_push(`</button></div></div></div>`);
								});
								_push(`<!--]--></div>`);
							} else _push(`<!---->`);
							_push(`</div>`);
						});
						_push(`<!--]--></div></div>`);
						if (isFormModalOpen.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 transition-opacity"${_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-xl overflow-hidden flex flex-col max-h-[90vh] 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}>${ssrInterpolate(editingMenu.value ? "Edit Menu Item" : "Add Menu Item")}</h3><button class="rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-600 dark:hover:text-slate-300 transition-colors"${_scopeId}> × </button></div><form class="flex flex-col overflow-hidden"${_scopeId}><div class="p-6 overflow-y-auto space-y-4"${_scopeId}><div class="grid grid-cols-2 gap-4"${_scopeId}><div class="space-y-1"${_scopeId}><label for="menu-title" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Menu Title</label><input id="menu-title"${ssrRenderAttr("value", unref(form).title)} type="text" required placeholder="e.g. Audit Logs" 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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}></div><div class="space-y-1"${_scopeId}><label for="menu-href" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Path / URL</label><input id="menu-href"${ssrRenderAttr("value", unref(form).href)} type="text" required placeholder="e.g. /logs" 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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}></div></div><div class="grid grid-cols-2 gap-4"${_scopeId}><div class="space-y-1"${_scopeId}><label for="menu-group" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Group Name</label><select id="menu-group" 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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}><!--[-->`);
							ssrRenderList(availableGroups.value, (group) => {
								_push(`<option${ssrRenderAttr("value", group)}${ssrIncludeBooleanAttr(Array.isArray(selectedGroup.value) ? ssrLooseContain(selectedGroup.value, group) : ssrLooseEqual(selectedGroup.value, group)) ? " selected" : ""}${_scopeId}>${ssrInterpolate(group)}</option>`);
							});
							_push(`<!--]--><option value="__new__"${ssrIncludeBooleanAttr(Array.isArray(selectedGroup.value) ? ssrLooseContain(selectedGroup.value, "__new__") : ssrLooseEqual(selectedGroup.value, "__new__")) ? " selected" : ""}${_scopeId}>+ Create New Group...</option></select></div><div class="space-y-1"${_scopeId}><label for="menu-parent" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Parent Menu <span class="text-[10px] text-slate-400 normal-case"${_scopeId}>(Optional)</span></label><select id="menu-parent" 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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}><option value=""${ssrIncludeBooleanAttr(Array.isArray(unref(form).parent_id) ? ssrLooseContain(unref(form).parent_id, "") : ssrLooseEqual(unref(form).parent_id, "")) ? " selected" : ""}${_scopeId}>None (Top Level)</option><!--[-->`);
							ssrRenderList(__props.parentOptions, (parent) => {
								_push(`<option${ssrRenderAttr("value", parent.id)}${ssrIncludeBooleanAttr(editingMenu.value?.id === parent.id) ? " disabled" : ""}${ssrIncludeBooleanAttr(Array.isArray(unref(form).parent_id) ? ssrLooseContain(unref(form).parent_id, parent.id) : ssrLooseEqual(unref(form).parent_id, parent.id)) ? " selected" : ""}${_scopeId}>${ssrInterpolate(parent.title)}</option>`);
							});
							_push(`<!--]--></select></div></div>`);
							if (selectedGroup.value === "__new__") _push(`<div class="space-y-1 animate-in slide-in-from-top duration-200"${_scopeId}><label for="custom-menu-group" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Custom Group Name</label><input id="custom-menu-group"${ssrRenderAttr("value", customGroupName.value)} type="text" required placeholder="Type custom group name..." 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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}></div>`);
							else _push(`<!---->`);
							_push(`<div class="grid grid-cols-2 gap-4"${_scopeId}><div class="space-y-1"${_scopeId}><label for="menu-sort" class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Sort Order</label><input id="menu-sort"${ssrRenderAttr("value", unref(form).sort_order)} type="number" 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-950 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}></div></div><div class="space-y-2"${_scopeId}><span class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Select Icon</span><div class="grid grid-cols-8 gap-2 border border-slate-200 dark:border-slate-800 rounded-lg p-3 bg-slate-50/50 dark:bg-slate-900/30"${_scopeId}><!--[-->`);
							ssrRenderList(availableIcons, (iconName) => {
								_push(`<button type="button" class="${ssrRenderClass(["h-10 w-10 flex items-center justify-center rounded-lg border transition-all", unref(form).icon === iconName ? "bg-red-500 border-red-500 text-white shadow-sm" : "bg-white border-slate-200 hover:bg-slate-100 dark:bg-slate-900 dark:border-slate-800 dark:hover:bg-slate-850 text-slate-700 dark:text-slate-350"])}"${ssrRenderAttr("title", iconName)}${_scopeId}>`);
								ssrRenderVNode(_push, createVNode(resolveDynamicComponent(getIcon(iconName)), { class: "h-4.5 w-4.5" }, null), _parent, _scopeId);
								_push(`</button>`);
							});
							_push(`<!--]--></div></div><div class="grid grid-cols-2 gap-4"${_scopeId}><div class="space-y-2"${_scopeId}><span class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Require Roles</span><div class="border border-slate-200 dark:border-slate-800 rounded-lg p-2.5 bg-slate-50/50 dark:bg-slate-900/30 max-h-36 overflow-y-auto space-y-2"${_scopeId}><!--[-->`);
							ssrRenderList(__props.roles, (role) => {
								_push(`<div class="flex items-center space-x-2 cursor-pointer select-none text-xs"${_scopeId}><div class="${ssrRenderClass(["h-4 w-4 rounded border flex items-center justify-center transition-all", unref(form).roles.includes(role.name) ? "bg-red-500 border-red-500 text-white" : "border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-900"])}"${_scopeId}>`);
								if (unref(form).roles.includes(role.name)) _push(ssrRenderComponent(unref(Check), { class: "h-2.5 w-2.5 stroke-[3]" }, null, _parent, _scopeId));
								else _push(`<!---->`);
								_push(`</div><span class="font-medium text-slate-700 dark:text-slate-350 capitalize"${_scopeId}>${ssrInterpolate(role.name)}</span></div>`);
							});
							_push(`<!--]--></div></div><div class="space-y-2"${_scopeId}><span class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>Require Permissions</span><div class="border border-slate-200 dark:border-slate-800 rounded-lg p-2.5 bg-slate-50/50 dark:bg-slate-900/30 max-h-36 overflow-y-auto space-y-2"${_scopeId}><!--[-->`);
							ssrRenderList(__props.permissions, (perm) => {
								_push(`<div class="flex items-center space-x-2 cursor-pointer select-none text-xs"${_scopeId}><div class="${ssrRenderClass(["h-4 w-4 rounded border flex items-center justify-center transition-all", unref(form).permissions.includes(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 (unref(form).permissions.includes(perm.name)) _push(ssrRenderComponent(unref(Check), { class: "h-2.5 w-2.5 stroke-[3]" }, null, _parent, _scopeId));
								else _push(`<!---->`);
								_push(`</div><span class="font-medium text-slate-700 dark:text-slate-350 capitalize"${_scopeId}>${ssrInterpolate(perm.name)}</span></div>`);
							});
							_push(`<!--]--></div></div></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-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"${_scopeId}> Cancel </button><button type="submit"${ssrIncludeBooleanAttr(unref(form).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"${_scopeId}>`);
							if (unref(form).processing) _push(`<span${_scopeId}>Saving...</span>`);
							else _push(`<span${_scopeId}>Save Changes</span>`);
							_push(`</button></div></form></div></div>`);
						} else _push(`<!---->`);
						if (isDeleteModalOpen.value) {
							_push(`<div class="fixed inset-0 z-50 flex items-center justify-center p-4"${_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-950/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 Menu Item</h3><p class="text-sm text-slate-500 dark:text-slate-400 leading-normal"${_scopeId}> Are you sure you want to delete <span class="font-semibold text-slate-950 dark:text-slate-50"${_scopeId}>${ssrInterpolate(menuToDelete.value?.title)}</span>? This action will permanently remove it from the sidebar navigation. </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}> Delete </button></div></div></div>`);
						} else _push(`<!---->`);
						if (isManageGroupsOpen.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}>Manage Menu Groups</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><div class="p-6 space-y-4 max-h-[60vh] overflow-y-auto"${_scopeId}>`);
							if (__props.groups.length === 0) _push(`<div class="text-center text-xs text-slate-500 italic"${_scopeId}> No groups found. </div>`);
							else _push(`<!---->`);
							_push(`<!--[-->`);
							ssrRenderList(__props.groups, (group) => {
								_push(`<div class="flex items-center justify-between py-2 border-b border-slate-100 dark:border-slate-900 last:border-0"${_scopeId}><span class="text-sm font-medium text-slate-800 dark:text-slate-200"${_scopeId}>${ssrInterpolate(group)}</span><div class="flex items-center gap-1.5"${_scopeId}><button class="p-1 text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 rounded transition-colors cursor-pointer" title="Rename Group"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Edit2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
								_push(`</button><button class="p-1 text-red-500 hover:bg-red-50 dark:hover:bg-red-950/20 rounded transition-colors cursor-pointer" title="Delete Group"${_scopeId}>`);
								_push(ssrRenderComponent(unref(Trash2), { class: "h-3.5 w-3.5" }, null, _parent, _scopeId));
								_push(`</button></div></div>`);
							});
							_push(`<!--]--></div><div class="px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end 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}> Close </button></div></div></div>`);
						} else _push(`<!---->`);
						if (isRenamingGroup.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 Menu Group</h3><button class="rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-600 dark:hover:text-slate-300 cursor-pointer text-xl"${_scopeId}> × </button></div><form class="space-y-4 p-6"${_scopeId}><div class="space-y-1.5"${_scopeId}><label class="block text-xs font-semibold uppercase tracking-wider text-slate-500"${_scopeId}>New Group Name</label><input${ssrRenderAttr("value", unref(renameGroupForm).new_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-950 dark:text-slate-50 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"${_scopeId}>`);
							if (unref(renameGroupForm).errors.new_name) _push(`<span class="text-xs text-red-600 dark:text-red-400 font-medium block mt-1"${_scopeId}>${ssrInterpolate(unref(renameGroupForm).errors.new_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 cursor-pointer"${_scopeId}> Cancel </button><button type="submit"${ssrIncludeBooleanAttr(unref(renameGroupForm).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 (isDeletingGroup.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-950/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 Menu Group</h3><p class="text-sm text-slate-500 dark:text-slate-400 leading-normal"${_scopeId}> Are you sure you want to delete the group <span class="font-semibold text-slate-950 dark:text-slate-50"${_scopeId}>${ssrInterpolate(unref(deleteGroupForm).group_name)}</span>? **This will permanently delete all menu items belonging to this group.** </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"${ssrIncludeBooleanAttr(unref(deleteGroupForm).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}> Yes, Delete Group </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" }, "Menu Manager"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 mt-1" }, " Configure database-driven sidebar menus, sorting order, and access filters. ")]), createVNode("div", { class: "flex items-center gap-3" }, [createVNode("button", {
								onClick: ($event) => isManageGroupsOpen.value = true,
								class: "inline-flex items-center gap-2 px-4 py-2 text-sm font-semibold text-slate-700 dark:text-slate-200 bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-900 rounded-lg shadow-sm transition-all focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 cursor-pointer"
							}, [createVNode(unref(Settings), { class: "h-4 w-4" }), createTextVNode(" Manage Groups ")], 8, ["onClick"]), createVNode("button", {
								onClick: openCreateModal,
								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 focus:ring-offset-2 cursor-pointer"
							}, [createVNode(unref(Plus), { class: "h-4 w-4" }), createTextVNode(" Add Menu Item ")])])]),
							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: "grid grid-cols-1 gap-6" }, [__props.menus.length === 0 ? (openBlock(), createBlock("div", {
								key: 0,
								class: "bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl p-12 text-center text-slate-500 dark:text-slate-400"
							}, " No menu items found. Click \"Add Menu Item\" to create one. ")) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(__props.menus, (parent) => {
								return openBlock(), createBlock("div", {
									key: parent.id,
									class: "bg-white dark:bg-slate-950 border border-slate-200 dark:border-slate-800 rounded-xl shadow-sm p-5 space-y-4"
								}, [
									createVNode("div", { class: "flex items-center justify-between border-b border-slate-100 dark:border-slate-900 pb-3" }, [createVNode("div", { class: "flex items-center gap-3" }, [createVNode("div", { class: "h-8 w-8 rounded-lg bg-red-50 dark:bg-red-950/30 flex items-center justify-center border border-red-100 dark:border-red-900/40" }, [(openBlock(), createBlock(resolveDynamicComponent(getIcon(parent.icon)), { class: "h-4.5 w-4.5 text-red-600 dark:text-red-400" }))]), createVNode("div", null, [createVNode("h3", { class: "text-sm font-semibold text-slate-900 dark:text-slate-100" }, toDisplayString(parent.title), 1), createVNode("span", { class: "text-[10px] bg-slate-100 dark:bg-slate-900 px-1.5 py-0.5 rounded text-slate-500 dark:text-slate-400 font-mono" }, toDisplayString(parent.href), 1)])]), createVNode("div", { class: "flex items-center gap-4" }, [createVNode("div", { class: "text-xs text-slate-400 dark:text-slate-500" }, [
										createTextVNode(" Order: "),
										createVNode("span", { class: "font-semibold text-slate-700 dark:text-slate-300" }, "#" + toDisplayString(parent.sort_order), 1),
										createTextVNode(" | Group: "),
										createVNode("span", { class: "font-semibold text-slate-700 dark:text-slate-300" }, toDisplayString(parent.group_name), 1)
									]), createVNode("div", { class: "flex items-center gap-1.5" }, [createVNode("button", {
										onClick: ($event) => openEditModal(parent),
										class: "p-1 rounded-lg text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-900 dark:hover:text-slate-200 transition-colors"
									}, [createVNode(unref(Edit2), { class: "h-3.5 w-3.5" })], 8, ["onClick"]), createVNode("button", {
										onClick: ($event) => openDeleteModal(parent),
										class: "p-1 rounded-lg text-slate-400 hover:bg-red-50 dark:hover:bg-red-950/20 hover:text-red-600 dark:hover:text-red-400 transition-colors"
									}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" })], 8, ["onClick"])])])]),
									createVNode("div", { class: "flex flex-wrap gap-2 text-xs" }, [
										createVNode("span", { class: "text-slate-400 select-none" }, "Access restrictions:"),
										(!parent.roles || parent.roles.length === 0) && (!parent.permissions || parent.permissions.length === 0) ? (openBlock(), createBlock("span", {
											key: 0,
											class: "text-emerald-600 dark:text-emerald-400 italic"
										}, "Public (All users)")) : createCommentVNode("", true),
										(openBlock(true), createBlock(Fragment, null, renderList(parent.roles, (role) => {
											return openBlock(), createBlock("span", {
												key: role,
												class: "inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-slate-100 text-slate-700 border border-slate-200 dark:bg-slate-900 dark:text-slate-350 dark:border-slate-800"
											}, [createVNode(unref(Shield), { class: "h-3 w-3" }), createTextVNode(" Role: " + toDisplayString(role), 1)]);
										}), 128)),
										(openBlock(true), createBlock(Fragment, null, renderList(parent.permissions, (perm) => {
											return openBlock(), createBlock("span", {
												key: perm,
												class: "inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-red-50 text-red-700 border border-red-100 dark:bg-red-950/20 dark:text-red-400 dark:border-red-900/40"
											}, [createVNode(unref(Key), { class: "h-3 w-3" }), createTextVNode(" Perm: " + toDisplayString(perm), 1)]);
										}), 128))
									]),
									parent.children && parent.children.length > 0 ? (openBlock(), createBlock("div", {
										key: 0,
										class: "pl-8 border-l border-slate-150 dark:border-slate-850 space-y-3 mt-3"
									}, [(openBlock(true), createBlock(Fragment, null, renderList(parent.children, (child) => {
										return openBlock(), createBlock("div", {
											key: child.id,
											class: "flex items-center justify-between py-1 bg-slate-50/40 dark:bg-slate-900/10 p-2 rounded-lg"
										}, [createVNode("div", { class: "flex items-center gap-2.5" }, [
											(openBlock(), createBlock(resolveDynamicComponent(getIcon(child.icon)), { class: "h-3.5 w-3.5 text-slate-450 dark:text-slate-500" })),
											createVNode("span", { class: "text-xs font-medium text-slate-700 dark:text-slate-300" }, toDisplayString(child.title), 1),
											createVNode("span", { class: "text-[9px] bg-slate-100 dark:bg-slate-850 px-1 py-0.2 rounded text-slate-450 font-mono" }, toDisplayString(child.href), 1)
										]), createVNode("div", { class: "flex items-center gap-3" }, [createVNode("span", { class: "text-[10px] text-slate-400 font-mono" }, "Order: #" + toDisplayString(child.sort_order), 1), createVNode("div", { class: "flex items-center gap-1" }, [createVNode("button", {
											onClick: ($event) => openEditModal(child),
											class: "p-1 rounded text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 transition-colors"
										}, [createVNode(unref(Edit2), { class: "h-3 w-3" })], 8, ["onClick"]), createVNode("button", {
											onClick: ($event) => openDeleteModal(child),
											class: "p-1 rounded text-slate-400 hover:bg-red-50 dark:hover:bg-red-950/20 hover:text-red-650 transition-colors"
										}, [createVNode(unref(Trash2), { class: "h-3 w-3" })], 8, ["onClick"])])])]);
									}), 128))])) : createCommentVNode("", true)
								]);
							}), 128))])
						]),
						isFormModalOpen.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) => isFormModalOpen.value = false,
							class: "fixed inset-0 bg-slate-950/60 backdrop-blur-sm transition-opacity"
						}, 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-xl overflow-hidden flex flex-col max-h-[90vh] 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" }, toDisplayString(editingMenu.value ? "Edit Menu Item" : "Add Menu Item"), 1), createVNode("button", {
							onClick: ($event) => isFormModalOpen.value = false,
							class: "rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-600 dark:hover:text-slate-300 transition-colors"
						}, " × ", 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(submitForm, ["prevent"]),
							class: "flex flex-col overflow-hidden"
						}, [createVNode("div", { class: "p-6 overflow-y-auto space-y-4" }, [
							createVNode("div", { class: "grid grid-cols-2 gap-4" }, [createVNode("div", { class: "space-y-1" }, [createVNode("label", {
								for: "menu-title",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Menu Title"), withDirectives(createVNode("input", {
								id: "menu-title",
								"onUpdate:modelValue": ($event) => unref(form).title = $event,
								type: "text",
								required: "",
								placeholder: "e.g. Audit Logs",
								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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(form).title]])]), createVNode("div", { class: "space-y-1" }, [createVNode("label", {
								for: "menu-href",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Path / URL"), withDirectives(createVNode("input", {
								id: "menu-href",
								"onUpdate:modelValue": ($event) => unref(form).href = $event,
								type: "text",
								required: "",
								placeholder: "e.g. /logs",
								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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, unref(form).href]])])]),
							createVNode("div", { class: "grid grid-cols-2 gap-4" }, [createVNode("div", { class: "space-y-1" }, [createVNode("label", {
								for: "menu-group",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Group Name"), withDirectives(createVNode("select", {
								id: "menu-group",
								"onUpdate:modelValue": ($event) => selectedGroup.value = $event,
								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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
							}, [(openBlock(true), createBlock(Fragment, null, renderList(availableGroups.value, (group) => {
								return openBlock(), createBlock("option", {
									key: group,
									value: group
								}, toDisplayString(group), 9, ["value"]);
							}), 128)), createVNode("option", { value: "__new__" }, "+ Create New Group...")], 8, ["onUpdate:modelValue"]), [[vModelSelect, selectedGroup.value]])]), createVNode("div", { class: "space-y-1" }, [createVNode("label", {
								for: "menu-parent",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, [createTextVNode("Parent Menu "), createVNode("span", { class: "text-[10px] text-slate-400 normal-case" }, "(Optional)")]), withDirectives(createVNode("select", {
								id: "menu-parent",
								"onUpdate:modelValue": ($event) => unref(form).parent_id = $event,
								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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
							}, [createVNode("option", { value: "" }, "None (Top Level)"), (openBlock(true), createBlock(Fragment, null, renderList(__props.parentOptions, (parent) => {
								return openBlock(), createBlock("option", {
									key: parent.id,
									value: parent.id,
									disabled: editingMenu.value?.id === parent.id
								}, toDisplayString(parent.title), 9, ["value", "disabled"]);
							}), 128))], 8, ["onUpdate:modelValue"]), [[vModelSelect, unref(form).parent_id]])])]),
							selectedGroup.value === "__new__" ? (openBlock(), createBlock("div", {
								key: 0,
								class: "space-y-1 animate-in slide-in-from-top duration-200"
							}, [createVNode("label", {
								for: "custom-menu-group",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Custom Group Name"), withDirectives(createVNode("input", {
								id: "custom-menu-group",
								"onUpdate:modelValue": ($event) => customGroupName.value = $event,
								type: "text",
								required: "",
								placeholder: "Type custom group name...",
								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 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-transparent transition-all"
							}, null, 8, ["onUpdate:modelValue"]), [[vModelText, customGroupName.value]])])) : createCommentVNode("", true),
							createVNode("div", { class: "grid grid-cols-2 gap-4" }, [createVNode("div", { class: "space-y-1" }, [createVNode("label", {
								for: "menu-sort",
								class: "block text-xs font-semibold uppercase tracking-wider text-slate-500"
							}, "Sort Order"), withDirectives(createVNode("input", {
								id: "menu-sort",
								"onUpdate:modelValue": ($event) => unref(form).sort_order = $event,
								type: "number",
								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-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(form).sort_order]])])]),
							createVNode("div", { class: "space-y-2" }, [createVNode("span", { class: "block text-xs font-semibold uppercase tracking-wider text-slate-500" }, "Select Icon"), createVNode("div", { class: "grid grid-cols-8 gap-2 border border-slate-200 dark:border-slate-800 rounded-lg p-3 bg-slate-50/50 dark:bg-slate-900/30" }, [(openBlock(), createBlock(Fragment, null, renderList(availableIcons, (iconName) => {
								return createVNode("button", {
									key: iconName,
									type: "button",
									onClick: ($event) => selectIcon(iconName),
									class: ["h-10 w-10 flex items-center justify-center rounded-lg border transition-all", unref(form).icon === iconName ? "bg-red-500 border-red-500 text-white shadow-sm" : "bg-white border-slate-200 hover:bg-slate-100 dark:bg-slate-900 dark:border-slate-800 dark:hover:bg-slate-850 text-slate-700 dark:text-slate-350"],
									title: iconName
								}, [(openBlock(), createBlock(resolveDynamicComponent(getIcon(iconName)), { class: "h-4.5 w-4.5" }))], 10, ["onClick", "title"]);
							}), 64))])]),
							createVNode("div", { class: "grid grid-cols-2 gap-4" }, [createVNode("div", { class: "space-y-2" }, [createVNode("span", { class: "block text-xs font-semibold uppercase tracking-wider text-slate-500" }, "Require Roles"), createVNode("div", { class: "border border-slate-200 dark:border-slate-800 rounded-lg p-2.5 bg-slate-50/50 dark:bg-slate-900/30 max-h-36 overflow-y-auto space-y-2" }, [(openBlock(true), createBlock(Fragment, null, renderList(__props.roles, (role) => {
								return openBlock(), createBlock("div", {
									key: role.id,
									onClick: ($event) => toggleRole(role.name),
									class: "flex items-center space-x-2 cursor-pointer select-none text-xs"
								}, [createVNode("div", { class: ["h-4 w-4 rounded border flex items-center justify-center transition-all", unref(form).roles.includes(role.name) ? "bg-red-500 border-red-500 text-white" : "border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-900"] }, [unref(form).roles.includes(role.name) ? (openBlock(), createBlock(unref(Check), {
									key: 0,
									class: "h-2.5 w-2.5 stroke-[3]"
								})) : createCommentVNode("", true)], 2), createVNode("span", { class: "font-medium text-slate-700 dark:text-slate-350 capitalize" }, toDisplayString(role.name), 1)], 8, ["onClick"]);
							}), 128))])]), createVNode("div", { class: "space-y-2" }, [createVNode("span", { class: "block text-xs font-semibold uppercase tracking-wider text-slate-500" }, "Require Permissions"), createVNode("div", { class: "border border-slate-200 dark:border-slate-800 rounded-lg p-2.5 bg-slate-50/50 dark:bg-slate-900/30 max-h-36 overflow-y-auto space-y-2" }, [(openBlock(true), createBlock(Fragment, null, renderList(__props.permissions, (perm) => {
								return openBlock(), createBlock("div", {
									key: perm.id,
									onClick: ($event) => togglePermission(perm.name),
									class: "flex items-center space-x-2 cursor-pointer select-none text-xs"
								}, [createVNode("div", { class: ["h-4 w-4 rounded border flex items-center justify-center transition-all", unref(form).permissions.includes(perm.name) ? "bg-red-500 border-red-500 text-white" : "border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-900"] }, [unref(form).permissions.includes(perm.name) ? (openBlock(), createBlock(unref(Check), {
									key: 0,
									class: "h-2.5 w-2.5 stroke-[3]"
								})) : createCommentVNode("", true)], 2), createVNode("span", { class: "font-medium text-slate-700 dark:text-slate-350 capitalize" }, toDisplayString(perm.name), 1)], 8, ["onClick"]);
							}), 128))])])])
						]), 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) => isFormModalOpen.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"
						}, " Cancel ", 8, ["onClick"]), createVNode("button", {
							type: "submit",
							disabled: unref(form).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"
						}, [unref(form).processing ? (openBlock(), createBlock("span", { key: 0 }, "Saving...")) : (openBlock(), createBlock("span", { key: 1 }, "Save Changes"))], 8, ["disabled"])])], 32)])])) : createCommentVNode("", true),
						isDeleteModalOpen.value ? (openBlock(), createBlock("div", {
							key: 1,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4"
						}, [createVNode("div", {
							onClick: ($event) => isDeleteModalOpen.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-950/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 Menu Item"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 leading-normal" }, [
							createTextVNode(" Are you sure you want to delete "),
							createVNode("span", { class: "font-semibold text-slate-950 dark:text-slate-50" }, toDisplayString(menuToDelete.value?.title), 1),
							createTextVNode("? This action will permanently remove it from the sidebar navigation. ")
						])])]), 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) => isDeleteModalOpen.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: deleteMenuItem,
							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"
						}, " Delete ")])])])) : createCommentVNode("", true),
						isManageGroupsOpen.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) => isManageGroupsOpen.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" }, "Manage Menu Groups"), createVNode("button", {
								onClick: ($event) => isManageGroupsOpen.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("div", { class: "p-6 space-y-4 max-h-[60vh] overflow-y-auto" }, [__props.groups.length === 0 ? (openBlock(), createBlock("div", {
								key: 0,
								class: "text-center text-xs text-slate-500 italic"
							}, " No groups found. ")) : createCommentVNode("", true), (openBlock(true), createBlock(Fragment, null, renderList(__props.groups, (group) => {
								return openBlock(), createBlock("div", {
									key: group,
									class: "flex items-center justify-between py-2 border-b border-slate-100 dark:border-slate-900 last:border-0"
								}, [createVNode("span", { class: "text-sm font-medium text-slate-800 dark:text-slate-200" }, toDisplayString(group), 1), createVNode("div", { class: "flex items-center gap-1.5" }, [createVNode("button", {
									onClick: ($event) => openRenameGroupModal(group),
									class: "p-1 text-slate-500 hover:bg-slate-100 dark:hover:bg-slate-900 rounded transition-colors cursor-pointer",
									title: "Rename Group"
								}, [createVNode(unref(Edit2), { class: "h-3.5 w-3.5" })], 8, ["onClick"]), createVNode("button", {
									onClick: ($event) => openDeleteGroupModal(group),
									class: "p-1 text-red-500 hover:bg-red-50 dark:hover:bg-red-950/20 rounded transition-colors cursor-pointer",
									title: "Delete Group"
								}, [createVNode(unref(Trash2), { class: "h-3.5 w-3.5" })], 8, ["onClick"])])]);
							}), 128))]),
							createVNode("div", { class: "px-6 py-4 border-t border-slate-200 dark:border-slate-800 flex justify-end bg-slate-50/50 dark:bg-slate-900/50" }, [createVNode("button", {
								type: "button",
								onClick: ($event) => isManageGroupsOpen.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"
							}, " Close ", 8, ["onClick"])])
						])])) : createCommentVNode("", true),
						isRenamingGroup.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) => isRenamingGroup.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 Menu Group"), createVNode("button", {
							onClick: ($event) => isRenamingGroup.value = false,
							class: "rounded-lg p-1 text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-900 hover:text-slate-600 dark:hover:text-slate-300 cursor-pointer text-xl"
						}, " × ", 8, ["onClick"])]), createVNode("form", {
							onSubmit: withModifiers(submitRenameGroup, ["prevent"]),
							class: "space-y-4 p-6"
						}, [createVNode("div", { class: "space-y-1.5" }, [
							createVNode("label", { class: "block text-xs font-semibold uppercase tracking-wider text-slate-500" }, "New Group Name"),
							withDirectives(createVNode("input", {
								"onUpdate:modelValue": ($event) => unref(renameGroupForm).new_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-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(renameGroupForm).new_name]]),
							unref(renameGroupForm).errors.new_name ? (openBlock(), createBlock("span", {
								key: 0,
								class: "text-xs text-red-600 dark:text-red-400 font-medium block mt-1"
							}, toDisplayString(unref(renameGroupForm).errors.new_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) => isRenamingGroup.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: "submit",
							disabled: unref(renameGroupForm).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),
						isDeletingGroup.value ? (openBlock(), createBlock("div", {
							key: 4,
							class: "fixed inset-0 z-50 flex items-center justify-center p-4 animate-fade-in"
						}, [createVNode("div", {
							onClick: ($event) => isDeletingGroup.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-950/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 Menu Group"), createVNode("p", { class: "text-sm text-slate-500 dark:text-slate-400 leading-normal" }, [
							createTextVNode(" Are you sure you want to delete the group "),
							createVNode("span", { class: "font-semibold text-slate-950 dark:text-slate-50" }, toDisplayString(unref(deleteGroupForm).group_name), 1),
							createTextVNode("? **This will permanently delete all menu items belonging to this group.** ")
						])])]), 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) => isDeletingGroup.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: submitDeleteGroup,
							disabled: unref(deleteGroupForm).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"
						}, " Yes, Delete Group ", 8, ["disabled"])])])])) : createCommentVNode("", true)
					];
				}),
				_: 1
			}, _parent));
			_push(`<!--]-->`);
		};
	}
});
//#endregion
//#region resources/js/Pages/Menus/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/Menus/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 };
