import { jsx as e, jsxs as t, Fragment as er } from "react/jsx-runtime";
import Re, { useState as d, useMemo as te, useCallback as A, createRef as rr, useEffect as ze } from "react";
import { useParams as tr, useNavigate as ar, Link as Ge } from "react-router-dom";
import { useTranslation as Xe } from "react-i18next";
import { k as sr, p as lr, x as nr, y as or, i as $, B as ir, q as cr } from "./index-Dh9kUeDn.js";
import { Loader2 as y, AlertCircle as Be, Check as He, X as $e, Save as Ye, Star as dr, Eye as Oe, Ban as mr, ChevronRight as Ue, ChevronDown as Ie, Layers as ur, FolderOpen as vr, Database as pr, FileText as xr, Box as hr, Play as br, UserPlus as gr, Trash2 as Ae, Edit as fr, Plus as Le, Shield as We, Settings as yr, Users as _e, UsersRound as Me, Languages as Nr, ArrowLeft as wr, Lock as qe, AlertTriangle as Cr, CheckCircle as Dr, Search as Ke, Edit2 as kr } from "lucide-react";
import { d as Sr, c as Rr, g as $r, a as Ar, P as Lr, b as Fr } from "./PermissionPopover-BLRa-xh-.js";
const Tr = {
  "*": /* @__PURE__ */ e(We, { className: "h-3 w-3" }),
  read: /* @__PURE__ */ e(Oe, { className: "h-3 w-3" }),
  create: /* @__PURE__ */ e(Le, { className: "h-3 w-3" }),
  update: /* @__PURE__ */ e(fr, { className: "h-3 w-3" }),
  delete: /* @__PURE__ */ e(Ae, { className: "h-3 w-3" }),
  assign: /* @__PURE__ */ e(gr, { className: "h-3 w-3" }),
  execute: /* @__PURE__ */ e(br, { className: "h-3 w-3" })
}, Pr = {
  "*": "bg-[var(--accent-bg)] text-[var(--accent-text)] border-[var(--accent-border)]",
  read: "bg-[var(--info-bg)] text-[var(--info-text)] border-[var(--info-border)]",
  create: "bg-[var(--success-bg)] text-[var(--success-text)] border-[var(--success-border)]",
  update: "bg-[var(--warning-bg)] text-[var(--warning-text)] border-[var(--warning-border)]",
  delete: "bg-[var(--error-bg)] text-[var(--error-text)] border-[var(--error-border)]",
  assign: "bg-[var(--accent-bg)] text-[var(--accent-text)] border-[var(--accent-border)]",
  execute: "bg-[var(--warning-bg)] text-[var(--warning-text)] border-[var(--warning-border)]"
};
function jr(s, l, g) {
  return s.map((i) => {
    const L = i.applications.filter((x) => l === "all" || x.application === l).map((x) => ({
      ...x,
      modules: x.modules.filter((S) => g === "all" || S.module.moduleLabel === g)
    })).filter((x) => x.modules.length > 0);
    return { ...i, applications: L };
  }).filter((i) => i.applications.length > 0);
}
function Er(s, l, g) {
  return s.map((i) => {
    const L = i.applications.map((x) => ({
      ...x,
      modules: x.modules.filter((S) => {
        const { status: F } = g(S);
        return l.has(F);
      })
    })).filter((x) => x.modules.length > 0);
    return { ...i, applications: L };
  }).filter((i) => i.applications.length > 0);
}
function Ur({
  section: s,
  resources: l,
  moduleIndex: g,
  sectionIndex: i,
  collapsedSections: L,
  renderResourceRow: x
}) {
  const S = l.length > 0, F = L.has(s.id);
  return /* @__PURE__ */ t(Re.Fragment, { children: [
    x(s, g + i + 1, "section", S, F),
    S && !F && l.map(
      (K, w) => x(K, g + i + w + 2, "resource", !1, !1)
    )
  ] }, s.id);
}
function Ir({ roleId: s }) {
  const { t: l } = Xe("admin"), { user: g } = sr(), { collapsedContexts: i, collapsedApps: L, toggleContext: x, toggleApp: S } = lr(), [F, K] = d(/* @__PURE__ */ new Set()), [w, Fe] = d(/* @__PURE__ */ new Set()), [h, N] = d(/* @__PURE__ */ new Set()), [ae, C] = d(null), [v, U] = d("all"), [O, ge] = d("all"), [se, R] = d("all"), le = te(() => g ? nr(g.permissions) : !1, [g]), {
    loading: ne,
    error: oe,
    roles: fe,
    filteredResources: I,
    hasChanges: f,
    saving: b,
    saveSuccess: T,
    saveError: ie,
    togglePermission: ye,
    saveChanges: ce,
    resetChanges: de,
    getPermissionInheritance: P
  } = or({ canEditSystemRoles: le }), p = te(() => fe.find((a) => a.id === s), [fe, s]), D = te(() => !(!p || p.isSystem && !le), [p, le]), V = (a) => {
    N((o) => {
      const c = new Set(o);
      return c.has(a) ? c.delete(a) : c.add(a), c;
    });
  }, Ne = (a) => {
    K((o) => {
      const c = new Set(o);
      return c.has(a) ? c.delete(a) : c.add(a), c;
    });
  }, we = (a) => {
    Fe((o) => {
      const c = new Set(o);
      return c.has(a) ? c.delete(a) : c.add(a), c;
    });
  }, X = te(() => {
    const a = /* @__PURE__ */ new Set(), o = [], c = [];
    return I.forEach((m) => {
      if (m.level === "module") {
        const u = m.contextLabel ?? m.applicationLabel;
        a.add(u);
        const j = `${u}:${m.applicationLabel}`;
        o.find((k) => `${k.context}:${k.app}` === j) || o.push({
          context: u,
          app: m.applicationLabel,
          label: m.applicationLabel
        }), c.push({
          context: u,
          app: m.applicationLabel,
          module: m.moduleLabel,
          label: m.moduleLabel
        });
      }
    }), {
      contexts: Array.from(a).sort((m, u) => m.localeCompare(u)),
      applications: o.sort((m, u) => m.label.localeCompare(u.label)),
      modules: c.sort((m, u) => m.label.localeCompare(u.label))
    };
  }, [I]), Y = A((a) => {
    !p || !D || ye(p.id, a);
  }, [p, D, ye]), W = A((a) => {
    if (!p) return !1;
    const o = P(p.id, a);
    return o.isDirect || o.isInherited;
  }, [p, P]), M = A((a) => Sr(
    a.module,
    a.sections,
    W
  ), [W]), me = A((a) => Rr(a, W), [W]), Ce = A((a) => p ? a.permissions.filter((o) => {
    const c = P(p.id, o.id);
    return c.isDirect || c.isInherited;
  }).map((o) => o.action) : [], [p, P]), ue = A((a) => v === "all" ? a : a.filter((o) => o.context === v), [v]), ve = A((a) => jr(a, O, se), [O, se]), pe = A((a) => h.size === 0 ? a : Er(a, h, M), [h, M]), xe = te(() => {
    let a = $r(I);
    return a = ue(a), a = ve(a), a = pe(a), a;
  }, [I, ue, ve, pe]), z = te(() => xe.reduce((a, o) => a + o.applications.reduce((c, m) => c + m.modules.length, 0), 0), [xe]), Te = A((a, o) => {
    o === "module" ? Ne(a) : o === "section" && we(a);
  }, [Ne, we]), Pe = (a) => {
    C(ae === a ? null : a);
  };
  if (ne)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ t("div", { className: "text-center", children: [
      /* @__PURE__ */ e(y, { className: "h-8 w-8 animate-spin text-[var(--color-accent-500)] mx-auto mb-4" }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: l("userPermissions.loading") })
    ] }) });
  if (oe)
    return /* @__PURE__ */ e("div", { className: "p-4 rounded-[var(--radius-card)] bg-[var(--error-bg)] border border-[var(--error-border)]", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
      /* @__PURE__ */ e(Be, { className: "h-5 w-5 text-[var(--error-text)]" }),
      /* @__PURE__ */ e("p", { className: "text-[var(--error-text)]", children: oe })
    ] }) });
  if (!p)
    return /* @__PURE__ */ e("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: l("roleDetail.notFound") });
  const je = (a) => a === "resource" ? /* @__PURE__ */ e(pr, { className: "h-3.5 w-3.5 text-[var(--text-muted)]" }) : a === "section" ? /* @__PURE__ */ e(xr, { className: "h-3.5 w-3.5 text-[var(--text-muted)]" }) : /* @__PURE__ */ e(hr, { className: "h-3.5 w-3.5 text-[var(--text-secondary)]" }), De = (a) => a === "resource" ? "text-[var(--text-muted)] italic" : a === "section" ? "text-[var(--text-secondary)]" : "font-medium text-[var(--text-primary)]", J = (a) => a === "resource" ? "pl-28" : a === "section" ? "pl-22" : "pl-16", ke = (a, o, c, m) => a ? /* @__PURE__ */ e(
    "button",
    {
      onClick: () => Te(o, c),
      className: "p-0.5 hover:bg-[var(--bg-hover)] rounded",
      children: m ? /* @__PURE__ */ e(Ue, { className: "h-3 w-3 text-[var(--text-muted)]" }) : /* @__PURE__ */ e(Ie, { className: "h-3 w-3 text-[var(--text-muted)]" })
    }
  ) : null, G = (a) => a.length === 0 ? /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-muted)] italic", children: l("assignments.noPermissions") }) : a.map((o) => {
    const c = Pr[o] || "bg-[var(--bg-secondary)] text-[var(--text-secondary)] border-[var(--border-color)]", m = Tr[o] || /* @__PURE__ */ e(Oe, { className: "h-3 w-3" });
    return /* @__PURE__ */ t(
      "div",
      {
        className: `inline-flex items-center gap-1.5 px-2 py-0.5 rounded-[var(--radius-badge)] border text-xs font-medium ${c}`,
        title: l(`assignments.actions.${o === "*" ? "all" : o}.description`),
        children: [
          m,
          /* @__PURE__ */ e("span", { className: "capitalize", children: l(`assignments.actions.${o === "*" ? "all" : o}.label`) })
        ]
      },
      o
    );
  }), Q = (a, o, c, m = !1, u = !1) => {
    const { status: j, grantedCount: k } = me(a), B = ae === a.id, E = rr(), H = Ar(j), Z = Ce(a), _ = J(c), ee = o % 2 === 0 ? "item-light" : "item-medium";
    return /* @__PURE__ */ t(
      "tr",
      {
        className: `hover:bg-[var(--bg-hover)] ${ee}`,
        children: [
          /* @__PURE__ */ e(
            "td",
            {
              className: `sticky left-0 z-10 ${ee} px-3 py-2 ${_}`,
              style: { width: "280px", minWidth: "280px", maxWidth: "280px" },
              children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
                ke(m, a.id, c, u),
                je(c),
                /* @__PURE__ */ e("span", { className: `text-sm ${De(c)}`, children: a.moduleLabel }),
                /* @__PURE__ */ t("span", { className: "text-xs text-[var(--text-muted)]", children: [
                  "(",
                  a.permissions.length,
                  ")"
                ] })
              ] })
            }
          ),
          /* @__PURE__ */ t(
            "td",
            {
              className: `px-0 py-1 text-center relative ${H}`,
              style: { width: "60px", minWidth: "60px", maxWidth: "60px" },
              children: [
                /* @__PURE__ */ e(
                  "button",
                  {
                    ref: E,
                    type: "button",
                    onClick: () => D && Pe(a.id),
                    disabled: !D,
                    className: `w-full h-full min-h-[36px] flex items-center justify-center rounded transition-colors ${D ? "hover:opacity-80" : "cursor-not-allowed opacity-50"} ${B ? "ring-2 ring-[var(--color-accent-500)]" : ""}`,
                    title: D ? `${p.name} - ${a.moduleLabel}: ${k}/${a.permissions.length}` : `${p.name} - ${l("assignments.systemRoleReadOnly")}`,
                    children: /* @__PURE__ */ e(
                      Lr,
                      {
                        status: j,
                        grantedCount: k,
                        totalCount: a.permissions.length
                      }
                    )
                  }
                ),
                B && D && /* @__PURE__ */ e(
                  Fr,
                  {
                    mode: "editable",
                    role: p,
                    resource: a,
                    onTogglePermission: Y,
                    onClose: () => C(null),
                    getPermissionInheritance: (Se, re) => P(p.id, re)
                  }
                )
              ]
            }
          ),
          /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1.5", children: G(Z) }) })
        ]
      },
      a.id
    );
  };
  return /* @__PURE__ */ t("div", { className: "space-y-4", children: [
    /* @__PURE__ */ t("div", { className: "min-h-[52px]", children: [
      T && /* @__PURE__ */ e("div", { className: "flex items-center justify-between p-3 rounded-[var(--radius-card)] bg-[var(--success-bg)] border border-[var(--success-border)]", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e(He, { className: "h-4 w-4 text-[var(--success-text)]" }),
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--success-text)] font-medium", children: l("common.savedSuccessfully", "Sauvegardé avec succès !") })
      ] }) }),
      !T && b && /* @__PURE__ */ e("div", { className: "flex items-center justify-between p-3 rounded-[var(--radius-card)] bg-[var(--info-bg)] border border-[var(--info-border)]", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e(y, { className: "h-4 w-4 animate-spin text-[var(--info-text)]" }),
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--info-text)] font-medium", children: l("common.saving", "Sauvegarde en cours...") })
      ] }) }),
      !T && !b && f && /* @__PURE__ */ t("div", { className: "flex items-center justify-between p-3 rounded-[var(--radius-card)] bg-[var(--warning-bg)] border border-[var(--warning-border)]", children: [
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--warning-text)]", children: l("assignments.unsavedChanges", "You have unsaved changes") }),
        /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ t(
            "button",
            {
              onClick: de,
              disabled: b,
              className: "inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-[var(--radius-button)] bg-[var(--bg-secondary)] border border-[var(--border-color)] text-[var(--text-secondary)] hover:bg-[var(--bg-hover)] disabled:opacity-50",
              children: [
                /* @__PURE__ */ e($e, { className: "h-4 w-4" }),
                l("common.cancel")
              ]
            }
          ),
          /* @__PURE__ */ t(
            "button",
            {
              onClick: ce,
              disabled: b,
              className: "inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-[var(--radius-button)] bg-[var(--color-accent-600)] text-white hover:bg-[var(--color-accent-700)] disabled:opacity-50",
              children: [
                b ? /* @__PURE__ */ e(y, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ e(Ye, { className: "h-4 w-4" }),
                l("common.save")
              ]
            }
          )
        ] })
      ] }),
      !T && !b && !f && /* @__PURE__ */ e("div", { className: "h-[52px]" })
    ] }),
    ie && /* @__PURE__ */ e("div", { className: "p-3 rounded-[var(--radius-card)] bg-[var(--error-bg)] border border-[var(--error-border)]", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
      /* @__PURE__ */ e(Be, { className: "h-4 w-4 text-[var(--error-text)]" }),
      /* @__PURE__ */ e("p", { className: "text-sm text-[var(--error-text)]", children: ie })
    ] }) }),
    /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-4", children: [
      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ t("label", { className: "text-sm text-[var(--text-secondary)]", children: [
          l("userPermissions.filters.context"),
          ":"
        ] }),
        /* @__PURE__ */ t(
          "select",
          {
            value: v,
            onChange: (a) => {
              U(a.target.value), ge("all"), R("all");
            },
            className: "px-3 py-1.5 text-sm bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-[var(--radius-input)] text-[var(--text-primary)] focus:outline-none focus:ring-1 focus:ring-[var(--color-accent-500)]",
            children: [
              /* @__PURE__ */ e("option", { value: "all", children: l("userPermissions.filters.allContexts") }),
              X.contexts.map((a) => /* @__PURE__ */ e("option", { value: a, children: a }, a))
            ]
          }
        )
      ] }),
      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ t("label", { className: "text-sm text-[var(--text-secondary)]", children: [
          l("userPermissions.filters.application"),
          ":"
        ] }),
        /* @__PURE__ */ t(
          "select",
          {
            value: O,
            onChange: (a) => {
              ge(a.target.value), R("all");
            },
            className: "px-3 py-1.5 text-sm bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-[var(--radius-input)] text-[var(--text-primary)] focus:outline-none focus:ring-1 focus:ring-[var(--color-accent-500)]",
            children: [
              /* @__PURE__ */ e("option", { value: "all", children: l("userPermissions.filters.allApplications") }),
              X.applications.filter((a) => v === "all" || a.context === v).map((a) => /* @__PURE__ */ e("option", { value: a.app, children: a.label }, `${a.context}:${a.app}`))
            ]
          }
        )
      ] }),
      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ t("label", { className: "text-sm text-[var(--text-secondary)]", children: [
          l("userPermissions.filters.module"),
          ":"
        ] }),
        /* @__PURE__ */ t(
          "select",
          {
            value: se,
            onChange: (a) => R(a.target.value),
            className: "px-3 py-1.5 text-sm bg-[var(--bg-secondary)] border border-[var(--border-color)] rounded-[var(--radius-input)] text-[var(--text-primary)] focus:outline-none focus:ring-1 focus:ring-[var(--color-accent-500)]",
            children: [
              /* @__PURE__ */ e("option", { value: "all", children: l("userPermissions.filters.allModules") }),
              X.modules.filter(
                (a) => (v === "all" || a.context === v) && (O === "all" || a.app === O)
              ).map((a) => /* @__PURE__ */ e("option", { value: a.module, children: a.label }, `${a.context}:${a.app}:${a.module}`))
            ]
          }
        )
      ] })
    ] }),
    /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-3", children: [
      /* @__PURE__ */ t("span", { className: "text-sm font-medium text-[var(--text-secondary)]", children: [
        l("userPermissions.filterByStatus"),
        ":"
      ] }),
      /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-2", children: [
        /* @__PURE__ */ t(
          "button",
          {
            onClick: () => V("all"),
            className: `inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border transition-colors ${h.has("all") ? "bg-[var(--success-bg)] border-[var(--success-border)] text-[var(--success-text)]" : "bg-[var(--bg-tertiary)] border-[var(--border-color)] text-[var(--text-secondary)] hover:border-[var(--success-border)]"}`,
            children: [
              /* @__PURE__ */ e(He, { className: `h-3.5 w-3.5 ${h.has("all") ? "" : "text-[var(--success-dot)]"}` }),
              l("assignments.complete")
            ]
          }
        ),
        /* @__PURE__ */ t(
          "button",
          {
            onClick: () => V("some"),
            className: `inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border transition-colors ${h.has("some") ? "bg-[var(--warning-bg)] border-[var(--warning-border)] text-[var(--warning-text)]" : "bg-[var(--bg-tertiary)] border-[var(--border-color)] text-[var(--text-secondary)] hover:border-[var(--warning-border)]"}`,
            children: [
              /* @__PURE__ */ e(dr, { className: `h-3.5 w-3.5 ${h.has("some") ? "" : "text-[var(--warning-dot)]"}` }),
              l("assignments.partial")
            ]
          }
        ),
        /* @__PURE__ */ t(
          "button",
          {
            onClick: () => V("read-only"),
            className: `inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border transition-colors ${h.has("read-only") ? "bg-[var(--info-bg)] border-[var(--info-border)] text-[var(--info-text)]" : "bg-[var(--bg-tertiary)] border-[var(--border-color)] text-[var(--text-secondary)] hover:border-[var(--info-border)]"}`,
            children: [
              /* @__PURE__ */ e(Oe, { className: `h-3.5 w-3.5 ${h.has("read-only") ? "" : "text-[var(--info-dot)]"}` }),
              l("assignments.readOnly")
            ]
          }
        ),
        /* @__PURE__ */ t(
          "button",
          {
            onClick: () => V("none"),
            className: `inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border transition-colors ${h.has("none") ? "bg-[var(--error-bg)] border-[var(--error-border)] text-[var(--error-text)]" : "bg-[var(--bg-tertiary)] border-[var(--border-color)] text-[var(--text-secondary)] hover:border-[var(--error-border)]"}`,
            children: [
              /* @__PURE__ */ e(mr, { className: `h-3.5 w-3.5 ${h.has("none") ? "" : "text-[var(--text-muted)]"}` }),
              l("assignments.none")
            ]
          }
        )
      ] }),
      h.size > 0 && /* @__PURE__ */ e(
        "button",
        {
          onClick: () => N(/* @__PURE__ */ new Set()),
          className: "text-xs text-[var(--color-accent-500)] hover:text-[var(--color-accent-600)] underline",
          children: l("assignments.clearFilters")
        }
      )
    ] }),
    /* @__PURE__ */ e("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ t("span", { className: "px-2.5 py-1 text-xs font-semibold rounded-full bg-[var(--bg-tertiary)] text-[var(--text-secondary)]", children: [
      z,
      " ",
      l("assignments.modules")
    ] }) }),
    /* @__PURE__ */ e("div", { className: "overflow-x-auto overflow-y-visible", children: /* @__PURE__ */ t("table", { className: "border-collapse", style: { width: "auto" }, children: [
      /* @__PURE__ */ e("thead", { className: "item-medium border-b border-[var(--item-color-border)]", children: /* @__PURE__ */ t("tr", { children: [
        /* @__PURE__ */ e(
          "th",
          {
            scope: "col",
            className: "sticky left-0 z-20 item-medium px-3 text-left text-xs font-medium text-[var(--text-secondary)] uppercase tracking-wider",
            style: { width: "280px", minWidth: "280px", maxWidth: "280px", height: "48px", verticalAlign: "middle" },
            children: l("assignments.resource")
          }
        ),
        /* @__PURE__ */ e(
          "th",
          {
            scope: "col",
            className: "px-2 text-center text-xs font-medium text-[var(--text-secondary)] uppercase tracking-wider",
            style: { width: "60px", minWidth: "60px", maxWidth: "60px", height: "48px", verticalAlign: "middle" },
            children: l("userPermissions.status")
          }
        ),
        /* @__PURE__ */ e(
          "th",
          {
            scope: "col",
            className: "px-3 text-left text-xs font-medium text-[var(--text-secondary)] uppercase tracking-wider",
            style: { height: "48px", verticalAlign: "middle" },
            children: l("assignments.permissions")
          }
        )
      ] }) }),
      /* @__PURE__ */ e("tbody", { className: "divide-y divide-[var(--item-color-border)]", children: xe.map((a) => {
        const o = i.has(a.context), c = a.applications.reduce((m, u) => m + u.modules.length, 0);
        return /* @__PURE__ */ t(Re.Fragment, { children: [
          /* @__PURE__ */ t("tr", { className: "bg-[var(--color-accent-900)]/30 dark:bg-[var(--color-accent-900)]/50", children: [
            /* @__PURE__ */ e(
              "td",
              {
                className: "sticky left-0 z-10 px-3 py-3 bg-[var(--color-accent-900)]/30 dark:bg-[var(--color-accent-900)]/50",
                style: { width: "280px", minWidth: "280px", maxWidth: "280px" },
                children: /* @__PURE__ */ t(
                  "button",
                  {
                    onClick: () => x(a.context),
                    className: "flex items-center gap-3 w-full text-left hover:opacity-80",
                    children: [
                      o ? /* @__PURE__ */ e(Ue, { className: "h-5 w-5 text-[var(--color-accent-400)]" }) : /* @__PURE__ */ e(Ie, { className: "h-5 w-5 text-[var(--color-accent-400)]" }),
                      /* @__PURE__ */ e(ur, { className: "h-5 w-5 text-[var(--color-accent-400)]" }),
                      /* @__PURE__ */ e("span", { className: "text-sm font-bold text-[var(--color-accent-300)] uppercase tracking-wider", children: a.context }),
                      /* @__PURE__ */ t("span", { className: "text-xs text-[var(--color-accent-400)] ml-auto", children: [
                        a.applications.length,
                        " app",
                        a.applications.length > 1 ? "s" : "",
                        " • ",
                        c,
                        " module",
                        c > 1 ? "s" : ""
                      ] })
                    ]
                  }
                )
              }
            ),
            /* @__PURE__ */ e("td", { className: "px-0 py-3" }),
            /* @__PURE__ */ e("td", { className: "px-0 py-3" })
          ] }),
          !o && a.applications.map((m) => {
            const u = `${a.context}-${m.application}`, j = L.has(u);
            return /* @__PURE__ */ t(Re.Fragment, { children: [
              /* @__PURE__ */ t("tr", { className: "bg-[var(--bg-tertiary)]", children: [
                /* @__PURE__ */ e(
                  "td",
                  {
                    className: "sticky left-0 z-10 px-3 py-2 pl-10 bg-[var(--bg-tertiary)]",
                    style: { width: "280px", minWidth: "280px", maxWidth: "280px" },
                    children: /* @__PURE__ */ t(
                      "button",
                      {
                        onClick: () => S(u),
                        className: "flex items-center gap-3 w-full text-left hover:opacity-80",
                        children: [
                          j ? /* @__PURE__ */ e(Ue, { className: "h-4 w-4 text-[var(--text-secondary)]" }) : /* @__PURE__ */ e(Ie, { className: "h-4 w-4 text-[var(--text-secondary)]" }),
                          /* @__PURE__ */ e(vr, { className: "h-4 w-4 text-[var(--text-secondary)]" }),
                          /* @__PURE__ */ e("span", { className: "text-sm font-semibold text-[var(--text-primary)]", children: m.application }),
                          /* @__PURE__ */ t("span", { className: "text-xs text-[var(--text-muted)] ml-auto", children: [
                            m.modules.length,
                            " module",
                            m.modules.length > 1 ? "s" : ""
                          ] })
                        ]
                      }
                    )
                  }
                ),
                /* @__PURE__ */ e("td", { className: "px-0 py-2" }),
                /* @__PURE__ */ e("td", { className: "px-0 py-2" })
              ] }),
              !j && m.modules.map((k, B) => {
                const { module: E, sections: H } = k, Z = H.length > 0, _ = F.has(E.id);
                return /* @__PURE__ */ t(Re.Fragment, { children: [
                  Q(E, B, "module", Z, _),
                  Z && !_ && H.map((ee, Se) => {
                    const { section: re, resources: Ee } = ee;
                    return /* @__PURE__ */ e(
                      Ur,
                      {
                        section: re,
                        resources: Ee,
                        moduleIndex: B,
                        sectionIndex: Se,
                        collapsedSections: w,
                        renderResourceRow: Q
                      },
                      re.id
                    );
                  })
                ] }, E.id);
              })
            ] }, u);
          })
        ] }, a.context);
      }) })
    ] }) }),
    z === 0 && /* @__PURE__ */ e("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: l("assignments.noResources") })
  ] });
}
const Ve = [
  { code: "fr", label: "Français" },
  { code: "en", label: "English" },
  { code: "it", label: "Italiano" },
  { code: "de", label: "Deutsch" }
];
function _r() {
  const { t: s } = Xe("admin"), { id: l } = tr(), g = ar(), [i, L] = d(null), [x, S] = d(!0), [F, K] = d(!1), [w, Fe] = d("info"), [h, N] = d(null), [ae, C] = d(null), [v, U] = d({
    name: "",
    shortName: "",
    category: "Custom",
    description: "",
    parentRoleId: null
  }), [O, ge] = d([]), se = ["Global", "Admin", "Manager", "Contributor", "Viewer", "Custom"], [R, le] = d([]), [ne, oe] = d(!1), [fe, I] = d(null), [f, b] = d({
    name: "",
    shortName: "",
    description: ""
  }), [T, ie] = d(!1), [ye, ce] = d(!1), [de, P] = d(""), [p, D] = d(!1), [V, Ne] = d([]), [we, X] = d(!1), [Y, W] = d(""), [M, me] = d(null), [Ce, ue] = d(!1), [ve, pe] = d(null), [xe, z] = d(!1), [Te, Pe] = d([]), [je, De] = d(!1), [J, ke] = d(""), [G, Q] = d(null), [a, o] = d(!1), [c, m] = d(null), u = A(async () => {
    if (l)
      try {
        S(!0);
        const [r, n] = await Promise.all([
          $.roles.getById(l),
          $.roles.getAll()
        ]);
        L(r), ge(n.filter((he) => he.id !== l)), U({
          name: r.name,
          shortName: r.shortName,
          category: r.category,
          description: r.description || "",
          parentRoleId: r.parentRoleId
        });
      } catch (r) {
        console.error("Failed to load role:", r), N(s("roleDetail.errors.loadFailed"));
      } finally {
        S(!1);
      }
  }, [l, s]);
  ze(() => {
    u();
  }, [u]);
  const j = async (r) => {
    if (r.preventDefault(), !(!l || !i)) {
      K(!0), N(null), C(null);
      try {
        const n = {
          name: v.name,
          shortName: v.shortName,
          category: v.category,
          description: v.description || void 0,
          parentRoleId: v.parentRoleId || void 0
        };
        await $.roles.update(l, n), C(s("roleDetail.success.saved")), u();
      } catch (n) {
        N(n instanceof Error ? n.message : s("roleDetail.errors.saveFailed"));
      } finally {
        K(!1);
      }
    }
  }, k = A(async () => {
    if (l) {
      oe(!0);
      try {
        const r = await $.roles.getTranslations(l);
        le(r);
      } catch (r) {
        console.error("Failed to load translations:", r);
      } finally {
        oe(!1);
      }
    }
  }, [l]);
  ze(() => {
    w === "translations" && R.length === 0 && k();
  }, [w, R.length, k]);
  const B = (r) => {
    I(r.languageCode), b({
      name: r.name,
      shortName: r.shortName,
      description: r.description || ""
    });
  }, E = () => {
    I(null), ce(!1), b({ name: "", shortName: "", description: "" }), P("");
  }, H = async (r) => {
    if (l) {
      ie(!0), N(null);
      try {
        await $.roles.upsertTranslation(l, r, f), C(s("roleDetail.translations.saved")), I(null), ce(!1), P(""), k();
      } catch (n) {
        N(n instanceof Error ? n.message : s("roleDetail.errors.saveFailed"));
      } finally {
        ie(!1);
      }
    }
  }, Z = async (r) => {
    if (l && confirm(s("roleDetail.translations.confirmDelete")))
      try {
        await $.roles.deleteTranslation(l, r), C(s("roleDetail.translations.deleted")), k();
      } catch (n) {
        N(n instanceof Error ? n.message : s("roleDetail.errors.saveFailed"));
      }
  }, _ = Ve.filter(
    (r) => !R.some((n) => n.languageCode === r.code)
  ), ee = async () => {
    D(!0), me(null), W(""), X(!0);
    try {
      const r = await $.users.getAll({ globalScope: !0 });
      Ne(r.items);
    } catch (r) {
      console.error("Failed to load users:", r);
    } finally {
      X(!1);
    }
  }, Se = async () => {
    if (!(!l || !M)) {
      ue(!0);
      try {
        await $.roles.assignUser(l, M), D(!1), me(null), C(s("roleDetail.users.assigned")), u();
      } catch (r) {
        N(r instanceof Error ? r.message : s("roleDetail.errors.assignFailed"));
      } finally {
        ue(!1);
      }
    }
  }, re = async (r) => {
    if (l && confirm(s("roleDetail.users.confirmRemove"))) {
      pe(r);
      try {
        await $.roles.removeUser(l, r), C(s("roleDetail.users.removed")), u();
      } catch (n) {
        N(n instanceof Error ? n.message : s("roleDetail.errors.removeFailed"));
      } finally {
        pe(null);
      }
    }
  }, Ee = async () => {
    z(!0), Q(null), ke(""), De(!0);
    try {
      const r = await cr.getAll();
      Pe(r);
    } catch (r) {
      console.error("Failed to load groups:", r);
    } finally {
      De(!1);
    }
  }, Je = async () => {
    if (!(!l || !G)) {
      o(!0);
      try {
        await $.roles.assignGroup(l, G), z(!1), Q(null), C(s("roleDetail.groups.assigned")), u();
      } catch (r) {
        N(r instanceof Error ? r.message : s("roleDetail.errors.assignFailed"));
      } finally {
        o(!1);
      }
    }
  }, Qe = async (r) => {
    if (l && confirm(s("roleDetail.groups.confirmRemove"))) {
      m(r);
      try {
        await $.roles.removeGroup(l, r), C(s("roleDetail.groups.removed")), u();
      } catch (n) {
        N(n instanceof Error ? n.message : s("roleDetail.errors.removeFailed"));
      } finally {
        m(null);
      }
    }
  }, Ze = [
    { id: "info", label: s("roleDetail.tabs.info"), icon: /* @__PURE__ */ e(yr, { className: "w-4 h-4" }) },
    { id: "permissions", label: s("roleDetail.tabs.permissions"), icon: /* @__PURE__ */ e(We, { className: "w-4 h-4" }) },
    { id: "users", label: s("roleDetail.tabs.users"), icon: /* @__PURE__ */ e(_e, { className: "w-4 h-4" }) },
    { id: "groups", label: s("roleDetail.tabs.groups"), icon: /* @__PURE__ */ e(Me, { className: "w-4 h-4" }) },
    { id: "translations", label: s("roleDetail.tabs.translations"), icon: /* @__PURE__ */ e(Nr, { className: "w-4 h-4" }) }
  ];
  return x ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ e(y, { className: "w-8 h-8 animate-spin text-[var(--color-accent-500)]" }) }) : i ? /* @__PURE__ */ t("div", { className: "space-y-6", children: [
    /* @__PURE__ */ e(
      ir,
      {
        items: [
          { label: s("header.title"), href: "/administration" },
          { label: s("roles.title", "Roles"), href: "/administration/permissions/roles" },
          { label: i?.name || "Detail" }
        ]
      }
    ),
    /* @__PURE__ */ t("div", { className: "flex items-center gap-4", children: [
      /* @__PURE__ */ e(
        "button",
        {
          onClick: () => g("/administration/permissions/roles"),
          className: "p-2 rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] transition-colors",
          children: /* @__PURE__ */ e(wr, { className: "w-5 h-5 text-[var(--text-secondary)]" })
        }
      ),
      /* @__PURE__ */ t("div", { className: "flex-1", children: [
        /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ e("h1", { className: "text-xl sm:text-2xl font-bold text-[var(--text-primary)]", children: i.name }),
          i.isSystem && /* @__PURE__ */ t("span", { className: "flex items-center gap-1 px-2 py-1 rounded-[var(--radius-badge)] text-xs bg-[var(--warning-bg)] text-[var(--warning-text)] border border-[var(--warning-border)]", children: [
            /* @__PURE__ */ e(qe, { className: "w-3 h-3" }),
            s("roles.system")
          ] })
        ] }),
        i.description && /* @__PURE__ */ e("p", { className: "text-sm sm:text-base text-[var(--text-secondary)] mt-1", children: i.description })
      ] }),
      /* @__PURE__ */ t("div", { className: "flex items-center gap-4 text-sm text-[var(--text-secondary)]", children: [
        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
          /* @__PURE__ */ e(_e, { className: "w-4 h-4" }),
          /* @__PURE__ */ t("span", { children: [
            i.users.length,
            " ",
            s("roleDetail.usersCount")
          ] })
        ] }),
        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
          /* @__PURE__ */ e(Me, { className: "w-4 h-4" }),
          /* @__PURE__ */ t("span", { children: [
            i.groups?.length || 0,
            " ",
            s("roleDetail.groupsCount")
          ] })
        ] }),
        /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
          /* @__PURE__ */ e(We, { className: "w-4 h-4" }),
          /* @__PURE__ */ t("span", { children: [
            i.permissions.length,
            " ",
            s("roles.permissions")
          ] })
        ] })
      ] })
    ] }),
    h && /* @__PURE__ */ t("div", { className: "p-4 rounded-[var(--radius-card)] bg-[var(--error-bg)] border border-[var(--error-border)] text-[var(--error-text)] flex items-center gap-2", children: [
      /* @__PURE__ */ e(Cr, { className: "w-5 h-5 flex-shrink-0" }),
      h
    ] }),
    ae && /* @__PURE__ */ t("div", { className: "p-4 rounded-[var(--radius-card)] bg-[var(--success-bg)] border border-[var(--success-border)] text-[var(--success-text)] flex items-center gap-2", children: [
      /* @__PURE__ */ e(Dr, { className: "w-5 h-5 flex-shrink-0" }),
      ae
    ] }),
    /* @__PURE__ */ e("div", { className: "flex gap-1 p-1 bg-[var(--bg-secondary)] rounded-[var(--radius-card)] border border-[var(--border-color)]", children: Ze.map((r) => /* @__PURE__ */ t(
      "button",
      {
        onClick: () => Fe(r.id),
        className: `flex items-center gap-2 px-4 py-2 rounded-[var(--radius-button)] font-medium transition-colors ${w === r.id ? "bg-[var(--color-accent-600)] text-white" : "text-[var(--text-secondary)] hover:bg-[var(--bg-hover)]"}`,
        children: [
          r.icon,
          /* @__PURE__ */ e("span", { className: "hidden sm:inline", children: r.label })
        ]
      },
      r.id
    )) }),
    /* @__PURE__ */ t("div", { className: "bg-[var(--bg-secondary)] rounded-[var(--radius-card)] border border-[var(--border-color)] p-4 sm:p-6", children: [
      w === "info" && /* @__PURE__ */ t("form", { onSubmit: j, className: "space-y-6 max-w-2xl", children: [
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.info.id") }),
          /* @__PURE__ */ e("div", { className: "px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-tertiary)] text-[var(--text-secondary)] font-mono text-sm", children: i.id })
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ t("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: [
            s("roles.form.name"),
            " *"
          ] }),
          /* @__PURE__ */ e(
            "input",
            {
              type: "text",
              required: !0,
              value: v.name,
              onChange: (r) => U((n) => ({ ...n, name: r.target.value })),
              className: "w-full px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]"
            }
          )
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ t("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: [
            s("roleDetail.info.shortName"),
            " *"
          ] }),
          /* @__PURE__ */ e(
            "input",
            {
              type: "text",
              required: !0,
              value: v.shortName,
              onChange: (r) => U((n) => ({ ...n, shortName: r.target.value })),
              className: "w-full px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]"
            }
          ),
          /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-[var(--text-tertiary)]", children: s("roleDetail.info.shortNameHelp") })
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ t("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: [
            s("roleDetail.info.category"),
            " *"
          ] }),
          /* @__PURE__ */ e(
            "select",
            {
              value: v.category,
              onChange: (r) => U((n) => ({ ...n, category: r.target.value })),
              className: "w-full px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]",
              children: se.map((r) => /* @__PURE__ */ e("option", { value: r, children: s(`roleDetail.categories.${r.toLowerCase()}`) }, r))
            }
          ),
          /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-[var(--text-tertiary)]", children: s("roleDetail.info.categoryHelp") })
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.info.parentRole") }),
          /* @__PURE__ */ t(
            "select",
            {
              value: v.parentRoleId || "",
              onChange: (r) => U((n) => ({ ...n, parentRoleId: r.target.value || null })),
              className: "w-full px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]",
              children: [
                /* @__PURE__ */ e("option", { value: "", children: s("roleDetail.info.noParent") }),
                O.map((r) => /* @__PURE__ */ t("option", { value: r.id, children: [
                  r.name,
                  " (",
                  s(`roleDetail.categories.${r.category.toLowerCase()}`),
                  ")"
                ] }, r.id))
              ]
            }
          ),
          /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-[var(--text-tertiary)]", children: s("roleDetail.info.parentRoleHelp") })
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roles.form.description") }),
          /* @__PURE__ */ e(
            "textarea",
            {
              value: v.description,
              onChange: (r) => U((n) => ({ ...n, description: r.target.value })),
              rows: 3,
              className: "w-full px-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)] resize-none"
            }
          )
        ] }),
        /* @__PURE__ */ t("div", { children: [
          /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.info.systemRole") }),
          /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: i.isSystem ? /* @__PURE__ */ t("span", { className: "flex items-center gap-1.5 px-3 py-1.5 rounded-[var(--radius-badge)] text-sm bg-[var(--warning-bg)] text-[var(--warning-text)] border border-[var(--warning-border)]", children: [
            /* @__PURE__ */ e(qe, { className: "w-4 h-4" }),
            s("roleDetail.info.isSystemRole")
          ] }) : /* @__PURE__ */ e("span", { className: "flex items-center gap-1.5 px-3 py-1.5 rounded-[var(--radius-badge)] text-sm bg-[var(--bg-tertiary)] text-[var(--text-secondary)]", children: s("roleDetail.info.isCustomRole") }) })
        ] }),
        /* @__PURE__ */ t("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 pt-4 border-t border-[var(--border-color)]", children: [
          /* @__PURE__ */ t("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.createdAt") }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-primary)]", children: new Date(i.createdAt).toLocaleString() })
          ] }),
          i.updatedAt && /* @__PURE__ */ t("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.updatedAt") }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-primary)]", children: new Date(i.updatedAt).toLocaleString() })
          ] })
        ] }),
        /* @__PURE__ */ e("div", { className: "flex justify-end pt-4", children: /* @__PURE__ */ t(
          "button",
          {
            type: "submit",
            disabled: F,
            className: "flex items-center gap-2 px-4 py-2 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white font-medium transition-colors disabled:opacity-50",
            children: [
              F ? /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ e(Ye, { className: "w-4 h-4" }),
              s("common.save")
            ]
          }
        ) })
      ] }),
      w === "permissions" && l && /* @__PURE__ */ e(Ir, { roleId: l }),
      w === "groups" && /* @__PURE__ */ t("div", { className: "space-y-4", children: [
        /* @__PURE__ */ t("div", { className: "flex items-center justify-between", children: [
          /* @__PURE__ */ t("h3", { className: "text-lg font-semibold text-[var(--text-primary)]", children: [
            s("roleDetail.groups.title"),
            " (",
            i.groups?.length || 0,
            ")"
          ] }),
          /* @__PURE__ */ t(
            "button",
            {
              onClick: Ee,
              className: "flex items-center gap-2 px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white text-sm font-medium transition-colors",
              children: [
                /* @__PURE__ */ e(Le, { className: "w-4 h-4" }),
                s("roleDetail.groups.add")
              ]
            }
          )
        ] }),
        !i.groups || i.groups.length === 0 ? /* @__PURE__ */ e("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: s("roleDetail.groups.noGroups") }) : /* @__PURE__ */ e("div", { className: "grid gap-3", children: i.groups.map((r) => /* @__PURE__ */ t(
          "div",
          {
            className: "flex items-center gap-4 p-4 rounded-[var(--radius-card)] bg-[var(--bg-primary)] border border-[var(--border-color)]",
            children: [
              /* @__PURE__ */ t(
                Ge,
                {
                  to: `/administration/users/groups/${r.id}`,
                  className: "flex items-center gap-4 flex-1 min-w-0 hover:opacity-80 transition-opacity",
                  children: [
                    /* @__PURE__ */ e("div", { className: "w-10 h-10 rounded-full bg-[var(--color-accent-100)] flex items-center justify-center", children: /* @__PURE__ */ e(Me, { className: "w-5 h-5 text-[var(--color-accent-700)]" }) }),
                    /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
                      /* @__PURE__ */ e("div", { className: "font-medium text-[var(--text-primary)] truncate", children: r.name }),
                      /* @__PURE__ */ t("div", { className: "text-sm text-[var(--text-secondary)] truncate", children: [
                        r.membersCount,
                        " ",
                        s("roleDetail.groups.members"),
                        r.description && ` · ${r.description}`
                      ] })
                    ] })
                  ]
                }
              ),
              /* @__PURE__ */ e(
                "button",
                {
                  onClick: () => Qe(r.id),
                  disabled: c === r.id,
                  className: "p-2 rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] text-[var(--text-secondary)] hover:text-[var(--error-text)] transition-colors disabled:opacity-50",
                  title: s("roleDetail.groups.remove"),
                  children: c === r.id ? /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ e(Ae, { className: "w-4 h-4" })
                }
              )
            ]
          },
          r.id
        )) }),
        xe && /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50", children: /* @__PURE__ */ t("div", { className: "bg-[var(--bg-secondary)] rounded-[var(--radius-card)] border border-[var(--border-color)] w-full max-w-md p-6 m-4 max-h-[90vh] overflow-y-auto", children: [
          /* @__PURE__ */ t("div", { className: "flex items-center justify-between mb-6", children: [
            /* @__PURE__ */ e("h2", { className: "text-xl font-bold text-[var(--text-primary)]", children: s("roleDetail.groups.addTitle") }),
            /* @__PURE__ */ e(
              "button",
              {
                onClick: () => z(!1),
                className: "p-2 rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] transition-colors",
                children: /* @__PURE__ */ e($e, { className: "w-5 h-5 text-[var(--text-tertiary)]" })
              }
            )
          ] }),
          /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ t("div", { className: "relative", children: [
            /* @__PURE__ */ e(Ke, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ e(
              "input",
              {
                type: "text",
                value: J,
                onChange: (r) => ke(r.target.value),
                className: "w-full pl-10 pr-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]",
                placeholder: s("roleDetail.groups.searchPlaceholder")
              }
            )
          ] }) }),
          je ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ e(y, { className: "w-6 h-6 animate-spin text-[var(--color-accent-500)]" }) }) : /* @__PURE__ */ e("div", { className: "space-y-2 max-h-64 overflow-y-auto", children: Te.filter(
            (r) => !i.groups?.some((n) => n.id === r.id) && (J === "" || r.name.toLowerCase().includes(J.toLowerCase()) || (r.description || "").toLowerCase().includes(J.toLowerCase()))
          ).map((r) => /* @__PURE__ */ t(
            "label",
            {
              className: `flex items-center gap-3 cursor-pointer p-3 rounded-[var(--radius-button)] transition-colors ${G === r.id ? "bg-[var(--color-accent-500)]/10 border border-[var(--color-accent-500)]" : "hover:bg-[var(--bg-hover)] border border-transparent"}`,
              htmlFor: `group-${r.id}`,
              children: [
                /* @__PURE__ */ e(
                  "input",
                  {
                    id: `group-${r.id}`,
                    type: "radio",
                    name: "selectedGroup",
                    checked: G === r.id,
                    onChange: () => Q(r.id),
                    className: "w-4 h-4 text-[var(--color-accent-600)] focus:ring-[var(--color-accent-500)]"
                  }
                ),
                /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
                  /* @__PURE__ */ e("span", { className: "text-[var(--text-primary)] font-medium", children: r.name }),
                  /* @__PURE__ */ t("p", { className: "text-xs text-[var(--text-tertiary)]", children: [
                    r.memberCount,
                    " ",
                    s("roleDetail.groups.members"),
                    r.description && ` · ${r.description}`
                  ] })
                ] })
              ]
            },
            r.id
          )) }),
          /* @__PURE__ */ t("div", { className: "flex justify-end gap-3 mt-6", children: [
            /* @__PURE__ */ e(
              "button",
              {
                onClick: () => z(!1),
                className: "px-4 py-2 rounded-[var(--radius-button)] bg-[var(--bg-tertiary)] hover:bg-[var(--bg-hover)] text-[var(--text-primary)] font-medium transition-colors",
                children: s("common.cancel")
              }
            ),
            /* @__PURE__ */ t(
              "button",
              {
                onClick: Je,
                disabled: !G || a,
                className: "flex items-center gap-2 px-4 py-2 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white font-medium transition-colors disabled:opacity-50",
                children: [
                  a && /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }),
                  s("common.add")
                ]
              }
            )
          ] })
        ] }) })
      ] }),
      w === "users" && /* @__PURE__ */ t("div", { className: "space-y-4", children: [
        /* @__PURE__ */ t("div", { className: "flex items-center justify-between", children: [
          /* @__PURE__ */ t("h3", { className: "text-lg font-semibold text-[var(--text-primary)]", children: [
            s("roleDetail.users.title"),
            " (",
            i.users.length,
            ")"
          ] }),
          /* @__PURE__ */ t(
            "button",
            {
              onClick: ee,
              className: "flex items-center gap-2 px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white text-sm font-medium transition-colors",
              children: [
                /* @__PURE__ */ e(Le, { className: "w-4 h-4" }),
                s("roleDetail.users.add")
              ]
            }
          )
        ] }),
        i.users.length === 0 ? /* @__PURE__ */ e("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: s("roleDetail.users.noUsers") }) : /* @__PURE__ */ e("div", { className: "grid gap-3", children: i.users.map((r) => /* @__PURE__ */ t(
          "div",
          {
            className: "flex items-center gap-4 p-4 rounded-[var(--radius-card)] bg-[var(--bg-primary)] border border-[var(--border-color)]",
            children: [
              /* @__PURE__ */ t(
                Ge,
                {
                  to: `/administration/users/${r.id}`,
                  className: "flex items-center gap-4 flex-1 min-w-0 hover:opacity-80 transition-opacity",
                  children: [
                    /* @__PURE__ */ e("div", { className: "w-10 h-10 rounded-full bg-[var(--color-accent-100)] flex items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[var(--color-accent-700)]", children: r.fullName.split(" ").map((n) => n.at(0)).join("").toUpperCase().slice(0, 2) }) }),
                    /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
                      /* @__PURE__ */ e("div", { className: "font-medium text-[var(--text-primary)] truncate", children: r.fullName }),
                      /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)] truncate", children: r.email })
                    ] })
                  ]
                }
              ),
              /* @__PURE__ */ e(
                "button",
                {
                  onClick: () => re(r.id),
                  disabled: ve === r.id,
                  className: "p-2 rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] text-[var(--text-secondary)] hover:text-[var(--error-text)] transition-colors disabled:opacity-50",
                  title: s("roleDetail.users.remove"),
                  children: ve === r.id ? /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ e(Ae, { className: "w-4 h-4" })
                }
              )
            ]
          },
          r.id
        )) }),
        p && /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50", children: /* @__PURE__ */ t("div", { className: "bg-[var(--bg-secondary)] rounded-[var(--radius-card)] border border-[var(--border-color)] w-full max-w-md p-6 m-4 max-h-[90vh] overflow-y-auto", children: [
          /* @__PURE__ */ t("div", { className: "flex items-center justify-between mb-6", children: [
            /* @__PURE__ */ e("h2", { className: "text-xl font-bold text-[var(--text-primary)]", children: s("roleDetail.users.addTitle") }),
            /* @__PURE__ */ e(
              "button",
              {
                onClick: () => D(!1),
                className: "p-2 rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] transition-colors",
                children: /* @__PURE__ */ e($e, { className: "w-5 h-5 text-[var(--text-tertiary)]" })
              }
            )
          ] }),
          /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ t("div", { className: "relative", children: [
            /* @__PURE__ */ e(Ke, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ e(
              "input",
              {
                type: "text",
                value: Y,
                onChange: (r) => W(r.target.value),
                className: "w-full pl-10 pr-4 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-[var(--color-accent-500)]",
                placeholder: s("roleDetail.users.searchPlaceholder")
              }
            )
          ] }) }),
          we ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ e(y, { className: "w-6 h-6 animate-spin text-[var(--color-accent-500)]" }) }) : /* @__PURE__ */ e("div", { className: "space-y-2 max-h-64 overflow-y-auto", children: V.filter(
            (r) => !i.users.some((n) => n.id === r.id) && (Y === "" || r.fullName.toLowerCase().includes(Y.toLowerCase()) || r.email.toLowerCase().includes(Y.toLowerCase()))
          ).map((r) => /* @__PURE__ */ t(
            "label",
            {
              className: `flex items-center gap-3 cursor-pointer p-3 rounded-[var(--radius-button)] transition-colors ${M === r.id ? "bg-[var(--color-accent-500)]/10 border border-[var(--color-accent-500)]" : "hover:bg-[var(--bg-hover)] border border-transparent"}`,
              htmlFor: `user-${r.id}`,
              children: [
                /* @__PURE__ */ e(
                  "input",
                  {
                    id: `user-${r.id}`,
                    type: "radio",
                    name: "selectedUser",
                    checked: M === r.id,
                    onChange: () => me(r.id),
                    className: "w-4 h-4 text-[var(--color-accent-600)] focus:ring-[var(--color-accent-500)]"
                  }
                ),
                /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
                  /* @__PURE__ */ e("span", { className: "text-[var(--text-primary)] font-medium", children: r.fullName }),
                  /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-tertiary)]", children: r.email })
                ] })
              ]
            },
            r.id
          )) }),
          /* @__PURE__ */ t("div", { className: "flex justify-end gap-3 mt-6", children: [
            /* @__PURE__ */ e(
              "button",
              {
                onClick: () => D(!1),
                className: "px-4 py-2 rounded-[var(--radius-button)] bg-[var(--bg-tertiary)] hover:bg-[var(--bg-hover)] text-[var(--text-primary)] font-medium transition-colors",
                children: s("common.cancel")
              }
            ),
            /* @__PURE__ */ t(
              "button",
              {
                onClick: Se,
                disabled: !M || Ce,
                className: "flex items-center gap-2 px-4 py-2 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white font-medium transition-colors disabled:opacity-50",
                children: [
                  Ce && /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }),
                  s("common.add")
                ]
              }
            )
          ] })
        ] }) })
      ] }),
      w === "translations" && /* @__PURE__ */ t("div", { className: "space-y-6", children: [
        /* @__PURE__ */ t("div", { className: "flex items-center justify-between", children: [
          /* @__PURE__ */ t("h3", { className: "text-lg font-semibold text-[var(--text-primary)]", children: [
            s("roleDetail.translations.title"),
            " (",
            R.length,
            ")"
          ] }),
          _.length > 0 && /* @__PURE__ */ t(
            "button",
            {
              onClick: () => ce(!0),
              className: "flex items-center gap-2 px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white text-sm font-medium transition-colors",
              children: [
                /* @__PURE__ */ e(Le, { className: "w-4 h-4" }),
                s("roleDetail.translations.add")
              ]
            }
          )
        ] }),
        ye && /* @__PURE__ */ t("div", { className: "p-4 rounded-[var(--radius-card)] bg-[var(--bg-primary)] border border-[var(--color-accent-500)]", children: [
          /* @__PURE__ */ t("div", { className: "flex items-center justify-between mb-4", children: [
            /* @__PURE__ */ e("h4", { className: "font-medium text-[var(--text-primary)]", children: s("roleDetail.translations.addNew") }),
            /* @__PURE__ */ e(
              "button",
              {
                onClick: E,
                className: "p-1 rounded hover:bg-[var(--bg-hover)]",
                children: /* @__PURE__ */ e($e, { className: "w-4 h-4 text-[var(--text-secondary)]" })
              }
            )
          ] }),
          /* @__PURE__ */ t("div", { className: "grid gap-4", children: [
            /* @__PURE__ */ t("div", { children: [
              /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.language") }),
              /* @__PURE__ */ t(
                "select",
                {
                  value: de,
                  onChange: (r) => P(r.target.value),
                  className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)]",
                  children: [
                    /* @__PURE__ */ e("option", { value: "", children: s("roleDetail.translations.selectLanguage") }),
                    _.map((r) => /* @__PURE__ */ e("option", { value: r.code, children: r.label }, r.code))
                  ]
                }
              )
            ] }),
            de && /* @__PURE__ */ t(er, { children: [
              /* @__PURE__ */ t("div", { children: [
                /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.name") }),
                /* @__PURE__ */ e(
                  "input",
                  {
                    type: "text",
                    value: f.name,
                    onChange: (r) => b((n) => ({ ...n, name: r.target.value })),
                    className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)]"
                  }
                )
              ] }),
              /* @__PURE__ */ t("div", { children: [
                /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.shortName") }),
                /* @__PURE__ */ e(
                  "input",
                  {
                    type: "text",
                    value: f.shortName,
                    onChange: (r) => b((n) => ({ ...n, shortName: r.target.value })),
                    className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)]"
                  }
                )
              ] }),
              /* @__PURE__ */ t("div", { children: [
                /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.description") }),
                /* @__PURE__ */ e(
                  "textarea",
                  {
                    value: f.description || "",
                    onChange: (r) => b((n) => ({ ...n, description: r.target.value })),
                    rows: 2,
                    className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)] resize-none"
                  }
                )
              ] }),
              /* @__PURE__ */ t("div", { className: "flex justify-end gap-2", children: [
                /* @__PURE__ */ e(
                  "button",
                  {
                    onClick: E,
                    className: "px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--bg-tertiary)] hover:bg-[var(--bg-hover)] text-[var(--text-primary)] text-sm font-medium",
                    children: s("common.cancel")
                  }
                ),
                /* @__PURE__ */ t(
                  "button",
                  {
                    onClick: () => H(de),
                    disabled: T || !f.name || !f.shortName,
                    className: "flex items-center gap-2 px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white text-sm font-medium disabled:opacity-50",
                    children: [
                      T && /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }),
                      s("common.save")
                    ]
                  }
                )
              ] })
            ] })
          ] })
        ] }),
        ne && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ e(y, { className: "w-6 h-6 animate-spin text-[var(--color-accent-500)]" }) }),
        !ne && R.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: s("roleDetail.translations.noTranslations") }),
        !ne && R.length > 0 && /* @__PURE__ */ e("div", { className: "space-y-3", children: R.map((r) => {
          const n = Ve.find((q) => q.code === r.languageCode), he = fe === r.languageCode;
          return /* @__PURE__ */ t(
            "div",
            {
              className: `p-4 rounded-[var(--radius-card)] border ${he ? "bg-[var(--bg-primary)] border-[var(--color-accent-500)]" : "bg-[var(--bg-primary)] border-[var(--border-color)]"}`,
              children: [
                /* @__PURE__ */ t("div", { className: "flex items-center justify-between mb-2", children: [
                  /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
                    /* @__PURE__ */ e("span", { className: "px-2 py-0.5 text-xs font-medium rounded bg-[var(--bg-tertiary)] text-[var(--text-secondary)] uppercase", children: r.languageCode }),
                    /* @__PURE__ */ e("span", { className: "text-sm text-[var(--text-secondary)]", children: n?.label || r.languageCode })
                  ] }),
                  !he && /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
                    /* @__PURE__ */ e(
                      "button",
                      {
                        onClick: () => B(r),
                        className: "p-1.5 rounded hover:bg-[var(--bg-hover)] text-[var(--text-secondary)] hover:text-[var(--color-accent-600)]",
                        title: s("common.edit"),
                        children: /* @__PURE__ */ e(kr, { className: "w-4 h-4" })
                      }
                    ),
                    /* @__PURE__ */ e(
                      "button",
                      {
                        onClick: () => Z(r.languageCode),
                        className: "p-1.5 rounded hover:bg-[var(--bg-hover)] text-[var(--text-secondary)] hover:text-[var(--error-text)]",
                        title: s("common.delete"),
                        children: /* @__PURE__ */ e(Ae, { className: "w-4 h-4" })
                      }
                    )
                  ] })
                ] }),
                he ? /* @__PURE__ */ t("div", { className: "grid gap-3 mt-3", children: [
                  /* @__PURE__ */ t("div", { children: [
                    /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.name") }),
                    /* @__PURE__ */ e(
                      "input",
                      {
                        type: "text",
                        value: f.name,
                        onChange: (q) => b((be) => ({ ...be, name: q.target.value })),
                        className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)]"
                      }
                    )
                  ] }),
                  /* @__PURE__ */ t("div", { children: [
                    /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.shortName") }),
                    /* @__PURE__ */ e(
                      "input",
                      {
                        type: "text",
                        value: f.shortName,
                        onChange: (q) => b((be) => ({ ...be, shortName: q.target.value })),
                        className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)]"
                      }
                    )
                  ] }),
                  /* @__PURE__ */ t("div", { children: [
                    /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-[var(--text-secondary)] mb-1", children: s("roleDetail.translations.description") }),
                    /* @__PURE__ */ e(
                      "textarea",
                      {
                        value: f.description || "",
                        onChange: (q) => b((be) => ({ ...be, description: q.target.value })),
                        rows: 2,
                        className: "w-full px-3 py-2 rounded-[var(--radius-input)] border border-[var(--border-color)] bg-[var(--bg-secondary)] text-[var(--text-primary)] resize-none"
                      }
                    )
                  ] }),
                  /* @__PURE__ */ t("div", { className: "flex justify-end gap-2", children: [
                    /* @__PURE__ */ e(
                      "button",
                      {
                        onClick: E,
                        className: "px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--bg-tertiary)] hover:bg-[var(--bg-hover)] text-[var(--text-primary)] text-sm font-medium",
                        children: s("common.cancel")
                      }
                    ),
                    /* @__PURE__ */ t(
                      "button",
                      {
                        onClick: () => H(r.languageCode),
                        disabled: T || !f.name || !f.shortName,
                        className: "flex items-center gap-2 px-3 py-1.5 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] hover:bg-[var(--color-accent-700)] text-white text-sm font-medium disabled:opacity-50",
                        children: [
                          T && /* @__PURE__ */ e(y, { className: "w-4 h-4 animate-spin" }),
                          s("common.save")
                        ]
                      }
                    )
                  ] })
                ] }) : /* @__PURE__ */ t("div", { className: "grid gap-1", children: [
                  /* @__PURE__ */ e("div", { className: "font-medium text-[var(--text-primary)]", children: r.name }),
                  /* @__PURE__ */ t("div", { className: "text-sm text-[var(--text-secondary)]", children: [
                    s("roleDetail.translations.shortName"),
                    ": ",
                    r.shortName
                  ] }),
                  r.description && /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-tertiary)] mt-1", children: r.description })
                ] })
              ]
            },
            r.languageCode
          );
        }) })
      ] })
    ] })
  ] }) : /* @__PURE__ */ t("div", { className: "text-center py-12", children: [
    /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: s("roleDetail.notFound") }),
    /* @__PURE__ */ e(
      "button",
      {
        onClick: () => g("/administration/permissions/roles"),
        className: "mt-4 px-4 py-2 rounded-[var(--radius-button)] bg-[var(--color-accent-600)] text-white",
        children: s("roleDetail.backToList")
      }
    )
  ] });
}
export {
  _r as RoleDetailPage
};
//# sourceMappingURL=RoleDetailPage-DGdOjuXQ.js.map
