import { jsxs as r, jsx as e } from "react/jsx-runtime";
import { Link as h } from "react-router-dom";
import { useTranslation as O } from "react-i18next";
import { Headphones as j, Lock as i, User as o, CheckCircle as d, Info as H, BarChart2 as N, Search as y, Filter as f, Layers as v, Tag as w, Plus as _, MessageSquare as T, Eye as L, Trash2 as F, FileText as k, ArrowLeft as $, Edit2 as C, ChevronRight as I, ChevronDown as n, UserPlus as A, Monitor as b, Globe as E, Laptop as D, Bug as K, AlertTriangle as B, Zap as u, Clock as P, ArrowUpCircle as m, History as S, ArrowRight as p, XCircle as q, RotateCcw as G, Wifi as M, File as V } from "lucide-react";
function l({ label: a, children: t }) {
  return /* @__PURE__ */ e("div", { className: "mt-2 p-3 rounded-lg bg-[var(--color-primary-600)]/5 border border-[var(--color-primary-600)]/20", children: /* @__PURE__ */ r("div", { className: "flex items-start gap-2", children: [
    /* @__PURE__ */ e("span", { className: "text-[10px] px-2 py-0.5 rounded-full bg-[var(--color-primary-600)]/15 text-[var(--color-primary-600)] font-medium shrink-0 mt-0.5", children: a }),
    /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)]", children: t })
  ] }) });
}
function R({ status: a }) {
  const t = {
    Open: "bg-[var(--warning-bg)] text-[var(--warning-text)]",
    InProgress: "bg-[var(--info-bg)] text-[var(--info-text)]",
    OnHold: "bg-[var(--warning-bg)] text-[var(--warning-text)]",
    Resolved: "bg-[var(--success-bg)] text-[var(--success-text)]",
    Closed: "bg-[var(--bg-secondary)] text-[var(--text-secondary)]",
    Rejected: "bg-[var(--error-bg)] text-[var(--error-text)]"
  }, s = {
    Open: "Ouvert",
    InProgress: "En cours",
    OnHold: "En attente",
    Resolved: "Résolu",
    Closed: "Fermé",
    Rejected: "Rejeté"
  };
  return /* @__PURE__ */ e("span", { className: `text-xs px-2 py-0.5 rounded-full font-medium ${t[a] || "bg-[var(--bg-secondary)]"}`, children: s[a] || a });
}
function x({ priority: a }) {
  const t = {
    Low: { bg: "var(--info-bg)", color: "var(--info-text)" },
    Medium: { bg: "var(--warning-bg)", color: "var(--warning-text)" },
    High: { bg: "var(--error-bg)", color: "var(--error-text)" },
    Critical: { bg: "var(--error-text)", color: "white" }
  }, s = {
    Low: "Faible",
    Medium: "Moyen",
    High: "Élevé",
    Critical: "Critique"
  }, c = t[a] || t.Low;
  return /* @__PURE__ */ e("span", { className: "text-xs px-2 py-0.5 rounded font-medium", style: { backgroundColor: c.bg, color: c.color }, children: s[a] || a });
}
const J = [
  { id: "1", num: "TKT-1001", workspace: "Acme Corp", title: "Erreur d'accès au module Facturation", type: "Bug", status: "InProgress", priority: "Critical", msgs: 3, created: "21/02/2026" },
  { id: "2", num: "TKT-1002", workspace: "TechStartup", title: "Demande d'accès application CRM", type: "ApplicationRequest", status: "Open", priority: "Medium", msgs: 1, created: "21/02/2026" },
  { id: "3", num: "TKT-1003", workspace: null, title: "Connexion SSO impossible après mise à jour", type: "Bug", status: "OnHold", priority: "High", msgs: 5, created: "20/02/2026" },
  { id: "4", num: "TKT-1004", workspace: "InnovateCo", title: "Ajouter export PDF aux rapports", type: "FeatureRequest", status: "Resolved", priority: "Low", msgs: 2, created: "19/02/2026" },
  { id: "5", num: "TKT-1005", workspace: "DataFlow", title: "Question sur la matrice des permissions", type: "Question", status: "Closed", priority: "Low", msgs: 0, created: "18/02/2026" }
], U = [
  { key: "total", value: 47, color: "info" },
  { key: "open", value: 12, color: "warning" },
  { key: "inProgress", value: 8, color: "info" },
  { key: "onHold", value: 3, color: "warning" },
  { key: "resolved", value: 18, color: "success" },
  { key: "closed", value: 6, color: "neutral" },
  { key: "critical", value: 2, color: "error" },
  { key: "highPriority", value: 5, color: "warning" }
], g = {
  info: "bg-[var(--info-bg)] text-[var(--info-text)] border-[var(--info-border)]",
  warning: "bg-[var(--warning-bg)] text-[var(--warning-text)] border-[var(--warning-border)]",
  success: "bg-[var(--success-bg)] text-[var(--success-text)] border-[var(--success-border)]",
  error: "bg-[var(--error-bg)] text-[var(--error-text)] border-[var(--error-border)]",
  neutral: "bg-[var(--bg-secondary)] text-[var(--text-primary)] border-[var(--border-color)]"
};
function Z() {
  const { t: a } = O("docsPlatformSupportTickets");
  return /* @__PURE__ */ r("div", { className: "space-y-10 max-w-5xl mx-auto pb-12", children: [
    /* @__PURE__ */ r("div", { className: "flex items-center gap-2 text-sm text-[var(--text-secondary)]", children: [
      /* @__PURE__ */ e(h, { to: "/system/docs/user", className: "hover:text-[var(--color-primary-600)]", children: a("navBack") }),
      /* @__PURE__ */ e("span", { children: "/" }),
      /* @__PURE__ */ e("span", { className: "text-[var(--text-primary)]", children: a("pageTitle") })
    ] }),
    /* @__PURE__ */ r("div", { children: [
      /* @__PURE__ */ r("h1", { className: "text-3xl font-bold mb-3 flex items-center gap-3", children: [
        /* @__PURE__ */ e(j, { className: "w-8 h-8 text-[var(--color-primary-600)]" }),
        a("pageTitle")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-lg text-[var(--text-secondary)]", children: a("pageSubtitle") })
    ] }),
    /* @__PURE__ */ r("section", { className: "card p-6 space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(i, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("access_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: a("access_description") }),
      /* @__PURE__ */ r("div", { className: "grid md:grid-cols-2 gap-4", children: [
        /* @__PURE__ */ r("div", { className: "p-4 rounded-lg bg-[var(--bg-secondary)]", children: [
          /* @__PURE__ */ r("h3", { className: "font-medium mb-2 flex items-center gap-2", children: [
            /* @__PURE__ */ e(o, { className: "w-4 h-4 text-[var(--color-primary-600)]" }),
            a("access_rolesTitle")
          ] }),
          /* @__PURE__ */ e("div", { className: "space-y-1", children: ["access_role_supportAgent", "access_role_supportAdmin"].map((t) => /* @__PURE__ */ r("div", { className: "flex items-center gap-2 text-sm", children: [
            /* @__PURE__ */ e(d, { className: "w-3.5 h-3.5 text-[var(--success-text)]" }),
            /* @__PURE__ */ e("span", { children: a(t) })
          ] }, t)) })
        ] }),
        /* @__PURE__ */ r("div", { className: "p-4 rounded-lg bg-[var(--info-bg)] border border-[var(--info-border)]", children: [
          /* @__PURE__ */ r("h3", { className: "font-medium mb-1 flex items-center gap-2 text-[var(--info-text)]", children: [
            /* @__PURE__ */ e(H, { className: "w-4 h-4" }),
            "Note"
          ] }),
          /* @__PURE__ */ e("p", { className: "text-sm text-[var(--info-text)]", children: a("access_note") })
        ] })
      ] }),
      /* @__PURE__ */ r("div", { children: [
        /* @__PURE__ */ e("h3", { className: "font-medium mb-2", children: a("access_permissionsTitle") }),
        /* @__PURE__ */ e("div", { className: "grid md:grid-cols-2 gap-1", children: [
          "access_perm_view",
          "access_perm_create",
          "access_perm_update",
          "access_perm_changeStatus",
          "access_perm_assign",
          "access_perm_delete",
          "access_perm_comments",
          "access_perm_attachments"
        ].map((t) => /* @__PURE__ */ r("div", { className: "flex items-start gap-2 text-sm p-2 rounded bg-[var(--bg-secondary)]", children: [
          /* @__PURE__ */ e("code", { className: "text-[var(--color-primary-600)] text-xs font-mono mt-0.5", children: "→" }),
          /* @__PURE__ */ e("span", { children: a(t) })
        ] }, t)) })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(N, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("listView_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: a("listView_description") }),
      /* @__PURE__ */ r("div", { className: "card p-4 space-y-3", children: [
        /* @__PURE__ */ e("div", { className: "grid grid-cols-4 lg:grid-cols-8 gap-2", children: U.map((t) => /* @__PURE__ */ r("div", { className: `card p-3 text-center border ${g[t.color]}`, children: [
          /* @__PURE__ */ e("div", { className: "text-xl font-bold", children: t.value }),
          /* @__PURE__ */ e("div", { className: "text-[10px] opacity-80 mt-0.5", children: a(`stats_${t.key}`) })
        ] }, t.key)) }),
        /* @__PURE__ */ e(l, { label: a("stats_total"), children: a("listAnnotation_stats") })
      ] }),
      /* @__PURE__ */ r("div", { className: "card p-3 space-y-3", children: [
        /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ r("div", { className: "flex-1 relative", children: [
            /* @__PURE__ */ e(y, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ e("div", { className: "input w-full pl-10 py-2 text-sm text-[var(--text-tertiary)] bg-[var(--bg-secondary)] rounded-lg border border-[var(--border-color)]", children: "Rechercher un ticket..." })
          ] }),
          /* @__PURE__ */ r("button", { className: "btn btn-secondary flex items-center gap-2 text-sm", children: [
            /* @__PURE__ */ e(f, { className: "w-4 h-4" }),
            "Filtres"
          ] }),
          /* @__PURE__ */ r("div", { className: "flex items-center gap-1 border border-[var(--border-color)] rounded-lg p-1", children: [
            /* @__PURE__ */ e("div", { className: "p-1.5 rounded bg-[var(--color-primary-600)]/15", children: /* @__PURE__ */ e(v, { className: "w-4 h-4 text-[var(--color-primary-600)]" }) }),
            /* @__PURE__ */ e("div", { className: "p-1.5 rounded hover:bg-[var(--bg-secondary)]", children: /* @__PURE__ */ e(w, { className: "w-4 h-4 text-[var(--text-tertiary)]" }) }),
            /* @__PURE__ */ e("div", { className: "p-1.5 rounded hover:bg-[var(--bg-secondary)]", children: /* @__PURE__ */ e(N, { className: "w-4 h-4 text-[var(--text-tertiary)]" }) })
          ] }),
          /* @__PURE__ */ r("button", { className: "btn btn-primary flex items-center gap-2 text-sm", children: [
            /* @__PURE__ */ e(_, { className: "w-4 h-4" }),
            "Nouveau"
          ] })
        ] }),
        /* @__PURE__ */ e(l, { label: "Toolbar", children: a("listAnnotation_viewToggle") })
      ] }),
      /* @__PURE__ */ r("div", { className: "card overflow-hidden", children: [
        /* @__PURE__ */ r("table", { className: "w-full text-sm", children: [
          /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ r("tr", { className: "border-b border-[var(--border-color)] bg-[var(--bg-secondary)]", children: [
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_number") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_workspace") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_title") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_type") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_status") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_priority") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_comments") }),
            /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: a("table_created") }),
            /* @__PURE__ */ e("th", { className: "text-right p-3 font-medium", children: a("table_actions") })
          ] }) }),
          /* @__PURE__ */ e("tbody", { children: J.map((t, s) => /* @__PURE__ */ r("tr", { className: `border-b border-[var(--border-color)] hover:bg-[var(--bg-hover)] ${s === 0 ? "bg-[var(--color-primary-600)]/3" : ""}`, children: [
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e("span", { className: "font-mono text-xs text-[var(--text-secondary)]", children: t.num }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: t.workspace ? /* @__PURE__ */ e("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-blue-100 text-blue-700 border border-blue-200", children: t.workspace }) : /* @__PURE__ */ e("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-purple-100 text-purple-700 border border-purple-200", children: "System" }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e("span", { className: "font-medium line-clamp-1", children: t.title }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-secondary)]", children: t.type }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e(R, { status: t.status }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e(x, { priority: t.priority }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-[var(--text-secondary)]", children: [
              /* @__PURE__ */ e(T, { className: "w-3 h-3" }),
              /* @__PURE__ */ e("span", { className: "text-xs", children: t.msgs })
            ] }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-secondary)]", children: t.created }) }),
            /* @__PURE__ */ e("td", { className: "p-3 text-right", children: /* @__PURE__ */ r("div", { className: "flex items-center justify-end gap-1", children: [
              /* @__PURE__ */ e("button", { className: "p-1.5 rounded hover:bg-[var(--bg-secondary)]", children: /* @__PURE__ */ e(L, { className: "w-3.5 h-3.5 text-[var(--text-secondary)]" }) }),
              /* @__PURE__ */ e("button", { className: "p-1.5 rounded hover:bg-[var(--error-bg)]", children: /* @__PURE__ */ e(F, { className: "w-3.5 h-3.5 text-[var(--error-text)]" }) })
            ] }) })
          ] }, t.id)) })
        ] }),
        /* @__PURE__ */ r("div", { className: "p-3 space-y-2", children: [
          /* @__PURE__ */ e(l, { label: "Table", children: a("listAnnotation_table", "Table paginée avec colonnes cliquables. La ligne entière est cliquable pour accéder au détail. La corbeille est visible uniquement pour les admins.") }),
          /* @__PURE__ */ e(l, { label: "Workspace", children: a("listAnnotation_tenant") }),
          /* @__PURE__ */ r(l, { label: "Statut / Priorité", children: [
            a("listAnnotation_status"),
            " · ",
            a("listAnnotation_priority")
          ] })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(v, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("kanbanView_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: a("kanbanView_description") }),
      /* @__PURE__ */ r("div", { className: "card p-4", children: [
        /* @__PURE__ */ e("div", { className: "flex gap-3 overflow-x-auto pb-2", children: [
          { status: "Open", color: "warning", count: 2, tickets: [
            { num: "TKT-1002", title: "Demande d'accès CRM", priority: "Medium", msgs: 1 },
            { num: "TKT-1006", title: "Interface lente sur Firefox", priority: "High", msgs: 0 }
          ] },
          { status: "InProgress", color: "info", count: 2, tickets: [
            { num: "TKT-1001", title: "Erreur module Facturation", priority: "Critical", msgs: 3 },
            { num: "TKT-1007", title: "Export CSV manquant", priority: "Medium", msgs: 2 }
          ] },
          { status: "OnHold", color: "warning", count: 1, tickets: [
            { num: "TKT-1003", title: "SSO après mise à jour", priority: "High", msgs: 5 }
          ] },
          { status: "Resolved", color: "success", count: 2, tickets: [
            { num: "TKT-1004", title: "Export PDF rapports", priority: "Low", msgs: 2 },
            { num: "TKT-1008", title: "Erreur 403 dashboard", priority: "Medium", msgs: 1 }
          ] },
          { status: "Closed", color: "neutral", count: 1, tickets: [
            { num: "TKT-1005", title: "Matrice permissions", priority: "Low", msgs: 0 }
          ] }
        ].map((t) => /* @__PURE__ */ r("div", { className: "flex-shrink-0 w-44", children: [
          /* @__PURE__ */ r("div", { className: `flex items-center justify-between mb-2 px-2 py-1.5 rounded-lg ${g[t.color]}`, children: [
            /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: t.status === "Open" ? "Ouvert" : t.status === "InProgress" ? "En cours" : t.status === "OnHold" ? "En attente" : t.status === "Resolved" ? "Résolu" : "Fermé" }),
            /* @__PURE__ */ e("span", { className: "text-xs px-1.5 py-0.5 rounded-full bg-white/30 font-medium", children: t.count })
          ] }),
          /* @__PURE__ */ e("div", { className: "space-y-2", children: t.tickets.map((s) => /* @__PURE__ */ r("div", { className: `card p-2.5 cursor-pointer hover:shadow-md transition-shadow ${s.num === "TKT-1001" ? "ring-2 ring-[var(--color-primary-600)]/40" : ""}`, children: [
            /* @__PURE__ */ e("div", { className: "text-[10px] text-[var(--text-tertiary)] mb-1 font-mono", children: s.num }),
            /* @__PURE__ */ e("div", { className: "text-xs font-medium line-clamp-2 mb-1.5", children: s.title }),
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between", children: [
              /* @__PURE__ */ e(x, { priority: s.priority }),
              /* @__PURE__ */ r("div", { className: "flex items-center gap-0.5 text-[var(--text-tertiary)]", children: [
                /* @__PURE__ */ e(T, { className: "w-3 h-3" }),
                /* @__PURE__ */ e("span", { className: "text-[10px]", children: s.msgs })
              ] })
            ] })
          ] }, s.num)) })
        ] }, t.status)) }),
        /* @__PURE__ */ r("div", { className: "mt-3 space-y-1", children: [
          /* @__PURE__ */ e(l, { label: "Colonnes", children: a("kanbanAnnotation_columns") }),
          /* @__PURE__ */ e(l, { label: "Drag & Drop", children: a("kanbanAnnotation_drag") })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(f, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("filterPanel_title")
      ] }),
      /* @__PURE__ */ r("div", { className: "card p-4", children: [
        /* @__PURE__ */ r("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3", children: [
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-xs font-medium mb-1 text-[var(--text-secondary)]", children: a("table_status") }),
            /* @__PURE__ */ r("select", { className: "input w-full text-sm py-1.5", children: [
              /* @__PURE__ */ e("option", { children: "Tous les statuts" }),
              /* @__PURE__ */ e("option", { children: "Ouvert" }),
              /* @__PURE__ */ e("option", { children: "En cours" }),
              /* @__PURE__ */ e("option", { children: "En attente" }),
              /* @__PURE__ */ e("option", { children: "Résolu" }),
              /* @__PURE__ */ e("option", { children: "Fermé" })
            ] })
          ] }),
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-xs font-medium mb-1 text-[var(--text-secondary)]", children: a("table_type") }),
            /* @__PURE__ */ r("select", { className: "input w-full text-sm py-1.5", children: [
              /* @__PURE__ */ e("option", { children: "Tous les types" }),
              /* @__PURE__ */ e("option", { children: "Bug" }),
              /* @__PURE__ */ e("option", { children: "Fonctionnalité" }),
              /* @__PURE__ */ e("option", { children: "Application" }),
              /* @__PURE__ */ e("option", { children: "Support" }),
              /* @__PURE__ */ e("option", { children: "Question" })
            ] })
          ] }),
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-xs font-medium mb-1 text-[var(--text-secondary)]", children: a("table_priority") }),
            /* @__PURE__ */ r("select", { className: "input w-full text-sm py-1.5", children: [
              /* @__PURE__ */ e("option", { children: "Toutes les priorités" }),
              /* @__PURE__ */ e("option", { children: "Faible" }),
              /* @__PURE__ */ e("option", { children: "Moyen" }),
              /* @__PURE__ */ e("option", { children: "Élevé" }),
              /* @__PURE__ */ e("option", { children: "Critique" })
            ] })
          ] }),
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("label", { className: "block text-xs font-medium mb-1 text-[var(--text-secondary)]", children: a("table_workspace") }),
            /* @__PURE__ */ r("select", { className: "input w-full text-sm py-1.5", children: [
              /* @__PURE__ */ e("option", { children: "Tous les workspaces" }),
              /* @__PURE__ */ e("option", { children: "Acme Corp" }),
              /* @__PURE__ */ e("option", { children: "TechStartup" }),
              /* @__PURE__ */ e("option", { children: "InnovateCo" })
            ] })
          ] })
        ] }),
        /* @__PURE__ */ r("div", { className: "mt-3 space-y-1", children: [
          /* @__PURE__ */ e(l, { label: "Statut", children: a("filterAnnotation_status") }),
          /* @__PURE__ */ e(l, { label: "Workspace", children: a("filterAnnotation_tenant") })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(k, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("detailView_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: a("detailView_description") }),
      /* @__PURE__ */ r("div", { className: "card overflow-hidden border border-[var(--border-color)]", children: [
        /* @__PURE__ */ r("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-[var(--bg-card)]", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
            /* @__PURE__ */ e("button", { className: "p-1.5 rounded hover:bg-[var(--bg-secondary)]", children: /* @__PURE__ */ e($, { className: "w-4 h-4" }) }),
            /* @__PURE__ */ r("div", { className: "flex-1 min-w-0", children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-1", children: [
                /* @__PURE__ */ e("span", { className: "font-mono text-xs text-[var(--text-secondary)]", children: "TKT-1001" }),
                /* @__PURE__ */ e(R, { status: "InProgress" }),
                /* @__PURE__ */ e(x, { priority: "Critical" }),
                /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-[10px] text-[var(--success-text)]", children: [
                  /* @__PURE__ */ e("div", { className: "w-1.5 h-1.5 rounded-full bg-[var(--success-text)]" }),
                  "Live"
                ] })
              ] }),
              /* @__PURE__ */ e("h1", { className: "text-base font-bold truncate", children: "Erreur d'accès au module Facturation" })
            ] }),
            /* @__PURE__ */ e("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ e("button", { className: "p-1.5 rounded hover:bg-[var(--bg-secondary)]", title: "Modifier", children: /* @__PURE__ */ e(C, { className: "w-4 h-4 text-[var(--text-secondary)]" }) }) })
          ] }),
          /* @__PURE__ */ e(l, { label: "En-tête", children: a("detailAnnotation_header") }),
          /* @__PURE__ */ e(l, { label: "SignalR", children: a("detailAnnotation_realtime") })
        ] }),
        /* @__PURE__ */ r("div", { className: "px-4 py-2 border-b border-[var(--border-color)] bg-[var(--bg-secondary)]", children: [
          /* @__PURE__ */ e("div", { className: "flex items-center gap-1 text-xs overflow-x-auto", children: [
            { label: "Ouvert", date: "21/02 09:00", done: !0 },
            { label: "En cours", date: "21/02 09:15", done: !0, current: !0 },
            { label: "En attente", date: null, done: !1 },
            { label: "Résolu", date: null, done: !1 },
            { label: "Fermé", date: null, done: !1 }
          ].map((t, s) => /* @__PURE__ */ r("div", { className: "flex items-center gap-1 shrink-0", children: [
            s > 0 && /* @__PURE__ */ e(I, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ r("div", { className: `flex flex-col items-center px-2 py-1 rounded ${t.current ? "bg-[var(--info-bg)] text-[var(--info-text)]" : t.done ? "text-[var(--success-text)]" : "text-[var(--text-tertiary)]"}`, children: [
              /* @__PURE__ */ e("span", { className: "font-medium", children: t.label }),
              t.date && /* @__PURE__ */ e("span", { className: "text-[10px] opacity-70", children: t.date })
            ] })
          ] }, t.label)) }),
          /* @__PURE__ */ e(l, { label: "Workflow", children: a("detailAnnotation_workflow") })
        ] }),
        /* @__PURE__ */ r("div", { className: "flex", style: { minHeight: "320px" }, children: [
          /* @__PURE__ */ r("div", { className: "flex-1 border-r border-[var(--border-color)] flex flex-col", children: [
            /* @__PURE__ */ r("div", { className: "flex-1 p-4 space-y-3 overflow-y-auto", children: [
              /* @__PURE__ */ r("div", { className: "p-3 rounded-lg bg-[var(--bg-secondary)]", children: [
                /* @__PURE__ */ r("div", { className: "text-xs text-[var(--text-tertiary)] mb-1 flex items-center gap-1", children: [
                  /* @__PURE__ */ e(o, { className: "w-3 h-3" }),
                  /* @__PURE__ */ e("span", { children: "Sophie Martin • 21/02 09:00" }),
                  /* @__PURE__ */ e("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-blue-100 text-blue-700 ml-1", children: "Client" })
                ] }),
                /* @__PURE__ */ e("p", { className: "text-sm", children: "Depuis ce matin, impossible d'accéder au module Facturation. J'obtiens une erreur 403 sur /billing/invoices." })
              ] }),
              /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border border-[var(--warning-border)] bg-[var(--warning-bg)]/30", children: [
                /* @__PURE__ */ r("div", { className: "text-xs text-[var(--text-tertiary)] mb-1 flex items-center gap-1", children: [
                  /* @__PURE__ */ e(i, { className: "w-3 h-3" }),
                  /* @__PURE__ */ e("span", { children: "Jean Dupont • 21/02 09:20" }),
                  /* @__PURE__ */ e("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-[var(--warning-bg)] text-[var(--warning-text)] ml-1", children: "Interne" })
                ] }),
                /* @__PURE__ */ e("p", { className: "text-sm", children: "Vérifié dans les logs — rôle 'billing.view' manquant après la màj de permission. À corriger dans le groupe 'Comptabilité'." })
              ] }),
              /* @__PURE__ */ r("div", { className: "p-3 rounded-lg bg-[var(--color-primary-600)]/5 border border-[var(--color-primary-600)]/10", children: [
                /* @__PURE__ */ r("div", { className: "text-xs text-[var(--text-tertiary)] mb-1 flex items-center gap-1", children: [
                  /* @__PURE__ */ e(o, { className: "w-3 h-3" }),
                  /* @__PURE__ */ e("span", { children: "Jean Dupont • 21/02 09:35" }),
                  /* @__PURE__ */ e("span", { className: "text-[10px] px-1.5 py-0.5 rounded bg-[var(--color-primary-600)]/15 text-[var(--color-primary-600)] ml-1", children: "Agent" })
                ] }),
                /* @__PURE__ */ e("p", { className: "text-sm", children: "Nous avons identifié le problème. La permission 'billing.view' a été omise lors de la dernière mise à jour. Correction en cours." })
              ] })
            ] }),
            /* @__PURE__ */ r("div", { className: "p-3 border-t border-[var(--border-color)]", children: [
              /* @__PURE__ */ r("div", { className: "flex gap-2", children: [
                /* @__PURE__ */ e("div", { className: "flex-1 rounded-lg border border-[var(--border-color)] bg-[var(--bg-secondary)] px-3 py-2 text-sm text-[var(--text-tertiary)]", children: "Répondre... (Maj+Entrée pour nouvelle ligne)" }),
                /* @__PURE__ */ e("button", { className: "btn btn-primary text-sm px-3", children: "Envoyer" })
              ] }),
              /* @__PURE__ */ r("label", { className: "flex items-center gap-2 mt-2 text-xs text-[var(--text-secondary)]", children: [
                /* @__PURE__ */ e("input", { type: "checkbox", className: "rounded" }),
                /* @__PURE__ */ e(i, { className: "w-3 h-3" }),
                "Note interne (visible agents uniquement)"
              ] })
            ] }),
            /* @__PURE__ */ e("div", { className: "px-3 pb-2", children: /* @__PURE__ */ e(l, { label: "Conversation", children: a("detailAnnotation_conversation") }) })
          ] }),
          /* @__PURE__ */ r("div", { className: "w-60 shrink-0 overflow-y-auto bg-[var(--bg-card)]", children: [
            /* @__PURE__ */ r("div", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-3 py-2", children: [
                /* @__PURE__ */ e(n, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e(k, { className: "w-3.5 h-3.5 text-[var(--color-primary-600)]" }),
                /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: a("sidebar_info") })
              ] }),
              /* @__PURE__ */ e("div", { className: "px-3 pb-3 space-y-1.5", children: [
                { label: "Type", value: "Bug" },
                { label: "Priorité", value: /* @__PURE__ */ e(x, { priority: "Critical" }) },
                { label: "Créé par", value: "Sophie Martin" },
                { label: "Assigné à", value: /* @__PURE__ */ r("span", { className: "flex items-center gap-1", children: [
                  "Jean Dupont ",
                  /* @__PURE__ */ e(A, { className: "w-3 h-3 text-[var(--color-primary-600)] cursor-pointer" })
                ] }) },
                { label: "Créé le", value: "21/02/2026 09:00" }
              ].map((t) => /* @__PURE__ */ r("div", { className: "flex justify-between items-center text-xs", children: [
                /* @__PURE__ */ e("span", { className: "text-[var(--text-tertiary)]", children: t.label }),
                /* @__PURE__ */ e("span", { className: "font-medium", children: t.value })
              ] }, t.label)) })
            ] }),
            /* @__PURE__ */ r("div", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-3 py-2", children: [
                /* @__PURE__ */ e(n, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e(b, { className: "w-3.5 h-3.5 text-[var(--color-primary-600)]" }),
                /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: a("sidebar_systemInfo") })
              ] }),
              /* @__PURE__ */ r("div", { className: "px-3 pb-3 space-y-1.5", children: [
                /* @__PURE__ */ r("div", { className: "p-2 bg-[var(--bg-secondary)] rounded text-xs", children: [
                  /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-[var(--text-tertiary)] mb-0.5", children: [
                    /* @__PURE__ */ e(E, { className: "w-3 h-3" }),
                    "URL"
                  ] }),
                  /* @__PURE__ */ e("span", { className: "font-mono text-[10px] break-all", children: "/billing/invoices" })
                ] }),
                /* @__PURE__ */ r("div", { className: "grid grid-cols-2 gap-1.5", children: [
                  /* @__PURE__ */ r("div", { className: "p-1.5 bg-[var(--bg-secondary)] rounded text-[10px]", children: [
                    /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-[var(--text-tertiary)] mb-0.5", children: [
                      /* @__PURE__ */ e(D, { className: "w-3 h-3" }),
                      "Navigateur"
                    ] }),
                    /* @__PURE__ */ e("div", { className: "font-medium", children: "Chrome 130" })
                  ] }),
                  /* @__PURE__ */ r("div", { className: "p-1.5 bg-[var(--bg-secondary)] rounded text-[10px]", children: [
                    /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-[var(--text-tertiary)] mb-0.5", children: [
                      /* @__PURE__ */ e(b, { className: "w-3 h-3" }),
                      "OS"
                    ] }),
                    /* @__PURE__ */ e("div", { className: "font-medium", children: "Windows 11" })
                  ] })
                ] })
              ] })
            ] }),
            /* @__PURE__ */ r("div", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-3 py-2", children: [
                /* @__PURE__ */ e(n, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e(K, { className: "w-3.5 h-3.5 text-[var(--color-primary-600)]" }),
                /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: a("sidebar_errors") }),
                /* @__PURE__ */ e("span", { className: "ml-auto text-[10px] px-1 py-0.5 rounded-full bg-[var(--error-bg)] text-[var(--error-text)]", children: "1" })
              ] }),
              /* @__PURE__ */ e("div", { className: "px-3 pb-3", children: /* @__PURE__ */ r("div", { className: "p-2 bg-[var(--error-bg)]/30 border border-[var(--error-border)] rounded text-[10px]", children: [
                /* @__PURE__ */ r("div", { className: "flex items-center gap-1 mb-1", children: [
                  /* @__PURE__ */ e(B, { className: "w-3 h-3 text-[var(--error-text)]" }),
                  /* @__PURE__ */ e("span", { className: "bg-[var(--bg-secondary)] px-1 rounded", children: "BillingPage" })
                ] }),
                /* @__PURE__ */ e("span", { className: "text-[var(--error-text)] font-medium", children: "403 Forbidden: /api/billing/invoices" })
              ] }) })
            ] }),
            /* @__PURE__ */ r("div", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-3 py-2", children: [
                /* @__PURE__ */ e(n, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e(u, { className: "w-3.5 h-3.5 text-[var(--color-primary-600)]" }),
                /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: a("sidebar_actions") })
              ] }),
              /* @__PURE__ */ r("div", { className: "px-3 pb-3 space-y-2", children: [
                /* @__PURE__ */ r("button", { className: "btn btn-secondary w-full text-xs py-1.5 flex items-center justify-center gap-1", children: [
                  /* @__PURE__ */ e(P, { className: "w-3.5 h-3.5" }),
                  "Mettre en attente"
                ] }),
                /* @__PURE__ */ r("button", { className: "btn btn-primary w-full text-xs py-1.5 flex items-center justify-center gap-1", children: [
                  /* @__PURE__ */ e(d, { className: "w-3.5 h-3.5" }),
                  "Résoudre"
                ] }),
                /* @__PURE__ */ r("button", { className: "w-full text-xs py-1.5 flex items-center justify-center gap-1 rounded border border-[var(--warning-border)] bg-[var(--warning-bg)] text-[var(--warning-text)]", children: [
                  /* @__PURE__ */ e(m, { className: "w-3.5 h-3.5" }),
                  "Escalader"
                ] })
              ] })
            ] }),
            /* @__PURE__ */ r("div", { children: [
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-3 py-2", children: [
                /* @__PURE__ */ e(n, { className: "w-3 h-3 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e(S, { className: "w-3.5 h-3.5 text-[var(--color-primary-600)]" }),
                /* @__PURE__ */ e("span", { className: "text-xs font-medium", children: a("sidebar_history") }),
                /* @__PURE__ */ e("span", { className: "ml-auto text-[10px] px-1 py-0.5 rounded-full bg-[var(--bg-secondary)] text-[var(--text-secondary)]", children: "3" })
              ] }),
              /* @__PURE__ */ r("div", { className: "px-3 pb-3 relative pl-6", children: [
                /* @__PURE__ */ e("div", { className: "absolute left-5 top-0 bottom-0 w-0.5 bg-[var(--border-color)]" }),
                [
                  { icon: C, label: "Assigné → Jean Dupont", time: "Il y a 25 min", color: "var(--color-primary-600)" },
                  { icon: m, label: "Statut → En cours", time: "Il y a 45 min", color: "var(--info-text)" },
                  { icon: _, label: "Ticket créé", time: "Il y a 1h", color: "var(--success-text)" }
                ].map((t, s) => {
                  const c = t.icon;
                  return /* @__PURE__ */ r("div", { className: "relative flex gap-2 mb-2 last:mb-0", children: [
                    /* @__PURE__ */ e("div", { className: "relative z-10 w-4 h-4 rounded-full bg-[var(--bg-card)] border border-[var(--border-color)] flex items-center justify-center -ml-3", children: /* @__PURE__ */ e(c, { className: "w-2.5 h-2.5", style: { color: t.color } }) }),
                    /* @__PURE__ */ r("div", { className: "flex-1 min-w-0", children: [
                      /* @__PURE__ */ e("p", { className: "text-[10px] font-medium", children: t.label }),
                      /* @__PURE__ */ e("p", { className: "text-[9px] text-[var(--text-tertiary)]", children: t.time })
                    ] })
                  ] }, s);
                })
              ] })
            ] }),
            /* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e(l, { label: "Sidebar", children: a("detailAnnotation_sidebar") }) })
          ] })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(u, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("agentActions_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)]", children: a("agentActions_description") }),
      /* @__PURE__ */ r("div", { className: "grid md:grid-cols-2 gap-4", children: [
        /* @__PURE__ */ r("div", { className: "card p-4 space-y-3", children: [
          /* @__PURE__ */ e("h3", { className: "font-medium text-sm mb-3", children: "Transitions d'état" }),
          [
            { action: "action_startProcessing", desc: "action_startProcessing_desc", icon: p, color: "info" },
            { action: "action_putOnHold", desc: "action_putOnHold_desc", icon: P, color: "warning" },
            { action: "action_resume", desc: "action_resume_desc", icon: p, color: "info" },
            { action: "action_resolve", desc: "action_resolve_desc", icon: d, color: "success" },
            { action: "action_close", desc: "action_close_desc", icon: q, color: "neutral" },
            { action: "action_reopen", desc: "action_reopen_desc", icon: G, color: "warning" }
          ].map((t) => {
            const s = t.icon;
            return /* @__PURE__ */ r("div", { className: "flex items-start gap-3 p-2 rounded-lg bg-[var(--bg-secondary)]", children: [
              /* @__PURE__ */ e("div", { className: `p-1.5 rounded ${g[t.color]}`, children: /* @__PURE__ */ e(s, { className: "w-3.5 h-3.5" }) }),
              /* @__PURE__ */ r("div", { children: [
                /* @__PURE__ */ e("p", { className: "text-sm font-medium", children: a(t.action) }),
                /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)]", children: a(t.desc) })
              ] })
            ] }, t.action);
          })
        ] }),
        /* @__PURE__ */ r("div", { className: "space-y-4", children: [
          /* @__PURE__ */ r("div", { className: "card p-4", children: [
            /* @__PURE__ */ r("h3", { className: "font-medium text-sm mb-3 flex items-center gap-2", children: [
              /* @__PURE__ */ e(A, { className: "w-4 h-4 text-[var(--color-primary-600)]" }),
              a("action_assign")
            ] }),
            /* @__PURE__ */ r("div", { className: "rounded-lg border border-[var(--border-color)] overflow-hidden", children: [
              /* @__PURE__ */ r("div", { className: "relative px-3 py-2 border-b border-[var(--border-color)]", children: [
                /* @__PURE__ */ e(y, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-[var(--text-tertiary)]" }),
                /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-tertiary)] pl-6", children: "Rechercher un agent..." })
              ] }),
              ["Non assigné", "Jean Dupont", "Marie Laurent", "Paul Bernard"].map((t, s) => /* @__PURE__ */ r("div", { className: `flex items-center gap-2 px-3 py-2 text-sm border-b border-[var(--border-color)] last:border-b-0 ${s === 1 ? "bg-[var(--color-primary-600)]/8 border-l-2 border-l-[var(--color-primary-600)]" : ""}`, children: [
                /* @__PURE__ */ e("div", { className: `w-6 h-6 rounded-full flex items-center justify-center text-xs font-medium ${s === 0 ? "bg-[var(--bg-tertiary)] text-[var(--text-tertiary)]" : "bg-[var(--color-primary-600)] text-white"}`, children: s === 0 ? /* @__PURE__ */ e(o, { className: "w-3.5 h-3.5" }) : t[0] }),
                /* @__PURE__ */ e("span", { children: t }),
                s === 1 && /* @__PURE__ */ e(d, { className: "w-4 h-4 text-[var(--color-primary-600)] ml-auto" })
              ] }, t))
            ] }),
            /* @__PURE__ */ e(l, { label: "Modale Assigner", children: a("assignModal_annotation") })
          ] }),
          /* @__PURE__ */ r("div", { className: "card p-4", children: [
            /* @__PURE__ */ r("h3", { className: "font-medium text-sm mb-3 flex items-center gap-2", children: [
              /* @__PURE__ */ e(m, { className: "w-4 h-4 text-[var(--warning-text)]" }),
              a("action_escalate")
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: ["Supervisor", "Manager", "Director"].map((t, s) => /* @__PURE__ */ r("div", { className: `flex items-center gap-3 px-3 py-2 rounded-lg border transition-colors ${s === 0 ? "border-[var(--warning-border)] bg-[var(--warning-bg)]" : "border-[var(--border-color)]"}`, children: [
              /* @__PURE__ */ e("div", { className: `w-3.5 h-3.5 rounded-full border-2 flex items-center justify-center ${s === 0 ? "border-[var(--warning-text)]" : "border-[var(--border-color)]"}`, children: s === 0 && /* @__PURE__ */ e("div", { className: "w-2 h-2 rounded-full bg-[var(--warning-text)]" }) }),
              /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("p", { className: "text-xs font-medium", children: a(`action_escalate_${t.toLowerCase()}`) }) })
            ] }, t)) }),
            /* @__PURE__ */ e(l, { label: "Modale Escalader", children: a("escalateModal_annotation") })
          ] })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { className: "space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(M, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("useCases_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "grid md:grid-cols-3 gap-4", children: [1, 2, 3].map((t) => /* @__PURE__ */ r("div", { className: "card p-4", children: [
        /* @__PURE__ */ e("h3", { className: "font-medium text-sm mb-3", children: a(`useCase${t}_title`) }),
        /* @__PURE__ */ e("ol", { className: "space-y-2", children: [1, 2, 3, 4, ...t === 1 ? [5, 6] : []].map((s) => /* @__PURE__ */ r("li", { className: "flex items-start gap-2 text-xs", children: [
          /* @__PURE__ */ e("span", { className: "w-4 h-4 rounded-full bg-[var(--color-primary-600)]/15 text-[var(--color-primary-600)] text-[10px] font-bold flex items-center justify-center shrink-0 mt-0.5", children: s }),
          /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: a(`useCase${t}_step${s}`) })
        ] }, s)) })
      ] }, t)) })
    ] }),
    /* @__PURE__ */ r("section", { className: "card p-6 space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(i, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("businessRules_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "grid md:grid-cols-2 gap-3", children: [1, 2, 3, 4, 5, 6, 7].map((t) => /* @__PURE__ */ r("div", { className: "p-3 rounded-lg bg-[var(--bg-secondary)]", children: [
        /* @__PURE__ */ e("h4", { className: "text-sm font-medium mb-1", children: a(`rule${t}_title`) }),
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)]", children: a(`rule${t}_desc`) })
      ] }, t)) })
    ] }),
    /* @__PURE__ */ r("section", { className: "card p-6 space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(u, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("features_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3", children: [
        { key: "realtime", icon: M },
        { key: "multitenancy", icon: E },
        { key: "kanban", icon: v },
        { key: "internalNotes", icon: i },
        { key: "clientContext", icon: b },
        { key: "escalation", icon: m },
        { key: "attachments", icon: V },
        { key: "activityLog", icon: S }
      ].map(({ key: t, icon: s }) => /* @__PURE__ */ r("div", { className: "p-3 rounded-lg bg-[var(--bg-secondary)] text-center", children: [
        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-[var(--color-primary-600)]/10 w-fit mx-auto mb-2", children: /* @__PURE__ */ e(s, { className: "w-4 h-4 text-[var(--color-primary-600)]" }) }),
        /* @__PURE__ */ e("p", { className: "text-xs font-medium", children: a(`feature_${t}`) }),
        /* @__PURE__ */ e("p", { className: "text-[10px] text-[var(--text-tertiary)] mt-0.5", children: a(`feature_${t}_desc`) })
      ] }, t)) })
    ] }),
    /* @__PURE__ */ r("section", { className: "card p-6 space-y-4", children: [
      /* @__PURE__ */ r("h2", { className: "text-xl font-semibold flex items-center gap-2", children: [
        /* @__PURE__ */ e(w, { className: "w-5 h-5 text-[var(--color-primary-600)]" }),
        a("api_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)]", children: a("api_subtitle") }),
      /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ r("table", { className: "w-full text-xs", children: [
        /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ r("tr", { className: "bg-[var(--bg-secondary)]", children: [
          /* @__PURE__ */ e("th", { className: "text-left py-2 px-3 rounded-tl-lg font-medium", children: a("api_col_method") }),
          /* @__PURE__ */ e("th", { className: "text-left py-2 px-3 font-medium", children: a("api_col_endpoint") }),
          /* @__PURE__ */ e("th", { className: "text-left py-2 px-3 font-medium", children: a("api_col_description") }),
          /* @__PURE__ */ e("th", { className: "text-left py-2 px-3 rounded-tr-lg font-medium", children: a("api_col_permission") })
        ] }) }),
        /* @__PURE__ */ e("tbody", { children: [
          { method: "GET", ep: "/", desc: "api_ep1", perm: "tickets.view" },
          { method: "GET", ep: "/my-assigned", desc: "api_ep2", perm: "tickets.view" },
          { method: "GET", ep: "/{id}", desc: "api_ep3", perm: "tickets.view" },
          { method: "GET", ep: "/{id}/activities", desc: "api_ep4", perm: "tickets.view" },
          { method: "GET", ep: "/stats", desc: "api_ep5", perm: "tickets.view" },
          { method: "POST", ep: "/", desc: "api_ep6", perm: "tickets.create" },
          { method: "PUT", ep: "/{id}", desc: "api_ep7", perm: "tickets.update" },
          { method: "PATCH", ep: "/{id}/status", desc: "api_ep8", perm: "tickets.changestatus" },
          { method: "PATCH", ep: "/{id}/assign", desc: "api_ep9", perm: "tickets.assign" },
          { method: "PATCH", ep: "/{id}/resolve", desc: "api_ep10", perm: "tickets.changestatus" },
          { method: "PATCH", ep: "/{id}/close", desc: "api_ep11", perm: "tickets.changestatus" },
          { method: "PATCH", ep: "/{id}/reopen", desc: "api_ep12", perm: "tickets.changestatus" },
          { method: "POST", ep: "/{id}/comments", desc: "api_ep13", perm: "comments.create" },
          { method: "POST", ep: "/{id}/attachments", desc: "api_ep14", perm: "tickets.update" },
          { method: "GET", ep: "/{id}/attachments/{aId}", desc: "api_ep15", perm: "attachments.view" },
          { method: "DELETE", ep: "/{id}", desc: "api_ep16", perm: "tickets.delete" }
        ].map((t, s) => /* @__PURE__ */ r("tr", { className: "border-b border-[var(--border-color)] hover:bg-[var(--bg-hover)]", children: [
          /* @__PURE__ */ e("td", { className: "py-2 px-3", children: /* @__PURE__ */ e("span", { className: `px-1.5 py-0.5 rounded text-[10px] font-bold font-mono ${{
            GET: "bg-[var(--info-bg)] text-[var(--info-text)]",
            POST: "bg-[var(--success-bg)] text-[var(--success-text)]",
            PUT: "bg-[var(--warning-bg)] text-[var(--warning-text)]",
            PATCH: "bg-purple-100 text-purple-700",
            DELETE: "bg-[var(--error-bg)] text-[var(--error-text)]"
          }[t.method]}`, children: t.method }) }),
          /* @__PURE__ */ r("td", { className: "py-2 px-3 font-mono text-[var(--text-secondary)]", children: [
            "/api/support/tickets",
            t.ep
          ] }),
          /* @__PURE__ */ e("td", { className: "py-2 px-3", children: a(t.desc) }),
          /* @__PURE__ */ e("td", { className: "py-2 px-3", children: /* @__PURE__ */ r("code", { className: "text-[10px] px-1.5 py-0.5 bg-[var(--bg-secondary)] rounded", children: [
            "support.",
            t.perm
          ] }) })
        ] }, s)) })
      ] }) })
    ] }),
    /* @__PURE__ */ r("div", { className: "flex justify-between pt-6 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ r(
        h,
        {
          to: "/system/docs/user",
          className: "flex items-center gap-2 text-[var(--text-secondary)] hover:text-[var(--color-primary-600)]",
          children: [
            /* @__PURE__ */ e(p, { className: "w-4 h-4 rotate-180" }),
            a("navBack")
          ]
        }
      ),
      /* @__PURE__ */ r(
        h,
        {
          to: "/docs/business/platform/support/dashboard",
          className: "flex items-center gap-2 text-[var(--color-primary-600)] hover:underline",
          children: [
            a("navNext"),
            /* @__PURE__ */ e(p, { className: "w-4 h-4" })
          ]
        }
      )
    ] })
  ] });
}
export {
  Z as default
};
//# sourceMappingURL=index-CnmIX2MY.js.map
