import { jsxs as r, jsx as e } from "react/jsx-runtime";
import { useState as u } from "react";
import { Link as m } from "react-router-dom";
import { useTranslation as g } from "react-i18next";
import { Code as y, Layers as p, CheckCircle as x, XCircle as N, Search as _, BookOpen as f, Database as w, Zap as v, Clock as k, Shield as b, FileCode2 as A, Copy as K, Brain as C, ChevronRight as h, ArrowLeft as S, ArrowRight as z, Info as T, ChevronDown as L } from "lucide-react";
function d({ children: a }) {
  return /* @__PURE__ */ r("div", { className: "flex items-start gap-2 px-3 py-2 rounded-md border-l-2 border-[var(--color-accent-500)] bg-[var(--bg-secondary)] text-xs text-[var(--text-secondary)]", children: [
    /* @__PURE__ */ e(T, { className: "w-3.5 h-3.5 mt-0.5 flex-shrink-0 text-[var(--text-tertiary)]" }),
    /* @__PURE__ */ e("span", { className: "leading-relaxed", children: a })
  ] });
}
function l({ n: a }) {
  return /* @__PURE__ */ e("span", { className: "inline-flex items-center justify-center w-7 h-7 rounded-full bg-[var(--color-accent-500)]/15 text-[var(--color-accent-600)] text-sm font-semibold flex-shrink-0", children: a });
}
function j({ title: a, children: n }) {
  const [c, t] = u(!1);
  return /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-[var(--radius-card)] overflow-hidden", children: [
    /* @__PURE__ */ r(
      "button",
      {
        onClick: () => t((i) => !i),
        className: "w-full flex items-center justify-between px-6 py-4 bg-[var(--bg-card)] hover:bg-[var(--bg-hover)] transition-colors text-left",
        "aria-expanded": c,
        children: [
          /* @__PURE__ */ e("span", { className: "font-semibold text-[var(--text-primary)]", children: a }),
          c ? /* @__PURE__ */ e(L, { className: "w-4 h-4 text-[var(--text-tertiary)] flex-shrink-0" }) : /* @__PURE__ */ e(h, { className: "w-4 h-4 text-[var(--text-tertiary)] flex-shrink-0" })
        ]
      }
    ),
    c && /* @__PURE__ */ e("div", { className: "p-6 bg-[var(--bg-card)] border-t border-[var(--border-color)]", children: n })
  ] });
}
const E = [
  { app: "Administration", module: "Utilisateurs", name: "Export Users", desc: "Liste paginée des utilisateurs avec rôles et tenants", route: "/api/v1/export/users", entity: "User", rate: 60, pageSize: 1e3, active: !0 },
  { app: "Administration", module: "Tenants", name: "Export Tenants", desc: "Liste paginée des tenants avec type et membres", route: "/api/v1/export/tenants", entity: "Tenant", rate: 30, pageSize: 500, active: !0 },
  { app: "Administration", module: "Permissions", name: "Export Roles", desc: "Liste paginée des rôles et permissions assignées", route: "/api/v1/export/roles", entity: "Role", rate: 60, pageSize: 1e3, active: !0 },
  { app: "Support", module: "Tickets", name: "Export Tickets", desc: "Liste paginée des tickets avec statuts et assignations", route: "/api/v1/export/tickets", entity: "Ticket", rate: 30, pageSize: 500, active: !0 },
  { app: "Administration", module: "Applications", name: "Export Navigation", desc: "Arbre de navigation complet (retour direct, non paginé)", route: "/api/v1/export/navigation", entity: "NavigationApplication", rate: 120, pageSize: null, active: !1 }
], R = [
  { name: "id", type: "Guid", nullable: !1, desc: "Identifiant unique de l'application" },
  { name: "code", type: "string", nullable: !1, desc: "Code application (ex: administration)" },
  { name: "label", type: "string", nullable: !1, desc: "Libellé affiché dans le menu" },
  { name: "modules", type: "Module[]", nullable: !1, desc: "Liste des modules enfants" },
  { name: "modules[].id", type: "Guid", nullable: !1, desc: "Identifiant unique du module" },
  { name: "modules[].code", type: "string", nullable: !1, desc: "Code module (ex: users)" },
  { name: "modules[].label", type: "string", nullable: !1, desc: "Libellé du module" }
];
function D() {
  const { t: a } = g("docsPlatformApiApisCatalog"), n = [
    { method: a("api_catalog_method"), path: a("api_catalog_path"), perm: a("api_catalog_permission"), label: a("api_catalog_label") },
    { method: a("api_token_method"), path: a("api_token_path"), perm: a("api_token_permission"), label: a("api_token_label") },
    { method: a("api_users_method"), path: a("api_users_path"), perm: a("api_users_permission"), label: a("api_users_label") },
    { method: a("api_tenants_method"), path: a("api_tenants_path"), perm: a("api_tenants_permission"), label: a("api_tenants_label") },
    { method: a("api_roles_method"), path: a("api_roles_path"), perm: a("api_roles_permission"), label: a("api_roles_label") },
    { method: a("api_tickets_method"), path: a("api_tickets_path"), perm: a("api_tickets_permission"), label: a("api_tickets_label") },
    { method: a("api_nav_method"), path: a("api_nav_path"), perm: a("api_nav_permission"), label: a("api_nav_label") }
  ], c = [
    { id: a("br001_id"), title: a("br001_title"), body: a("br001_body") },
    { id: a("br002_id"), title: a("br002_title"), body: a("br002_body") },
    { id: a("br003_id"), title: a("br003_title"), body: a("br003_body") },
    { id: a("br004_id"), title: a("br004_title"), body: a("br004_body") },
    { id: a("br005_id"), title: a("br005_title"), body: a("br005_body") },
    { id: a("br006_id"), title: a("br006_title"), body: a("br006_body") },
    { id: a("br007_id"), title: a("br007_title"), body: a("br007_body") }
  ];
  return /* @__PURE__ */ r("div", { className: "space-y-8 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(m, { to: "/system/docs/user", className: "hover:text-[var(--color-accent-600)] transition-colors", 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(y, { className: "w-8 h-8 text-[var(--color-accent-600)]" }),
        a("pageTitle")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-lg text-[var(--text-secondary)]", children: a("pageSubtitle") })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-4", children: [
        /* @__PURE__ */ e(l, { n: 1 }),
        a("section1_objectif_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] leading-relaxed", children: a("objective") })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-4", children: [
        /* @__PURE__ */ e(l, { n: 2 }),
        a("section1_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] leading-relaxed", children: a("section1_description") })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-4", children: [
        /* @__PURE__ */ e(l, { n: 3 }),
        a("section2_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-4", children: a("section2_description") }),
      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-3", children: [
        { label: "Navigation", value: a("section2_nav") },
        { label: "URL", value: a("section2_url") },
        { label: "Permission", value: a("section2_permission") }
      ].map(({ label: t, value: i }) => /* @__PURE__ */ r("div", { className: "p-3 bg-[var(--bg-secondary)] rounded-md", children: [
        /* @__PURE__ */ e("div", { className: "text-[10px] font-semibold uppercase text-[var(--text-tertiary)] mb-1", children: t }),
        /* @__PURE__ */ e("code", { className: "text-sm text-[var(--color-accent-600)]", children: i })
      ] }, t)) }),
      /* @__PURE__ */ e("div", { className: "mt-4", children: /* @__PURE__ */ e(d, { children: a("section2_note") }) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-2", children: [
        /* @__PURE__ */ e(l, { n: 4 }),
        a("section3_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-6", children: a("section3_description") }),
      /* @__PURE__ */ e("div", { className: "bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)] overflow-hidden", children: /* @__PURE__ */ r("div", { className: "p-4 space-y-4", children: [
        /* @__PURE__ */ e("div", { className: "grid grid-cols-3 gap-3", children: [
          { labelKey: "kpi_total", value: 5, icon: p, color: "text-[var(--dataviz-accent)]" },
          { labelKey: "kpi_active", value: 4, icon: x, color: "text-[var(--dataviz-trend-up)]" },
          { labelKey: "kpi_inactive", value: 1, icon: N, color: "text-[var(--dataviz-trend-down)]" }
        ].map(({ labelKey: t, value: i, icon: s, color: o }) => /* @__PURE__ */ r("div", { className: "p-3 bg-[var(--bg-secondary)] rounded-md flex items-center gap-3", children: [
          /* @__PURE__ */ e(s, { className: `w-5 h-5 flex-shrink-0 ${o}` }),
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("div", { className: `text-xl font-bold ${o}`, children: i }),
            /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-tertiary)]", children: a(t) })
          ] })
        ] }, t)) }),
        /* @__PURE__ */ e(d, { children: a("annot_kpis") }),
        /* @__PURE__ */ r("div", { className: "p-3 bg-[var(--bg-secondary)] rounded-md space-y-2", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2 flex-wrap", children: [
            /* @__PURE__ */ r("div", { className: "flex-1 min-w-[140px] flex items-center gap-2 rounded border border-[var(--border-color)] bg-[var(--bg-card)] px-3 py-1.5 text-xs text-[var(--text-tertiary)]", children: [
              /* @__PURE__ */ e(_, { className: "w-3.5 h-3.5 flex-shrink-0" }),
              /* @__PURE__ */ e("span", { children: "Rechercher..." })
            ] }),
            ["Application ▾", "Module ▾", "Statut ▾"].map((t) => /* @__PURE__ */ e("div", { className: "rounded border border-[var(--border-color)] bg-[var(--bg-card)] px-3 py-1.5 text-xs text-[var(--text-tertiary)] whitespace-nowrap", children: t }, t))
          ] }),
          /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-tertiary)]", children: "5 / 5 endpoints" })
        ] }),
        /* @__PURE__ */ e(d, { children: a("annot_toolbar") }),
        /* @__PURE__ */ e("div", { className: "rounded-md border border-[var(--border-color)] overflow-hidden overflow-x-auto", children: /* @__PURE__ */ r("table", { className: "w-full text-xs min-w-[700px]", children: [
          /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { className: "bg-[var(--bg-secondary)]", children: [a("col_application"), a("col_module"), a("col_name"), a("col_route"), a("col_entity"), a("col_rate"), a("col_pagesize"), a("col_status")].map((t) => /* @__PURE__ */ e("th", { className: "px-3 py-2 text-left font-semibold uppercase text-[var(--text-tertiary)] whitespace-nowrap tracking-wide", children: t }, t)) }) }),
          /* @__PURE__ */ e("tbody", { className: "divide-y divide-[var(--border-color)]", children: E.map((t) => /* @__PURE__ */ r("tr", { className: "hover:bg-[var(--bg-hover)] transition-colors cursor-pointer", children: [
            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e("span", { className: "inline-flex items-center rounded-full bg-[var(--info-bg)] px-2 py-0.5 text-[10px] font-medium text-[var(--info-text)] whitespace-nowrap", children: t.app }) }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 text-[var(--text-primary)] whitespace-nowrap", children: t.module }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-2 min-w-0", children: [
              /* @__PURE__ */ e(f, { className: "w-3.5 h-3.5 text-[var(--color-accent-600)] flex-shrink-0" }),
              /* @__PURE__ */ r("div", { className: "min-w-0", children: [
                /* @__PURE__ */ e("p", { className: "font-medium text-[var(--text-primary)] whitespace-nowrap", children: t.name }),
                /* @__PURE__ */ e("p", { className: "text-[var(--text-tertiary)] truncate max-w-[120px]", children: t.desc })
              ] })
            ] }) }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 font-mono text-[var(--text-secondary)] whitespace-nowrap", children: t.route }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 text-[var(--text-secondary)] whitespace-nowrap", children: t.entity }),
            /* @__PURE__ */ r("td", { className: "px-3 py-2 text-right text-[var(--text-secondary)] whitespace-nowrap", children: [
              t.rate,
              "/min"
            ] }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 text-right text-[var(--text-secondary)] whitespace-nowrap", children: t.pageSize ?? "—" }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 whitespace-nowrap", children: [
              /* @__PURE__ */ e("div", { className: `w-2 h-2 rounded-full flex-shrink-0 ${t.active ? "bg-[var(--success-dot)]" : "bg-[var(--warning-dot)]"}` }),
              /* @__PURE__ */ e("span", { className: t.active ? "text-[var(--success-text)]" : "text-[var(--warning-text)]", children: t.active ? a("status_active") : a("status_inactive") })
            ] }) })
          ] }, t.name)) })
        ] }) }),
        /* @__PURE__ */ e(d, { children: a("annot_table") }),
        /* @__PURE__ */ e(d, { children: a("annot_badge_app") }),
        /* @__PURE__ */ e(d, { children: a("annot_status") })
      ] }) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-2", children: [
        /* @__PURE__ */ e(l, { n: 5 }),
        a("section4_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-6", children: a("section4_description") }),
      /* @__PURE__ */ e("div", { className: "bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)] overflow-hidden", children: /* @__PURE__ */ r("div", { className: "p-4 space-y-4", children: [
        /* @__PURE__ */ r("div", { className: "flex items-center gap-3 flex-wrap", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5", children: [
            /* @__PURE__ */ e("div", { className: "h-2 w-2 rounded-full bg-[var(--warning-dot)]" }),
            /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[var(--warning-text)]", children: a("status_inactive") })
          ] }),
          /* @__PURE__ */ e("span", { className: "text-sm text-[var(--text-secondary)]", children: a("section4_nav_desc") })
        ] }),
        /* @__PURE__ */ e("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-2", children: [
          { icon: p, label: a("col_application"), value: "Administration" },
          { icon: w, label: a("col_module"), value: "Applications" },
          { icon: v, label: a("col_rate"), value: "120/min" },
          { icon: k, label: a("col_pagesize"), value: "—" }
        ].map(({ icon: t, label: i, value: s }) => /* @__PURE__ */ r("div", { className: "p-2 bg-[var(--bg-secondary)] rounded-md", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 text-[var(--text-tertiary)] mb-1", children: [
            /* @__PURE__ */ e(t, { className: "w-3.5 h-3.5 flex-shrink-0" }),
            /* @__PURE__ */ e("span", { className: "text-[10px] font-semibold uppercase", children: i })
          ] }),
          /* @__PURE__ */ e("span", { className: "text-xs font-medium text-[var(--text-primary)]", children: s })
        ] }, i)) }),
        /* @__PURE__ */ e(d, { children: a("annot_metadata") }),
        /* @__PURE__ */ r("div", { className: "rounded-md border border-[var(--border-color)] overflow-hidden", children: [
          /* @__PURE__ */ e("div", { className: "px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)] text-xs font-semibold text-[var(--text-primary)]", children: "Détails techniques" }),
          /* @__PURE__ */ r("div", { className: "p-4 grid grid-cols-1 md:grid-cols-2 gap-4 text-xs", children: [
            /* @__PURE__ */ r("div", { children: [
              /* @__PURE__ */ e("div", { className: "text-[var(--text-tertiary)] uppercase font-semibold mb-2", children: a("col_route") }),
              /* @__PURE__ */ e("code", { className: "rounded bg-[var(--bg-secondary)] px-2.5 py-1.5 text-[var(--color-accent-600)] font-mono", children: "GET /api/v1/export/navigation" }),
              /* @__PURE__ */ e("div", { className: "mt-2", children: /* @__PURE__ */ e(d, { children: a("annot_tech_route") }) })
            ] }),
            /* @__PURE__ */ r("div", { children: [
              /* @__PURE__ */ e("div", { className: "text-[var(--text-tertiary)] uppercase font-semibold mb-2", children: a("col_permission") }),
              /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
                /* @__PURE__ */ e(b, { className: "w-4 h-4 text-[var(--warning-text)] flex-shrink-0" }),
                /* @__PURE__ */ e("code", { className: "rounded bg-[var(--bg-secondary)] px-2.5 py-1.5 font-mono text-[var(--text-primary)]", children: "api.accounts.data.nav.read" })
              ] }),
              /* @__PURE__ */ e("div", { className: "mt-2", children: /* @__PURE__ */ e(d, { children: a("annot_tech_permission") }) })
            ] })
          ] })
        ] }),
        /* @__PURE__ */ r("div", { className: "rounded-md border border-[var(--border-color)] overflow-hidden", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)]", children: [
            /* @__PURE__ */ e(A, { className: "w-4 h-4 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ e("span", { className: "text-xs font-semibold text-[var(--text-primary)]", children: "Exemple cURL" }),
            /* @__PURE__ */ e("div", { className: "ml-auto cursor-pointer text-[var(--text-tertiary)] hover:text-[var(--text-primary)] transition-colors", children: /* @__PURE__ */ e(K, { className: "w-3.5 h-3.5" }) })
          ] }),
          /* @__PURE__ */ e("div", { className: "p-4 bg-[var(--bg-card)]", children: /* @__PURE__ */ e("pre", { className: "text-xs font-mono text-[var(--text-primary)] whitespace-pre-wrap overflow-x-auto leading-relaxed", children: `curl -X GET "https://your-api.smartstack.app/api/v1/export/navigation" \\
  -H "Authorization: Bearer <API_KEY>" \\
  -H "Accept: application/json"` }) })
        ] }),
        /* @__PURE__ */ e(d, { children: a("annot_curl") }),
        /* @__PURE__ */ r("div", { className: "rounded-md border border-[var(--border-color)] overflow-hidden overflow-x-auto", children: [
          /* @__PURE__ */ e("div", { className: "flex items-center justify-between px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)]", children: /* @__PURE__ */ e("span", { className: "text-xs font-semibold text-[var(--text-primary)]", children: "Schéma de réponse — NavigationApplication" }) }),
          /* @__PURE__ */ r("table", { className: "w-full text-xs min-w-[400px]", children: [
            /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { className: "bg-[var(--bg-secondary)]", children: ["Champ", "Type", "?", "Description"].map((t) => /* @__PURE__ */ e("th", { className: "px-3 py-2 text-left font-semibold text-[var(--text-tertiary)] uppercase tracking-wide", children: t }, t)) }) }),
            /* @__PURE__ */ e("tbody", { className: "divide-y divide-[var(--border-color)]", children: R.map((t) => /* @__PURE__ */ r("tr", { className: "hover:bg-[var(--bg-hover)] transition-colors", children: [
              /* @__PURE__ */ e("td", { className: "px-3 py-1.5", children: /* @__PURE__ */ e("code", { className: "text-[var(--color-accent-600)]", children: t.name }) }),
              /* @__PURE__ */ e("td", { className: "px-3 py-1.5", children: /* @__PURE__ */ e("code", { className: "rounded bg-[var(--bg-secondary)] px-1.5 py-0.5 text-[var(--text-secondary)]", children: t.type }) }),
              /* @__PURE__ */ e("td", { className: "px-3 py-1.5 text-[var(--text-tertiary)]", children: t.nullable ? "?" : "—" }),
              /* @__PURE__ */ e("td", { className: "px-3 py-1.5 text-[var(--text-secondary)]", children: t.desc })
            ] }, t.name)) })
          ] })
        ] }),
        /* @__PURE__ */ e(d, { children: a("annot_schema") }),
        /* @__PURE__ */ r("div", { className: "rounded-md border border-[var(--border-color)] overflow-hidden", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2 px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)]", children: [
            /* @__PURE__ */ e(C, { className: "w-4 h-4 text-[var(--color-accent-600)]" }),
            /* @__PURE__ */ e("span", { className: "text-xs font-semibold text-[var(--text-primary)]", children: "Prompt IA dédié" })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-4 bg-[var(--bg-card)] text-xs text-[var(--text-tertiary)]", children: [
            "Prompt d'intégration auto-généré — créez un skill IA avec le code",
            " ",
            /* @__PURE__ */ e("code", { className: "rounded bg-[var(--bg-secondary)] px-1.5 py-0.5 text-[var(--color-accent-600)]", children: "data-export-navigation" }),
            " ",
            "pour le personnaliser."
          ] })
        ] }),
        /* @__PURE__ */ e(d, { children: a("annot_prompt") })
      ] }) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-2", children: [
        /* @__PURE__ */ e(l, { n: 6 }),
        a("section5_title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-6", children: a("section5_description") }),
      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
        { icon: b, titleKey: "auth_step1_title", bodyKey: "auth_step1_body" },
        { icon: v, titleKey: "auth_step2_title", bodyKey: "auth_step2_body" },
        { icon: x, titleKey: "auth_step3_title", bodyKey: "auth_step3_body" }
      ].map(({ icon: t, titleKey: i, bodyKey: s }) => /* @__PURE__ */ r("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-[var(--radius-card)] border border-[var(--border-color)]", children: [
        /* @__PURE__ */ e(t, { className: "w-5 h-5 text-[var(--color-accent-600)] mb-3" }),
        /* @__PURE__ */ e("h4", { className: "font-semibold text-sm text-[var(--text-primary)] mb-1.5", children: a(i) }),
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)] leading-relaxed", children: a(s) })
      ] }, i)) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-6", children: [
        /* @__PURE__ */ e(l, { n: 7 }),
        a("section6_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-3", children: [
        { personaKey: "usecase1_persona", descKey: "usecase1_description" },
        { personaKey: "usecase2_persona", descKey: "usecase2_description" },
        { personaKey: "usecase3_persona", descKey: "usecase3_description" }
      ].map(({ personaKey: t, descKey: i }) => {
        const s = a(t);
        return /* @__PURE__ */ r("div", { className: "flex gap-4 p-4 bg-[var(--bg-secondary)] rounded-md", children: [
          /* @__PURE__ */ e("div", { className: "flex-shrink-0 w-8 h-8 rounded-full bg-[var(--color-accent-500)]/15 flex items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-[var(--color-accent-600)] font-semibold text-xs", children: s[0] }) }),
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ e("div", { className: "font-semibold text-sm text-[var(--text-primary)] mb-1", children: s }),
            /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)] leading-relaxed", children: a(i) })
          ] })
        ] }, t);
      }) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-6", children: [
        /* @__PURE__ */ e(l, { n: 8 }),
        a("section7_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
        { titleKey: "feature1_title", bodyKey: "feature1_body" },
        { titleKey: "feature2_title", bodyKey: "feature2_body" },
        { titleKey: "feature3_title", bodyKey: "feature3_body" },
        { titleKey: "feature4_title", bodyKey: "feature4_body" },
        { titleKey: "feature5_title", bodyKey: "feature5_body" }
      ].map(({ titleKey: t, bodyKey: i }) => /* @__PURE__ */ r("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-md border-l-2 border-[var(--color-accent-500)]", children: [
        /* @__PURE__ */ e("div", { className: "font-semibold text-sm text-[var(--text-primary)] mb-1.5", children: a(t) }),
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)] leading-relaxed", children: a(i) })
      ] }, t)) })
    ] }),
    /* @__PURE__ */ r("div", { className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)] rounded-[var(--radius-card)]", children: [
      /* @__PURE__ */ r("h2", { className: "flex items-center gap-3 text-xl font-semibold mb-6", children: [
        /* @__PURE__ */ e(l, { n: 9 }),
        a("section8_title")
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-3", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ r("details", { className: "group border border-[var(--border-color)] rounded-md overflow-hidden", children: [
        /* @__PURE__ */ r("summary", { className: "flex items-center justify-between px-4 py-3 bg-[var(--bg-secondary)] cursor-pointer select-none text-sm font-medium text-[var(--text-primary)] list-none", children: [
          a(`faq${t}_q`),
          /* @__PURE__ */ e(h, { className: "w-4 h-4 text-[var(--text-tertiary)] flex-shrink-0 transition-transform group-open:rotate-90" })
        ] }),
        /* @__PURE__ */ e("div", { className: "px-4 py-3 text-sm text-[var(--text-secondary)] bg-[var(--bg-card)] leading-relaxed", children: a(`faq${t}_a`) })
      ] }, t)) })
    ] }),
    /* @__PURE__ */ e(j, { title: a("section9_title"), children: /* @__PURE__ */ r("div", { className: "space-y-6", children: [
      /* @__PURE__ */ r("div", { children: [
        /* @__PURE__ */ e("h3", { className: "font-semibold text-sm text-[var(--text-primary)] mb-3 uppercase tracking-wide", children: a("section9_api_title") }),
        /* @__PURE__ */ e("div", { className: "overflow-x-auto rounded-md border border-[var(--border-color)]", children: /* @__PURE__ */ r("table", { className: "w-full text-xs min-w-[600px]", children: [
          /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { className: "bg-[var(--bg-secondary)]", children: [a("col_method"), a("col_route"), a("col_permission"), a("col_description")].map((t) => /* @__PURE__ */ e("th", { className: "px-3 py-2 text-left font-semibold text-[var(--text-tertiary)] uppercase tracking-wide whitespace-nowrap", children: t }, t)) }) }),
          /* @__PURE__ */ e("tbody", { className: "divide-y divide-[var(--border-color)]", children: n.map(({ method: t, path: i, perm: s, label: o }) => /* @__PURE__ */ r("tr", { className: "hover:bg-[var(--bg-hover)] transition-colors", children: [
            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e("span", { className: `inline-flex rounded px-2 py-0.5 text-[10px] font-semibold font-mono ${t === "GET" ? "bg-[var(--info-bg)] text-[var(--info-text)]" : "bg-[var(--warning-bg)] text-[var(--warning-text)]"}`, children: t }) }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 font-mono text-[var(--color-accent-600)] whitespace-nowrap", children: i }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 font-mono text-[var(--text-secondary)] whitespace-nowrap", children: s }),
            /* @__PURE__ */ e("td", { className: "px-3 py-2 text-[var(--text-secondary)]", children: o })
          ] }, i)) })
        ] }) })
      ] }),
      /* @__PURE__ */ r("div", { children: [
        /* @__PURE__ */ e("h3", { className: "font-semibold text-sm text-[var(--text-primary)] mb-3 uppercase tracking-wide", children: a("section9_br_title") }),
        /* @__PURE__ */ e("div", { className: "space-y-2", children: c.map(({ id: t, title: i, body: s }) => /* @__PURE__ */ r("div", { className: "flex gap-3 p-3 bg-[var(--bg-secondary)] rounded-md text-xs", children: [
          /* @__PURE__ */ e("span", { className: "inline-flex items-center rounded-full bg-[var(--color-accent-500)]/15 px-2 py-0.5 text-[var(--color-accent-600)] font-medium shrink-0 self-start mt-0.5", children: t }),
          /* @__PURE__ */ r("div", { className: "min-w-0", children: [
            /* @__PURE__ */ e("div", { className: "font-medium text-[var(--text-primary)] mb-0.5", children: i }),
            /* @__PURE__ */ e("div", { className: "text-[var(--text-secondary)] leading-relaxed", children: s })
          ] })
        ] }, t)) })
      ] })
    ] }) }),
    /* @__PURE__ */ r("div", { className: "flex justify-between pt-6 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ r(
        m,
        {
          to: "/system/docs/user",
          className: "flex items-center gap-2 text-sm text-[var(--text-secondary)] hover:text-[var(--color-accent-600)] transition-colors",
          children: [
            /* @__PURE__ */ e(S, { className: "w-4 h-4" }),
            a("navBack")
          ]
        }
      ),
      /* @__PURE__ */ r(
        m,
        {
          to: "/api/accounts/catalog",
          className: "flex items-center gap-2 text-sm text-[var(--color-accent-600)] hover:underline",
          children: [
            "Ouvrir le catalogue",
            /* @__PURE__ */ e(z, { className: "w-4 h-4" })
          ]
        }
      )
    ] })
  ] });
}
export {
  D as default
};
//# sourceMappingURL=index-BdpogUgD.js.map
