import { jsxs as r, jsx as e } from "react/jsx-runtime";
import { useState as A } from "react";
import { Link as c } from "react-router-dom";
import { useTranslation as T } from "react-i18next";
import { ArrowLeft as p, Users as m, Target as U, Lightbulb as G, ChevronRight as o, RefreshCw as j, UserCheck as v, UserX as D, UserPlus as E, Activity as u, AlertTriangle as g, Key as L, Shield as I, Monitor as f, Globe as $, TrendingUp as B, Clock as M, Zap as P, HelpCircle as F, Code2 as q, ArrowRight as H, Info as O } from "lucide-react";
const l = {
  totalUsers: 248,
  activeUsers: 211,
  inactiveUsers: 37,
  newUsers: 18,
  totalSessions: 1342,
  failedLogins: 7,
  totalRoles: 6,
  totalPermissions: 42,
  usersLoggedInRecently: 94
}, N = [
  { status: "Active", count: 211 },
  { status: "Inactive", count: 37 }
], y = [
  { roleName: "Administrator", count: 12 },
  { roleName: "Support Agent", count: 78 },
  { roleName: "Manager", count: 31 },
  { roleName: "Viewer", count: 90 },
  { roleName: "Developer", count: 37 }
], w = [
  { userId: "1", fullName: "Thomas Müller", email: "thomas.muller@example.com", failedAttempts: 8, ipAddresses: ["192.168.1.1", "10.0.0.5", "172.16.0.2"] },
  { userId: "2", fullName: "Sarah Connor", email: "sarah.c@example.com", failedAttempts: 5, ipAddresses: ["203.0.113.42"] }
], V = [
  { userId: "3", fullName: "Alice Martin", duration: "2h 14m" },
  { userId: "4", fullName: "Jean Dupont", duration: "47m" },
  { userId: "5", fullName: "Maria Rossi", duration: "1h 32m" },
  { userId: "6", fullName: "Hans Scherer", duration: "23m" },
  { userId: "7", fullName: "Emma Wilson", duration: "3h 05m" }
], h = {
  totalActiveSessions: 23,
  byBrowser: [
    { browser: "Chrome", count: 14 },
    { browser: "Firefox", count: 5 },
    { browser: "Edge", count: 3 },
    { browser: "Safari", count: 1 }
  ],
  byCountry: [
    { country: "Switzerland", count: 11 },
    { country: "France", count: 7 },
    { country: "Germany", count: 4 },
    { country: "Italy", count: 1 }
  ]
}, n = Array.from({ length: 14 }, (t, i) => ({
  date: new Date(Date.now() - (13 - i) * 864e5).toISOString(),
  newUsers: Math.floor(Math.random() * 5),
  logins: Math.floor(Math.random() * 40 + 20)
})), X = [
  { label: "Desktop", value: 67, color: "#3b82f6" },
  { label: "Mobile", value: 24, color: "#22c55e" },
  { label: "Tablet", value: 9, color: "#f59e0b" }
], z = [
  { method: "GET", path: "/api/administration/users/dashboard/overview", handler: "GetOverview", permission: "administration.users.read", params: "?days=30" },
  { method: "GET", path: "/api/administration/users/dashboard/by-status", handler: "GetByStatus", permission: "administration.users.read", params: "" },
  { method: "GET", path: "/api/administration/users/dashboard/by-role", handler: "GetByRole", permission: "administration.users.read", params: "" },
  { method: "GET", path: "/api/administration/users/dashboard/by-type", handler: "GetByType", permission: "administration.users.read", params: "" },
  { method: "GET", path: "/api/administration/users/dashboard/login-activity", handler: "GetLoginActivity", permission: "administration.users.read", params: "?days=30" },
  { method: "GET", path: "/api/administration/users/dashboard/trends", handler: "GetTrends", permission: "administration.users.read", params: "?days=30" },
  { method: "GET", path: "/api/administration/users/dashboard/recent-users", handler: "GetRecentUsers", permission: "administration.users.read", params: "?limit=10" },
  { method: "GET", path: "/api/administration/users/dashboard/security-alerts", handler: "GetSecurityAlerts", permission: "administration.users.read", params: "?threshold=3&hours=24" },
  { method: "GET", path: "/api/administration/users/dashboard/active-sessions", handler: "GetActiveSessionsStats", permission: "administration.users.read", params: "" },
  { method: "GET", path: "/api/administration/users/dashboard/latest-active-sessions", handler: "GetLatestActiveSessions", permission: "administration.users.read", params: "?limit=5" }
], J = [
  { id: "BR-001", category: "Sécurité", key: "techRef.rules.br001" },
  { id: "BR-002", category: "UI / UX", key: "techRef.rules.br002" },
  { id: "BR-003", category: "Période", key: "techRef.rules.br003" },
  { id: "BR-004", category: "Navigation", key: "techRef.rules.br004" },
  { id: "BR-005", category: "Performance", key: "techRef.rules.br005" },
  { id: "BR-006", category: "Accès", key: "techRef.rules.br006" }
], K = {
  GET: "bg-blue-500/10 text-blue-700 border-blue-500/20",
  POST: "bg-green-500/10 text-green-700 border-green-500/20",
  PUT: "bg-orange-500/10 text-orange-700 border-orange-500/20",
  DELETE: "bg-red-500/10 text-red-700 border-red-500/20"
}, W = {
  Active: "#22c55e",
  Inactive: "#ef4444"
}, k = ["#3b82f6", "#8b5cf6", "#22c55e", "#f59e0b", "#ef4444"];
function s({ children: t }) {
  return /* @__PURE__ */ r("div", { className: "mt-3 flex items-start gap-2 px-3 py-2 rounded-md bg-blue-50 border border-blue-200 text-xs text-blue-800 dark:bg-blue-950/30 dark:border-blue-800 dark:text-blue-300", children: [
    /* @__PURE__ */ e(O, { className: "h-3.5 w-3.5 flex-shrink-0 mt-0.5" }),
    /* @__PURE__ */ e("span", { children: t })
  ] });
}
function re() {
  const { t } = T("docsAdministrationUsersDashboard"), [i, S] = A(!1), x = N.reduce((a, d) => a + d.count, 0), R = Math.max(...y.map((a) => a.count), 1), b = Math.max(...n.flatMap((a) => [a.newUsers, a.logins]), 1);
  return /* @__PURE__ */ r("div", { className: "space-y-8 max-w-5xl mx-auto px-4 py-6", children: [
    /* @__PURE__ */ r(
      c,
      {
        to: "/docs/business/administration/users",
        className: "inline-flex items-center gap-1.5 text-sm text-[var(--color-accent-500)] hover:text-[var(--color-accent-600)] transition-colors",
        children: [
          /* @__PURE__ */ e(p, { className: "h-4 w-4" }),
          t("nav.backToAdmin")
        ]
      }
    ),
    /* @__PURE__ */ r("div", { children: [
      /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-3", children: [
        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-[var(--color-primary-600)]/10", children: /* @__PURE__ */ e(m, { className: "h-6 w-6 text-[var(--color-primary-600)]" }) }),
        /* @__PURE__ */ r("div", { children: [
          /* @__PURE__ */ e("h1", { className: "text-2xl font-bold text-[var(--text-primary)]", children: t("title") }),
          /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-0.5", children: t("subtitle") })
        ] })
      ] }),
      /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-3 text-sm text-[var(--text-secondary)]", children: [
        /* @__PURE__ */ r("span", { children: [
          "6 ",
          t("header.businessRules")
        ] }),
        /* @__PURE__ */ e("span", { children: "·" }),
        /* @__PURE__ */ r("span", { children: [
          "10 ",
          t("header.apiEndpoints")
        ] }),
        /* @__PURE__ */ e("span", { children: "·" }),
        /* @__PURE__ */ r("span", { children: [
          "5 ",
          t("header.statuses")
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-3 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "1" }),
        t("sections.businessValue")
      ] }),
      /* @__PURE__ */ r("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
        /* @__PURE__ */ r("div", { className: "p-4 rounded-lg bg-red-50 border border-red-200 dark:bg-red-950/20 dark:border-red-800", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-2", children: [
            /* @__PURE__ */ e(U, { className: "h-4 w-4 text-red-600" }),
            /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-red-800 dark:text-red-300", children: t("value.problemTitle") })
          ] }),
          /* @__PURE__ */ e("p", { className: "text-xs text-red-700 dark:text-red-400", children: t("value.problem") })
        ] }),
        /* @__PURE__ */ r("div", { className: "p-4 rounded-lg bg-green-50 border border-green-200 dark:bg-green-950/20 dark:border-green-800", children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-2", children: [
            /* @__PURE__ */ e(G, { className: "h-4 w-4 text-green-600" }),
            /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-green-800 dark:text-green-300", children: t("value.solutionTitle") })
          ] }),
          /* @__PURE__ */ e("p", { className: "text-xs text-green-700 dark:text-green-400", children: t("value.solution") })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-3 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "2" }),
        t("sections.access")
      ] }),
      /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-4 bg-[var(--bg-card)] space-y-3", children: [
        /* @__PURE__ */ r("div", { children: [
          /* @__PURE__ */ e("div", { className: "text-xs font-medium text-[var(--text-secondary)] mb-2", children: t("access.navigation") }),
          /* @__PURE__ */ r("div", { className: "flex flex-wrap items-center gap-2 text-sm", children: [
            /* @__PURE__ */ e("span", { className: "px-2 py-0.5 rounded bg-purple-500/10 text-purple-700 font-medium", children: "Platform" }),
            /* @__PURE__ */ e(o, { className: "h-3.5 w-3.5 text-[var(--text-muted)]" }),
            /* @__PURE__ */ e("span", { className: "px-2 py-0.5 rounded bg-blue-500/10 text-blue-700 font-medium", children: "Administration" }),
            /* @__PURE__ */ e(o, { className: "h-3.5 w-3.5 text-[var(--text-muted)]" }),
            /* @__PURE__ */ e("span", { className: "px-2 py-0.5 rounded bg-green-500/10 text-green-700 font-medium", children: "Users" }),
            /* @__PURE__ */ e(o, { className: "h-3.5 w-3.5 text-[var(--text-muted)]" }),
            /* @__PURE__ */ e("span", { className: "px-2 py-0.5 rounded bg-[var(--color-primary-600)]/10 text-[var(--color-primary-700)] font-medium", children: t("access.module") })
          ] })
        ] }),
        /* @__PURE__ */ r("div", { className: "flex flex-wrap gap-3 text-xs", children: [
          /* @__PURE__ */ e("div", { className: "px-3 py-1.5 rounded-full bg-[var(--bg-secondary)] border border-[var(--border-color)] font-mono text-[var(--text-secondary)]", children: "/administration/users/dashboard" }),
          /* @__PURE__ */ e("div", { className: "px-3 py-1.5 rounded-full bg-blue-500/10 border border-blue-500/20 text-blue-700 font-mono", children: "administration.users.read" })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-3 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "3" }),
        t("sections.dashboard")
      ] }),
      /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg overflow-hidden bg-[var(--bg-card)] shadow-sm", children: [
        /* @__PURE__ */ r("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-[var(--bg-secondary)] flex items-center justify-between", children: [
          /* @__PURE__ */ r("div", { children: [
            /* @__PURE__ */ r("h3", { className: "text-sm font-bold flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(m, { className: "h-4 w-4" }),
              t("dashboard.pageTitle")
            ] }),
            /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)] mt-0.5", children: t("dashboard.pageSubtitle") })
          ] }),
          /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
            /* @__PURE__ */ r("select", { className: "px-2 py-1 text-xs border border-[var(--border-color)] bg-[var(--bg-primary)] rounded-lg text-[var(--text-secondary)]", children: [
              /* @__PURE__ */ e("option", { children: t("dashboard.days7") }),
              /* @__PURE__ */ e("option", { selected: !0, children: t("dashboard.days30") }),
              /* @__PURE__ */ e("option", { children: t("dashboard.days90") })
            ] }),
            /* @__PURE__ */ r("button", { className: "flex items-center gap-1 px-2.5 py-1 text-xs border border-[var(--border-color)] bg-[var(--bg-primary)] rounded-lg text-[var(--text-secondary)]", children: [
              /* @__PURE__ */ e(j, { className: "w-3 h-3" }),
              t("dashboard.refresh")
            ] })
          ] })
        ] }),
        /* @__PURE__ */ e("div", { className: "p-4", children: /* @__PURE__ */ r("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-3", children: [
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--info-bg)] border-[var(--info-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--info-text)] opacity-80", children: t("dashboard.kpi.totalUsers") }),
              /* @__PURE__ */ e(m, { className: "h-4 w-4 text-[var(--info-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--info-text)]", children: l.totalUsers })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--success-bg)] border-[var(--success-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--success-text)] opacity-80", children: t("dashboard.kpi.active") }),
              /* @__PURE__ */ e(v, { className: "h-4 w-4 text-[var(--success-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--success-text)]", children: l.activeUsers })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--error-bg)] border-[var(--error-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--error-text)] opacity-80", children: t("dashboard.kpi.inactive") }),
              /* @__PURE__ */ e(D, { className: "h-4 w-4 text-[var(--error-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--error-text)]", children: l.inactiveUsers })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--info-bg)] border-[var(--info-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--info-text)] opacity-80", children: t("dashboard.kpi.newUsers") }),
              /* @__PURE__ */ e(E, { className: "h-4 w-4 text-[var(--info-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--info-text)]", children: l.newUsers }),
            /* @__PURE__ */ e("div", { className: "text-xs text-[var(--info-text)] opacity-60 mt-0.5", children: t("dashboard.kpiPeriod") })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--success-bg)] border-[var(--success-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--success-text)] opacity-80", children: t("dashboard.kpi.sessions") }),
              /* @__PURE__ */ e(u, { className: "h-4 w-4 text-[var(--success-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--success-text)]", children: l.totalSessions.toLocaleString() }),
            /* @__PURE__ */ e("div", { className: "text-xs text-[var(--success-text)] opacity-60 mt-0.5", children: t("dashboard.kpiPeriod") })
          ] }),
          /* @__PURE__ */ r("div", { className: "p-3 rounded-lg border bg-[var(--warning-bg)] border-[var(--warning-border)]", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-1", children: [
              /* @__PURE__ */ e("span", { className: "text-xs text-[var(--warning-text)] opacity-80", children: t("dashboard.kpi.failedLogins") }),
              /* @__PURE__ */ e(g, { className: "h-4 w-4 text-[var(--warning-text)]" })
            ] }),
            /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-[var(--warning-text)]", children: l.failedLogins }),
            /* @__PURE__ */ e("div", { className: "text-xs text-[var(--warning-text)] opacity-60 mt-0.5", children: t("dashboard.kpiPeriod") })
          ] })
        ] }) }),
        /* @__PURE__ */ e("div", { className: "px-4 pb-4", children: /* @__PURE__ */ r("div", { className: "p-3 border-l-4 border-red-500 bg-red-50 dark:bg-red-900/20 rounded-lg", children: [
          /* @__PURE__ */ r("h4", { className: "font-semibold text-red-600 flex items-center gap-2 mb-2 text-sm", children: [
            /* @__PURE__ */ e(g, { className: "w-4 h-4" }),
            t("dashboard.securityAlerts.title"),
            " (",
            w.length,
            ")"
          ] }),
          /* @__PURE__ */ e("div", { className: "space-y-2", children: w.map((a) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between p-2 bg-red-50/80 dark:bg-red-900/30 rounded border border-red-200/50 cursor-pointer", children: [
            /* @__PURE__ */ r("div", { children: [
              /* @__PURE__ */ e("span", { className: "text-xs font-medium text-[var(--text-primary)]", children: a.fullName }),
              /* @__PURE__ */ e("span", { className: "ml-2 text-xs text-[var(--text-secondary)]", children: a.email })
            ] }),
            /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
              /* @__PURE__ */ r("span", { className: "text-xs text-red-600 font-medium", children: [
                a.failedAttempts,
                " ",
                t("dashboard.securityAlerts.failedAttempts")
              ] }),
              /* @__PURE__ */ r("span", { className: "text-xs text-[var(--text-secondary)]", children: [
                a.ipAddresses.length,
                " ",
                t("dashboard.securityAlerts.ips")
              ] })
            ] })
          ] }, a.userId)) })
        ] }) }),
        /* @__PURE__ */ r("div", { className: "px-4 pb-4 grid grid-cols-1 lg:grid-cols-2 gap-4", children: [
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(v, { className: "h-4 w-4" }),
              t("dashboard.statusChart.title")
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: N.map((a) => {
              const d = x > 0 ? a.count / x * 100 : 0;
              return /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
                /* @__PURE__ */ e("div", { className: "w-20 text-xs text-[var(--text-secondary)]", children: a.status === "Active" ? t("dashboard.statusChart.active") : t("dashboard.statusChart.inactive") }),
                /* @__PURE__ */ e("div", { className: "flex-1 h-5 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
                  "div",
                  {
                    className: "h-full rounded-full",
                    style: { width: `${d}%`, backgroundColor: W[a.status] }
                  }
                ) }),
                /* @__PURE__ */ r("div", { className: "w-16 text-right text-xs", children: [
                  /* @__PURE__ */ e("span", { className: "font-medium text-[var(--text-primary)]", children: a.count }),
                  /* @__PURE__ */ r("span", { className: "text-[var(--text-muted)] ml-1", children: [
                    "(",
                    d.toFixed(0),
                    "%)"
                  ] })
                ] })
              ] }, a.status);
            }) })
          ] }),
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(L, { className: "h-4 w-4" }),
              t("dashboard.roleChart.title")
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: y.map((a, d) => {
              const C = a.count / R * 100;
              return /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
                /* @__PURE__ */ e("div", { className: "w-24 text-xs text-[var(--text-secondary)] truncate", children: a.roleName }),
                /* @__PURE__ */ e("div", { className: "flex-1 h-5 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
                  "div",
                  {
                    className: "h-full rounded-full",
                    style: { width: `${C}%`, backgroundColor: k[d % k.length] }
                  }
                ) }),
                /* @__PURE__ */ e("div", { className: "w-8 text-right text-xs font-medium text-[var(--text-primary)]", children: a.count })
              ] }, a.roleName);
            }) })
          ] })
        ] }),
        /* @__PURE__ */ r("div", { className: "px-4 pb-4 grid grid-cols-1 lg:grid-cols-2 gap-4", children: [
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(I, { className: "h-4 w-4" }),
              t("dashboard.systemConfig.title")
            ] }),
            /* @__PURE__ */ r("div", { className: "grid grid-cols-2 gap-3", children: [
              /* @__PURE__ */ r("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-purple-600", children: l.totalRoles }),
                /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: t("dashboard.systemConfig.roles") })
              ] }),
              /* @__PURE__ */ r("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-green-600", children: l.totalPermissions }),
                /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: t("dashboard.systemConfig.permissions") })
              ] }),
              /* @__PURE__ */ r("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-blue-600", children: l.usersLoggedInRecently }),
                /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: t("dashboard.systemConfig.recentLogins") })
              ] }),
              /* @__PURE__ */ r("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-orange-600", children: h.totalActiveSessions }),
                /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: t("dashboard.systemConfig.activeSessions") })
              ] })
            ] })
          ] }),
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(f, { className: "h-4 w-4" }),
              t("dashboard.activeSessions.title")
            ] }),
            /* @__PURE__ */ r("div", { className: "grid grid-cols-2 gap-4", children: [
              /* @__PURE__ */ r("div", { children: [
                /* @__PURE__ */ e("h5", { className: "text-xs font-medium text-[var(--text-secondary)] mb-2", children: t("dashboard.activeSessions.byBrowser") }),
                /* @__PURE__ */ e("div", { className: "space-y-1.5", children: h.byBrowser.map((a) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between text-xs", children: [
                  /* @__PURE__ */ e("span", { className: "text-[var(--text-primary)]", children: a.browser }),
                  /* @__PURE__ */ e("span", { className: "font-medium text-[var(--text-primary)]", children: a.count })
                ] }, a.browser)) })
              ] }),
              /* @__PURE__ */ r("div", { children: [
                /* @__PURE__ */ r("h5", { className: "text-xs font-medium text-[var(--text-secondary)] mb-2 flex items-center gap-1", children: [
                  /* @__PURE__ */ e($, { className: "w-3 h-3" }),
                  t("dashboard.activeSessions.byCountry")
                ] }),
                /* @__PURE__ */ e("div", { className: "space-y-1.5", children: h.byCountry.map((a) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between text-xs", children: [
                  /* @__PURE__ */ e("span", { className: "text-[var(--text-primary)]", children: a.country }),
                  /* @__PURE__ */ e("span", { className: "font-medium text-[var(--text-primary)]", children: a.count })
                ] }, a.country)) })
              ] })
            ] })
          ] })
        ] }),
        /* @__PURE__ */ r("div", { className: "px-4 pb-4 grid grid-cols-1 lg:grid-cols-2 gap-4", children: [
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(f, { className: "h-4 w-4" }),
              t("dashboard.device.title")
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: X.map((a) => /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
              /* @__PURE__ */ e("div", { className: "w-14 text-xs text-[var(--text-secondary)]", children: a.label }),
              /* @__PURE__ */ e("div", { className: "flex-1 h-5 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e("div", { className: "h-full rounded-full", style: { width: `${a.value}%`, backgroundColor: a.color } }) }),
              /* @__PURE__ */ r("div", { className: "w-8 text-right text-xs font-medium text-[var(--text-primary)]", children: [
                a.value,
                "%"
              ] })
            ] }, a.label)) })
          ] }),
          /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
            /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
              /* @__PURE__ */ e(u, { className: "h-4 w-4" }),
              t("dashboard.engagement.title")
            ] }),
            /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-3", children: [
              { label: "Durée moy.", value: "18m 32s", color: "text-blue-600" },
              { label: "Rétention", value: "73%", color: "text-green-600" },
              { label: "Fréquence", value: "4.2×/sem", color: "text-purple-600" },
              { label: "Rebond", value: "12%", color: "text-orange-600" }
            ].map((a) => /* @__PURE__ */ r("div", { className: "text-center p-2 bg-[var(--bg-secondary)] rounded-lg", children: [
              /* @__PURE__ */ e("div", { className: `text-lg font-bold ${a.color}`, children: a.value }),
              /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: a.label })
            ] }, a.label)) })
          ] })
        ] }),
        /* @__PURE__ */ e("div", { className: "px-4 pb-4", children: /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-3", children: [
          /* @__PURE__ */ r("h4", { className: "text-sm font-semibold mb-3 flex items-center gap-2 text-[var(--text-primary)]", children: [
            /* @__PURE__ */ e(B, { className: "h-4 w-4" }),
            t("dashboard.trends.title"),
            " (",
            t("dashboard.trends.period"),
            ")"
          ] }),
          /* @__PURE__ */ r("div", { className: "flex items-center gap-4 mb-3", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 text-xs", children: [
              /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-blue-500" }),
              /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: t("dashboard.trends.newUsers") })
            ] }),
            /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 text-xs", children: [
              /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-green-500" }),
              /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: t("dashboard.trends.logins") })
            ] })
          ] }),
          /* @__PURE__ */ e("div", { className: "h-24 flex items-end gap-0.5", children: n.map((a, d) => /* @__PURE__ */ r("div", { className: "flex-1 min-w-[8px] flex gap-px", children: [
            /* @__PURE__ */ e(
              "div",
              {
                className: "flex-1 bg-blue-500 rounded-t opacity-80",
                style: { height: `${a.newUsers / b * 100}%`, minHeight: a.newUsers > 0 ? "3px" : "0" }
              }
            ),
            /* @__PURE__ */ e(
              "div",
              {
                className: "flex-1 bg-green-500 rounded-t opacity-80",
                style: { height: `${a.logins / b * 100}%`, minHeight: "3px" }
              }
            )
          ] }, d)) }),
          /* @__PURE__ */ r("div", { className: "flex justify-between text-xs text-[var(--text-muted)] mt-1", children: [
            /* @__PURE__ */ e("span", { children: new Date(n[0].date).toLocaleDateString("fr-FR") }),
            /* @__PURE__ */ e("span", { children: new Date(n[n.length - 1].date).toLocaleDateString("fr-FR") })
          ] })
        ] }) }),
        /* @__PURE__ */ e("div", { className: "px-4 pb-4", children: /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg overflow-hidden", children: [
          /* @__PURE__ */ r("div", { className: "px-3 py-2.5 border-b border-[var(--border-color)] bg-[var(--bg-secondary)] flex items-center gap-2", children: [
            /* @__PURE__ */ e(M, { className: "h-4 w-4 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("h4", { className: "text-sm font-semibold text-[var(--text-primary)]", children: t("dashboard.latestSessions.title") })
          ] }),
          /* @__PURE__ */ r("table", { className: "w-full text-xs", children: [
            /* @__PURE__ */ e("thead", { className: "bg-[var(--bg-secondary)]", children: /* @__PURE__ */ r("tr", { children: [
              /* @__PURE__ */ e("th", { className: "text-left px-3 py-2 font-medium text-[var(--text-muted)]", children: t("dashboard.latestSessions.user") }),
              /* @__PURE__ */ e("th", { className: "text-right px-3 py-2 font-medium text-[var(--text-muted)]", children: t("dashboard.latestSessions.duration") })
            ] }) }),
            /* @__PURE__ */ e("tbody", { className: "divide-y divide-[var(--border-color)]", children: V.map((a) => /* @__PURE__ */ r("tr", { className: "hover:bg-[var(--bg-secondary)] cursor-pointer transition-colors", children: [
              /* @__PURE__ */ e("td", { className: "px-3 py-2 font-medium text-[var(--text-primary)]", children: a.fullName }),
              /* @__PURE__ */ e("td", { className: "px-3 py-2 text-right", children: /* @__PURE__ */ e("span", { className: "px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400", children: a.duration }) })
            ] }, a.userId)) })
          ] })
        ] }) })
      ] }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.header") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.kpis") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.securityAlerts") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.statusChart") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.roleChart") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.systemConfig") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.activeSessions") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.device") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.engagement") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.trends") }),
      /* @__PURE__ */ e(s, { children: t("dashboard.annotations.latestSessions") })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-4 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "4" }),
        t("sections.useCases")
      ] }),
      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [1, 2, 3].map((a) => /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-4 bg-[var(--bg-card)]", children: [
        /* @__PURE__ */ e("div", { className: "text-xs font-semibold text-[var(--color-primary-600)] uppercase tracking-wide mb-1", children: t(`useCases.${a}.persona`) }),
        /* @__PURE__ */ e("p", { className: "text-sm font-medium mb-2", children: t(`useCases.${a}.situation`) }),
        /* @__PURE__ */ e("div", { className: "pt-2 border-t border-[var(--border-color)]", children: /* @__PURE__ */ r("p", { className: "text-xs text-[var(--text-muted)]", children: [
          /* @__PURE__ */ r("span", { className: "font-medium text-green-600", children: [
            t("useCases.withLabel"),
            " "
          ] }),
          t(`useCases.${a}.outcome`)
        ] }) })
      ] }, a)) })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-4 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "5" }),
        t("sections.features")
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-3", children: [1, 2, 3, 4, 5].map((a) => /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-4 bg-[var(--bg-card)] flex gap-4", children: [
        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-[var(--color-primary-600)]/10 flex-shrink-0 h-fit", children: /* @__PURE__ */ e(P, { className: "h-4 w-4 text-[var(--color-primary-600)]" }) }),
        /* @__PURE__ */ r("div", { children: [
          /* @__PURE__ */ e("h3", { className: "text-sm font-semibold mb-1", children: t(`features.${a}.title`) }),
          /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-muted)] mb-2", children: t(`features.${a}.desc`) }),
          /* @__PURE__ */ r("div", { className: "px-3 py-1.5 rounded-md bg-[var(--bg-secondary)] text-xs", children: [
            /* @__PURE__ */ e("span", { className: "font-medium text-[var(--color-primary-600)]", children: "Ex. " }),
            t(`features.${a}.example`)
          ] })
        ] })
      ] }, a)) })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-[var(--text-primary)] mb-4 flex items-center gap-2", children: [
        /* @__PURE__ */ e("span", { className: "w-7 h-7 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-xs font-bold", children: "6" }),
        t("sections.faq")
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-3", children: [1, 2, 3, 4, 5].map((a) => /* @__PURE__ */ r("div", { className: "border border-[var(--border-color)] rounded-lg p-4 bg-[var(--bg-card)]", children: [
        /* @__PURE__ */ r("div", { className: "flex items-start gap-2 mb-2", children: [
          /* @__PURE__ */ e(F, { className: "h-4 w-4 text-[var(--color-primary-600)] flex-shrink-0 mt-0.5" }),
          /* @__PURE__ */ e("h3", { className: "text-sm font-medium", children: t(`faq.${a}.question`) })
        ] }),
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-muted)] pl-6", children: t(`faq.${a}.answer`) })
      ] }, a)) })
    ] }),
    /* @__PURE__ */ r("section", { children: [
      /* @__PURE__ */ r(
        "button",
        {
          onClick: () => S(!i),
          className: "w-full flex items-center justify-between p-4 rounded-lg border border-[var(--border-color)] bg-[var(--bg-card)] hover:bg-[var(--bg-secondary)] transition-colors",
          children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
              /* @__PURE__ */ e(q, { className: "h-4 w-4 text-[var(--text-muted)]" }),
              /* @__PURE__ */ e("span", { className: "text-sm font-semibold", children: t("sections.techRef") })
            ] }),
            /* @__PURE__ */ e(o, { className: `h-4 w-4 text-[var(--text-muted)] transition-transform ${i ? "rotate-90" : ""}` })
          ]
        }
      ),
      i && /* @__PURE__ */ r("div", { className: "mt-2 border border-[var(--border-color)] rounded-lg bg-[var(--bg-card)] divide-y divide-[var(--border-color)]", children: [
        /* @__PURE__ */ r("div", { className: "p-4", children: [
          /* @__PURE__ */ e("h3", { className: "text-sm font-semibold mb-3", children: t("techRef.rulesTitle") }),
          /* @__PURE__ */ e("div", { className: "space-y-2", children: J.map((a) => /* @__PURE__ */ r("div", { className: "p-3 rounded-lg bg-[var(--bg-secondary)] text-xs", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-1", children: [
              /* @__PURE__ */ e("span", { className: "font-mono text-[var(--color-primary-600)]", children: a.id }),
              /* @__PURE__ */ e("span", { className: "px-1.5 py-0.5 rounded bg-[var(--color-primary-600)]/10 text-[var(--color-primary-700)]", children: a.category })
            ] }),
            /* @__PURE__ */ e("p", { className: "text-[var(--text-muted)]", children: t(a.key) })
          ] }, a.id)) })
        ] }),
        /* @__PURE__ */ r("div", { className: "p-4", children: [
          /* @__PURE__ */ e("h3", { className: "text-sm font-semibold mb-3", children: t("techRef.permissionsTitle") }),
          /* @__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: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ e("th", { className: "text-left py-2 px-2 text-[var(--text-muted)] font-medium", children: "Permission" }),
              /* @__PURE__ */ e("th", { className: "text-left py-2 px-2 text-[var(--text-muted)] font-medium", children: "Description" })
            ] }) }),
            /* @__PURE__ */ e("tbody", { children: /* @__PURE__ */ r("tr", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ e("td", { className: "py-2 px-2 font-mono text-[var(--color-primary-600)]", children: "administration.users.read" }),
              /* @__PURE__ */ e("td", { className: "py-2 px-2 text-[var(--text-muted)]", children: t("techRef.perms.read") })
            ] }) })
          ] }) })
        ] }),
        /* @__PURE__ */ r("div", { className: "p-4", children: [
          /* @__PURE__ */ e("h3", { className: "text-sm font-semibold mb-3", children: t("techRef.endpointsTitle") }),
          /* @__PURE__ */ e("div", { className: "space-y-2", children: z.map((a, d) => /* @__PURE__ */ r("div", { className: "p-2.5 rounded-lg bg-[var(--bg-secondary)] text-xs", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-0.5", children: [
              /* @__PURE__ */ e("span", { className: `font-bold px-1.5 py-0.5 rounded border text-xs ${K[a.method]}`, children: a.method }),
              /* @__PURE__ */ r("code", { className: "text-[var(--text-primary)]", children: [
                a.path,
                a.params
              ] })
            ] }),
            /* @__PURE__ */ r("div", { className: "text-[var(--text-muted)] pl-1", children: [
              a.handler,
              " · ",
              /* @__PURE__ */ e("span", { className: "font-mono", children: a.permission })
            ] })
          ] }, d)) })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("div", { className: "flex justify-between pt-6 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ r(
        c,
        {
          to: "/docs/business/administration/users",
          className: "flex items-center gap-2 text-[var(--text-secondary)] hover:text-[var(--color-primary-600)] transition-colors text-sm",
          children: [
            /* @__PURE__ */ e(p, { className: "w-4 h-4" }),
            t("nav.backToAdmin")
          ]
        }
      ),
      /* @__PURE__ */ r(
        c,
        {
          to: "/docs/business/administration/permissions",
          className: "flex items-center gap-2 text-[var(--color-primary-600)] hover:underline text-sm",
          children: [
            t("nav.toUsersList"),
            /* @__PURE__ */ e(H, { className: "w-4 h-4" })
          ]
        }
      )
    ] })
  ] });
}
export {
  re as default
};
//# sourceMappingURL=index-D4u23zHI.js.map
