@burdenoff/microfe-auth 2026.1013.1 → 2026.1013.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/auth/components/workspace/WorkspaceSelector.js +3 -3
- package/dist/auth/components/workspace/WorkspaceSelector.js.map +1 -1
- package/dist/auth/pages/SsoConfigPage.js +1 -1
- package/dist/auth/pages/SsoConfigPage.js.map +1 -1
- package/dist/auth/pages/UsersPage.js +4 -4
- package/dist/auth/pages/UsersPage.js.map +1 -1
- package/dist/microfe-auth.css +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UsersPage.js","names":[],"sources":["../../../src/auth/pages/UsersPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useId } from \"react\";\nimport { useNavigate } from \"react-router\";\nimport { useTr } from \"../../shared/hooks/useTr\";\nimport { Button } from \"@burdenoff/fe-libs/button\";\nimport {\n EmphasisPanel,\n IllustratedEmptyState,\n PagePurpose,\n NextSteps,\n} from \"@burdenoff/fe-libs/ui\";\nimport { useAuthPermissions } from \"../hooks/useAuthPermissions\";\nimport { useUserOperations } from \"../hooks/useUserOperations\";\nimport { validatePhoneNumber } from \"../utils/validation\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { validateUserFields } from \"../utils/validation\";\nimport { ConfirmActionDialog } from \"../components/ConfirmActionDialog\";\nimport type {\n User,\n UserRole,\n UserStatus,\n UserFilterInput,\n PaginationInput,\n} from \"../types\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\ntype ViewMode = \"list\" | \"edit\" | \"view\";\n\ninterface FormData {\n username: string;\n firstName: string;\n lastName: string;\n name: string;\n phoneNumber: string;\n role: UserRole;\n status: UserStatus;\n emailVerified: boolean;\n}\n\n// SUPER_ADMIN is determined by email allowlist at runtime, not stored as a\n// DB role — filtering by it always returns 0 rows, so it is excluded here.\nconst USER_ROLES: UserRole[] = [\n \"TENANT_ADMIN\",\n \"ORG_ADMIN\",\n \"WORKSPACE_ADMIN\",\n \"MEMBER\",\n \"GUEST\",\n];\n\nconst USER_STATUSES: UserStatus[] = [\n \"ACTIVE\",\n \"INACTIVE\",\n \"SUSPENDED\",\n \"DELETED\",\n];\n\n/**\n * Users CRUDL page for managing users (admin only)\n */\nexport function UsersPage() {\n const tr = useTr();\n const navigate = useNavigate();\n\n const isAuthenticated = useAuthStore((state) => state.isAuthenticated);\n const currentUser = useAuthStore((state) => state.user);\n const {\n canViewUsers,\n canUpdateUsers,\n canDeleteUsers,\n isLoading: permissionsLoading,\n } = useAuthPermissions();\n const { listUsers, updateUser, deleteUser, hardDeleteUser, isLoading } =\n useUserOperations();\n\n // Stable IDs for ARIA associations (accessibility)\n const searchId = useId();\n const roleFilterId = useId();\n const statusFilterId = useId();\n const errorId = useId();\n const successId = useId();\n\n const [isExporting, setIsExporting] = useState(false);\n\n const handleExport = async () => {\n setIsExporting(true);\n try {\n const filter: UserFilterInput = {};\n if (searchQuery) filter.search = searchQuery;\n if (filterRole) filter.role = filterRole;\n if (filterStatus) filter.status = filterStatus;\n\n const result = await listUsers(filter, { offset: 0, limit: 10000 });\n const rows = result.users;\n\n const headers = [\n \"ID\",\n \"Email\",\n \"Username\",\n \"First Name\",\n \"Last Name\",\n \"Phone\",\n \"Role\",\n \"Status\",\n \"Email Verified\",\n \"MFA Enabled\",\n \"Last Login\",\n \"Created At\",\n ];\n\n const escape = (v: string | undefined | null) => {\n if (v == null) return \"\";\n const s = String(v);\n return s.includes(\",\") || s.includes('\"') || s.includes(\"\\n\")\n ? `\"${s.replace(/\"/g, '\"\"')}\"`\n : s;\n };\n\n const lines = [\n headers.join(\",\"),\n ...rows.map((u) =>\n [\n escape(u.id),\n escape(u.email),\n escape(u.username),\n escape(u.firstName),\n escape(u.lastName),\n escape(u.phoneNumber),\n escape(u.role),\n escape(u.status),\n escape(String(u.emailVerified)),\n escape(String(u.mfaEnabled)),\n escape(u.lastLoginAt),\n escape(u.createdAt),\n ].join(\",\"),\n ),\n ];\n\n const blob = new Blob([lines.join(\"\\n\")], {\n type: \"text/csv;charset=utf-8;\",\n });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = `users-${new Date().toISOString().slice(0, 10)}.csv`;\n a.click();\n URL.revokeObjectURL(url);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Failed to export users\");\n } finally {\n setIsExporting(false);\n }\n };\n\n const [users, setUsers] = useState<User[]>([]);\n const [totalCount, setTotalCount] = useState(0);\n const [hasMore, setHasMore] = useState(false);\n const [viewMode, setViewMode] = useState<ViewMode>(\"list\");\n const [selectedUser, setSelectedUser] = useState<User | null>(null);\n const [formData, setFormData] = useState<FormData>({\n username: \"\",\n firstName: \"\",\n lastName: \"\",\n name: \"\",\n phoneNumber: \"\",\n role: \"MEMBER\",\n status: \"ACTIVE\",\n emailVerified: false,\n });\n const [error, setError] = useState<string | null>(null);\n const [phoneError, setPhoneError] = useState<string | null>(null);\n const [isUnauthorized, setIsUnauthorized] = useState(false);\n const [successMessage, setSuccessMessage] = useState<string | null>(null);\n const [pendingAction, setPendingAction] = useState<{\n type: \"deactivate\" | \"hard-delete\";\n user: User;\n } | null>(null);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [filterRole, setFilterRole] = useState<UserRole | \"\">(\"\");\n const [filterStatus, setFilterStatus] = useState<UserStatus | \"\">(\"\");\n const [currentPage, setCurrentPage] = useState(0);\n const pageSize = 10;\n\n const fetchUsers = useCallback(async () => {\n if (!isAuthenticated) return;\n\n try {\n setIsUnauthorized(false);\n const filter: UserFilterInput = {};\n if (searchQuery) filter.search = searchQuery;\n if (filterRole) filter.role = filterRole;\n if (filterStatus) filter.status = filterStatus;\n\n const pagination: PaginationInput = {\n offset: currentPage * pageSize,\n limit: pageSize,\n };\n\n const result = await listUsers(filter, pagination);\n setUsers(result.users);\n setTotalCount(result.totalCount);\n setHasMore(result.hasMore);\n setError(null);\n } catch (err) {\n // Ignore abort errors - they happen during component unmount/re-render\n if (\n err instanceof Error &&\n (err.name === \"AbortError\" || err.message.includes(\"aborted\"))\n ) {\n return;\n }\n const errorMessage =\n err instanceof Error ? err.message : \"Failed to fetch users\";\n // Check if it's an authorization error\n if (\n errorMessage.toLowerCase().includes(\"not authorized\") ||\n errorMessage.toLowerCase().includes(\"forbidden\")\n ) {\n setIsUnauthorized(true);\n setError(null);\n } else {\n setError(errorMessage);\n }\n }\n }, [\n listUsers,\n searchQuery,\n filterRole,\n filterStatus,\n currentPage,\n isAuthenticated,\n ]);\n\n useEffect(() => {\n fetchUsers();\n }, [fetchUsers]);\n\n const resetForm = () => {\n setFormData({\n username: \"\",\n firstName: \"\",\n lastName: \"\",\n name: \"\",\n phoneNumber: \"\",\n role: \"MEMBER\",\n status: \"ACTIVE\",\n emailVerified: false,\n });\n setSelectedUser(null);\n setError(null);\n setPhoneError(null);\n setSuccessMessage(null);\n };\n\n const handleUpdate = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!selectedUser) return;\n setError(null);\n setPhoneError(null);\n\n const phoneValidation = validatePhoneNumber(formData.phoneNumber);\n if (!phoneValidation.valid) {\n const phoneMsg = tr(\n \"auth.users.phoneNumber_invalid\",\n \"Invalid phone number\",\n );\n setPhoneError(phoneMsg);\n setError(phoneMsg);\n return;\n }\n\n // BOFF-7214: same name/username invariants the signup form enforces\n // must hold on user edit too, otherwise an admin (or anyone with\n // users:update) can re-introduce a numbers-only account. Same\n // validator the register form uses, same canonicalised output.\n // Pass `requireAll: false` so an existing user whose optional\n // `firstName`/`lastName` is unset (e.g. provisioned via IdP) can\n // still update unrelated fields like phone or role (Codex P2 review).\n const validation = validateUserFields(formData, { requireAll: false });\n if (!validation.valid) {\n setError(\n validation.errors\n .map((e) => {\n const key = `auth.users.${e.field}_${e.code}`;\n return tr(key, e.message);\n })\n .join(\" · \"),\n );\n return;\n }\n\n try {\n await updateUser(selectedUser.id, {\n username: validation.values.username || undefined,\n firstName: validation.values.firstName || undefined,\n lastName: validation.values.lastName || undefined,\n name: formData.name || undefined,\n phoneNumber: formData.phoneNumber || undefined,\n role: formData.role,\n status: formData.status,\n emailVerified: formData.emailVerified,\n });\n setSuccessMessage(\n tr(\"auth.users.updateSuccess\", \"User updated successfully!\"),\n );\n setViewMode(\"list\");\n resetForm();\n fetchUsers();\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Failed to update user\");\n }\n };\n\n const handleDelete = async (user: User) => {\n void nativeImpact(\"medium\");\n try {\n const result = await deleteUser(user.id);\n if (result.success) {\n void nativeNotify(\"success\");\n setSuccessMessage(\n tr(\n \"auth.users.userDeactivated\",\n 'User \"{email}\" has been deactivated.',\n ).replace(\"{email}\", user.email),\n );\n setPendingAction(null);\n fetchUsers();\n } else {\n void nativeNotify(\"error\");\n setError(result.message);\n }\n } catch (err) {\n void nativeNotify(\"error\");\n setError(err instanceof Error ? err.message : \"Failed to delete user\");\n }\n };\n\n const handleHardDelete = async (user: User) => {\n try {\n const result = await hardDeleteUser(user.id);\n if (result.success) {\n setSuccessMessage(\n tr(\n \"auth.users.userPermanentlyDeleted\",\n 'User \"{email}\" has been permanently deleted.',\n ).replace(\"{email}\", user.email),\n );\n setPendingAction(null);\n fetchUsers();\n } else {\n setError(result.message);\n }\n } catch (err) {\n setError(\n err instanceof Error ? err.message : \"Failed to hard delete user\",\n );\n }\n };\n\n const startEdit = (user: User) => {\n setSelectedUser(user);\n setFormData({\n username: user.username || \"\",\n firstName: user.firstName || \"\",\n lastName: user.lastName || \"\",\n name: user.name || \"\",\n phoneNumber: user.phoneNumber || \"\",\n role: user.role,\n status: user.status,\n emailVerified: user.emailVerified,\n });\n setViewMode(\"edit\");\n setError(null);\n };\n\n const pendingActionDialog = (\n <ConfirmActionDialog\n open={pendingAction !== null}\n onOpenChange={(open) => {\n if (!open) {\n setPendingAction(null);\n }\n }}\n title={\n pendingAction?.type === \"hard-delete\"\n ? tr(\"auth.users.hardDeleteTitle\", \"Permanently delete user?\")\n : tr(\"auth.users.deactivateTitle\", \"Deactivate user?\")\n }\n description={\n pendingAction?.type === \"hard-delete\"\n ? pendingAction\n ? tr(\n \"auth.users.hardDeleteDesc\",\n 'This permanently deletes \"{email}\" and cannot be undone.',\n ).replace(\"{email}\", pendingAction.user.email)\n : \"\"\n : pendingAction\n ? tr(\n \"auth.users.deactivateDesc\",\n '\"{email}\" will be prevented from signing in until reactivated.',\n ).replace(\"{email}\", pendingAction.user.email)\n : \"\"\n }\n confirmText={\n pendingAction?.type === \"hard-delete\"\n ? tr(\"auth.users.hardDeleteConfirm\", \"Delete permanently\")\n : tr(\"auth.users.deactivateConfirm\", \"Deactivate user\")\n }\n variant={pendingAction?.type === \"hard-delete\" ? \"danger\" : \"warning\"}\n onConfirm={async () => {\n if (!pendingAction) return;\n if (pendingAction.type === \"hard-delete\") {\n await handleHardDelete(pendingAction.user);\n return;\n }\n await handleDelete(pendingAction.user);\n }}\n />\n );\n\n const getRoleColor = (role: UserRole) => {\n switch (role) {\n case \"SUPER_ADMIN\":\n return \"bg-accent-purple-subtle text-accent-purple\";\n case \"TENANT_ADMIN\":\n return \"bg-status-info-bg-subtle text-status-info-text\";\n case \"ORG_ADMIN\":\n return \"bg-accent-indigo-subtle text-accent-indigo\";\n case \"WORKSPACE_ADMIN\":\n return \"bg-accent-cyan-subtle text-accent-cyan\";\n case \"MEMBER\":\n return \"bg-status-success-bg-subtle text-status-success-text\";\n case \"GUEST\":\n return \"bg-bg-sunken text-text-primary\";\n default:\n return \"bg-bg-sunken text-text-primary\";\n }\n };\n\n const getStatusColor = (status: UserStatus) => {\n switch (status) {\n case \"ACTIVE\":\n return \"bg-status-success-bg-subtle text-status-success-text\";\n case \"INACTIVE\":\n return \"bg-status-warning-bg-subtle text-status-warning-text\";\n case \"SUSPENDED\":\n return \"bg-status-warning-bg-subtle text-status-warning-text\";\n case \"DELETED\":\n return \"bg-status-error-bg-subtle text-status-error-text\";\n default:\n return \"bg-bg-sunken text-text-primary\";\n }\n };\n\n // Authentication check\n if (!isAuthenticated) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <IllustratedEmptyState\n illustration=\"empty-generic\"\n title={tr(\"auth.users.authRequired\", \"Authentication Required\")}\n description={tr(\n \"auth.users.signInToManage\",\n \"Please sign in to manage users\",\n )}\n />\n </div>\n );\n }\n\n // Loading permissions\n if (permissionsLoading) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <div className=\"text-center py-16\">\n <SpinnerIcon className=\"size-8 mx-auto text-text-secondary animate-spin\" />\n <p className=\"mt-4 text-text-secondary\">\n {tr(\"auth.users.loadingPermissions\", \"Loading permissions...\")}\n </p>\n </div>\n </div>\n );\n }\n\n // Authorization check - user needs user:read permission\n if (!canViewUsers || isUnauthorized) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <IllustratedEmptyState\n illustration=\"empty-generic\"\n title={tr(\"auth.users.adminAccessRequired\", \"Admin Access Required\")}\n description={\n <>\n {tr(\n \"auth.users.adminAccessDesc\",\n \"You need administrator privileges to view and manage users.\",\n )}{\" \"}\n {tr(\n \"auth.users.requiredRoles\",\n \"Required roles: Super Admin, Tenant Admin, or Org Admin\",\n )}\n </>\n }\n />\n </div>\n );\n }\n\n // List view\n if (viewMode === \"list\") {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n {pendingActionDialog}\n {/* Header */}\n <div className=\"flex items-center justify-between mb-8\">\n <div>\n <h1 className=\"text-3xl font-semibold text-text-primary\">\n {tr(\"auth.users.title\", \"Users\")}\n </h1>\n <p className=\"text-text-secondary mt-2\">\n {tr(\"auth.users.subtitle\", \"Manage users in your organization\")} (\n {totalCount} {tr(\"auth.users.paginationUsers\", \"total\")})\n </p>\n </div>\n {/* Export button */}\n <button\n type=\"button\"\n onClick={() => void handleExport()}\n disabled={isExporting}\n aria-label={tr(\"auth.users.exportAriaLabel\", \"Export user list\")}\n className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n >\n {isExporting ? (\n <>\n <SpinnerIcon\n className=\"size-4 animate-spin\"\n aria-hidden=\"true\"\n />\n {tr(\"auth.users.exporting\", \"Exporting...\")}\n </>\n ) : (\n <>\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n />\n </svg>\n {tr(\"auth.users.export\", \"Export\")}\n </>\n )}\n </button>\n </div>\n\n <PagePurpose className=\"mb-6\">\n {tr(\n \"auth.users.purpose\",\n \"Manage everyone with access to your organization. Search and filter accounts, review their role and status, edit details, or deactivate people who should no longer have access.\",\n )}\n </PagePurpose>\n\n {/* Emphasis: directory summary — the one highlighted zone */}\n <EmphasisPanel className=\"mb-6\">\n <p className=\"text-sm font-medium text-text-secondary\">\n {tr(\"auth.users.summaryLabel\", \"People in this organization\")}\n </p>\n <p className=\"mt-1 text-3xl font-semibold text-text-primary\">\n {totalCount}\n </p>\n <p className=\"mt-1 text-sm text-text-secondary\">\n {tr(\n \"auth.users.summaryHint\",\n \"Use the filters below to find a specific person or role.\",\n )}\n </p>\n </EmphasisPanel>\n\n {/* Live region for status announcements */}\n <div aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n {successMessage}\n </div>\n <div\n role=\"alert\"\n aria-live=\"assertive\"\n aria-atomic=\"true\"\n className=\"sr-only\"\n >\n {error}\n </div>\n\n {/* Success Message */}\n {successMessage && (\n <output\n id={successId}\n className=\"block mb-6 p-4 rounded-xl bg-status-success-bg-subtle border border-status-success-border\"\n >\n <p className=\"text-status-success-text\">{successMessage}</p>\n <button\n type=\"button\"\n onClick={() => setSuccessMessage(null)}\n className=\"mt-2 text-sm text-status-success-text hover:underline\"\n >\n {tr(\"auth.users.dismiss\", \"Dismiss\")}\n </button>\n </output>\n )}\n\n {/* Error Message */}\n {error && (\n <div\n id={errorId}\n role=\"alert\"\n className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n >\n <AlertIcon\n className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n aria-hidden=\"true\"\n />\n <div className=\"flex-1\">\n <p className=\"text-sm text-status-error-text\">{error}</p>\n <button\n type=\"button\"\n onClick={() => setError(null)}\n className=\"mt-2 text-sm text-status-error-text hover:underline\"\n >\n {tr(\"auth.users.dismiss\", \"Dismiss\")}\n </button>\n </div>\n </div>\n )}\n\n {/* Filters */}\n <div className=\"mb-6 p-4 rounded-xl border border-border-subtle bg-bg-surface\">\n <div className=\"flex flex-wrap gap-4 items-end\">\n {/* Visually hidden labels satisfy WCAG — placeholders are not labels */}\n <div className=\"flex-1 min-w-[200px]\">\n <label htmlFor={searchId} className=\"sr-only\">\n {tr(\"auth.users.searchLabel\", \"Search users\")}\n </label>\n <input\n id={searchId}\n type=\"search\"\n aria-label={tr(\"auth.users.searchLabel\", \"Search users\")}\n placeholder={tr(\n \"auth.users.searchPlaceholder\",\n \"Search by email, username, or name...\",\n )}\n value={searchQuery}\n onChange={(e) => {\n setSearchQuery(e.target.value);\n setCurrentPage(0);\n }}\n className=\"w-full px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary placeholder-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n <div>\n <label htmlFor={roleFilterId} className=\"sr-only\">\n {tr(\"auth.users.filterRoleLabel\", \"Filter by role\")}\n </label>\n <select\n id={roleFilterId}\n value={filterRole}\n onChange={(e) => {\n setFilterRole(e.target.value as UserRole | \"\");\n setCurrentPage(0);\n }}\n className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n >\n <option value=\"\">\n {tr(\"auth.users.allRoles\", \"All Roles\")}\n </option>\n {USER_ROLES.map((role) => (\n <option key={role} value={role}>\n {role.replace(\"_\", \" \")}\n </option>\n ))}\n </select>\n </div>\n <div>\n <label htmlFor={statusFilterId} className=\"sr-only\">\n {tr(\"auth.users.filterStatusLabel\", \"Filter by status\")}\n </label>\n <select\n id={statusFilterId}\n value={filterStatus}\n onChange={(e) => {\n setFilterStatus(e.target.value as UserStatus | \"\");\n setCurrentPage(0);\n }}\n className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n >\n <option value=\"\">\n {tr(\"auth.users.allStatuses\", \"All Statuses\")}\n </option>\n {USER_STATUSES.map((status) => (\n <option key={status} value={status}>\n {status}\n </option>\n ))}\n </select>\n </div>\n </div>\n </div>\n\n {isLoading ? (\n <div\n aria-live=\"polite\"\n aria-busy=\"true\"\n className=\"flex items-center justify-center py-12\"\n >\n <SpinnerIcon\n className=\"size-8 text-text-link animate-spin\"\n aria-hidden=\"true\"\n />\n <span className=\"ml-3 text-text-secondary\">\n {tr(\"auth.users.loadingUsers\", \"Loading users...\")}\n </span>\n </div>\n ) : users.length === 0 ? (\n <IllustratedEmptyState\n illustration={\n searchQuery || filterRole || filterStatus\n ? \"empty-search\"\n : \"empty-people\"\n }\n title={tr(\"auth.users.noUsersFound\", \"No users found\")}\n description={\n searchQuery || filterRole || filterStatus\n ? tr(\n \"auth.users.noUsersFilteredDesc\",\n \"No users match your current search or filters. Try clearing them to see everyone.\",\n )\n : tr(\n \"auth.users.noUsersDesc\",\n \"Once people join your organization they'll show up here for you to manage.\",\n )\n }\n />\n ) : (\n <>\n {/* Users Table */}\n <div className=\"rounded-xl border border-border-subtle bg-bg-surface overflow-hidden shadow-sm\">\n <div className=\"overflow-x-auto\">\n <table\n className=\"w-full min-w-[800px]\"\n aria-label={tr(\"auth.users.tableAriaLabel\", \"Users table\")}\n >\n <thead>\n <tr className=\"border-b border-border-subtle bg-bg-canvas\">\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[280px]\"\n >\n {tr(\"auth.users.columnUser\", \"User\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[130px]\"\n >\n {tr(\"auth.users.columnRole\", \"Role\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n >\n {tr(\"auth.users.columnStatus\", \"Status\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[80px]\"\n >\n {tr(\"auth.users.columnVerified\", \"Verified\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n >\n {tr(\"auth.users.columnLastLogin\", \"Last Login\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-right p-4 text-sm font-medium text-text-secondary w-[180px]\"\n >\n {tr(\"auth.users.columnActions\", \"Actions\")}\n </th>\n </tr>\n </thead>\n <tbody>\n {users.map((user) => (\n <tr\n key={user.id}\n className=\"border-b border-border-subtle last:border-b-0 hover:bg-bg-sunken/50 transition-colors\"\n >\n <td className=\"p-4\">\n <div className=\"flex items-center gap-3 min-w-0\">\n <div className=\"auth-brand-badge flex size-10 shrink-0 items-center justify-center rounded-full font-medium\">\n {(user.name || user.username || user.email)\n .charAt(0)\n .toUpperCase()}\n </div>\n <div className=\"min-w-0 flex-1\">\n <p className=\"font-medium text-text-primary truncate\">\n {user.name || user.username}\n </p>\n <p className=\"text-sm text-text-secondary truncate\">\n {user.email}\n </p>\n </div>\n </div>\n </td>\n <td className=\"p-4\">\n <span\n className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getRoleColor(user.role)}`}\n >\n {user.role.replace(\"_\", \" \")}\n </span>\n </td>\n <td className=\"p-4\">\n <span\n className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getStatusColor(user.status)}`}\n >\n {user.status}\n </span>\n </td>\n <td className=\"p-4\">\n {user.emailVerified ? (\n <span className=\"inline-flex items-center gap-1 text-status-success-text whitespace-nowrap\">\n <svg\n className=\"size-4 flex-shrink-0\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n clipRule=\"evenodd\"\n />\n </svg>\n <span className=\"text-sm\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n </span>\n ) : (\n <span className=\"inline-flex items-center gap-1 text-status-warning-text whitespace-nowrap\">\n <svg\n className=\"size-4 flex-shrink-0\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n clipRule=\"evenodd\"\n />\n </svg>\n <span className=\"text-sm\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n </span>\n )}\n </td>\n <td className=\"p-4 text-sm text-text-secondary whitespace-nowrap\">\n {user.lastLoginAt\n ? new Date(user.lastLoginAt).toLocaleDateString()\n : tr(\"auth.users.lastLoginNever\", \"Never\")}\n </td>\n <td className=\"p-4\">\n <div className=\"flex justify-end gap-1.5 flex-nowrap\">\n <button\n type=\"button\"\n onClick={() => navigate(`/auth/users/${user.id}`)}\n aria-label={`${tr(\"auth.users.actionView\", \"View\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionView\", \"View\")}\n </button>\n {canUpdateUsers && (\n <button\n type=\"button\"\n onClick={() => startEdit(user)}\n aria-label={`${tr(\"auth.users.actionEdit\", \"Edit\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-info-border text-text-link bg-bg-surface hover:bg-status-info-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionEdit\", \"Edit\")}\n </button>\n )}\n {canDeleteUsers && user.status !== \"DELETED\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({ type: \"deactivate\", user })\n }\n aria-label={`${tr(\"auth.users.actionDelete\", \"Delete\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-error-border text-status-error-text bg-bg-surface hover:bg-status-error-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionDelete\", \"Delete\")}\n </button>\n )}\n </div>\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n </div>\n\n {/* Pagination */}\n <div className=\"mt-6 flex items-center justify-between\">\n <p className=\"text-sm text-text-secondary\">\n {tr(\"auth.users.showing\", \"Showing\")}{\" \"}\n {currentPage * pageSize + 1} {tr(\"auth.users.to\", \"to\")}{\" \"}\n {Math.min((currentPage + 1) * pageSize, totalCount)}{\" \"}\n {tr(\"auth.users.of\", \"of\")} {totalCount}{\" \"}\n {tr(\"auth.users.paginationUsers\", \"users\")}\n </p>\n <nav\n aria-label={tr(\n \"auth.users.paginationAriaLabel\",\n \"User list pagination\",\n )}\n >\n <div className=\"flex gap-2\">\n <button\n type=\"button\"\n onClick={() =>\n setCurrentPage((prev) => Math.max(0, prev - 1))\n }\n disabled={currentPage === 0}\n aria-label={tr(\n \"auth.users.previousPageAriaLabel\",\n \"Go to previous page\",\n )}\n className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.previousPage\", \"Previous\")}\n </button>\n <button\n type=\"button\"\n onClick={() => setCurrentPage((prev) => prev + 1)}\n disabled={!hasMore}\n aria-label={tr(\n \"auth.users.nextPageAriaLabel\",\n \"Go to next page\",\n )}\n className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.nextPage\", \"Next\")}\n </button>\n </div>\n </nav>\n </div>\n\n <NextSteps\n className=\"mt-8\"\n storageKey=\"auth-users\"\n steps={[\n {\n id: \"search-user\",\n label: tr(\"auth.users.nextSearch\", \"Find a specific person\"),\n description: tr(\n \"auth.users.nextSearchDesc\",\n \"Use the search and role / status filters above to narrow the list.\",\n ),\n onClick: () => {\n const el = document.getElementById(searchId);\n if (el instanceof HTMLInputElement) el.focus();\n },\n },\n {\n id: \"export-users\",\n label: tr(\"auth.users.nextExport\", \"Export the user list\"),\n description: tr(\n \"auth.users.nextExportDesc\",\n \"Download a CSV of users matching your current filters.\",\n ),\n onClick: () => void handleExport(),\n },\n ]}\n />\n </>\n )}\n </div>\n );\n }\n\n // View details\n if (viewMode === \"view\" && selectedUser) {\n return (\n <div className=\"max-w-4xl mx-auto p-6\">\n {pendingActionDialog}\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n >\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n />\n </svg>\n {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n </button>\n\n <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n <div className=\"flex items-center gap-4 mb-8\">\n <div className=\"auth-brand-badge flex size-20 items-center justify-center rounded-full text-3xl font-semibold\">\n {(\n selectedUser.name ||\n selectedUser.username ||\n selectedUser.email\n )\n .charAt(0)\n .toUpperCase()}\n </div>\n <div>\n <h1 className=\"text-2xl font-semibold text-text-primary\">\n {selectedUser.name || selectedUser.username}\n </h1>\n <p className=\"text-text-secondary\">{selectedUser.email}</p>\n <div className=\"flex items-center gap-2 mt-2\">\n <span\n className={`px-2.5 py-1 rounded-full text-xs font-medium ${getRoleColor(selectedUser.role)}`}\n >\n {selectedUser.role.replace(\"_\", \" \")}\n </span>\n <span\n className={`px-2.5 py-1 rounded-full text-xs font-medium ${getStatusColor(selectedUser.status)}`}\n >\n {selectedUser.status}\n </span>\n </div>\n </div>\n </div>\n\n <div className=\"grid grid-cols-2 gap-6\">\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsUsername\", \"Username\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.username}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsEmail\", \"Email\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.email}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsEmailVerified\", \"Email Verified\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.emailVerified ? (\n <span className=\"text-status-success-text\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n ) : (\n <span className=\"text-status-warning-text\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n )}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsMfaEnabled\", \"MFA Enabled\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.mfaEnabled ? (\n <span className=\"text-status-success-text\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n ) : (\n <span className=\"text-text-secondary\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n )}\n </p>\n </div>\n\n {selectedUser.phoneNumber && (\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsPhoneNumber\", \"Phone Number\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.phoneNumber}\n </p>\n </div>\n )}\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsLastLogin\", \"Last Login\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.lastLoginAt\n ? new Date(selectedUser.lastLoginAt).toLocaleString()\n : tr(\"auth.users.lastLoginNever\", \"Never\")}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsCreated\", \"Created\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {new Date(selectedUser.createdAt).toLocaleString()}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsLastUpdated\", \"Last Updated\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {new Date(selectedUser.updatedAt).toLocaleString()}\n </p>\n </div>\n </div>\n\n <div className=\"mt-8 pt-6 border-t border-border-subtle flex gap-3\">\n <Button\n type=\"button\"\n onClick={() => startEdit(selectedUser)}\n variant=\"default\"\n className=\"font-semibold\"\n >\n {tr(\"auth.users.editUser\", \"Edit User\")}\n </Button>\n {selectedUser.status !== \"DELETED\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({ type: \"deactivate\", user: selectedUser })\n }\n className=\"px-4 py-2.5 rounded-xl border border-status-error-border text-status-error-text font-medium hover:bg-status-error-bg-subtle transition-colors\"\n >\n {tr(\"auth.users.deleteUser\", \"Delete User\")}\n </button>\n )}\n {canDeleteUsers &&\n selectedUser.status === \"DELETED\" &&\n currentUser?.role === \"SUPER_ADMIN\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({\n type: \"hard-delete\",\n user: selectedUser,\n })\n }\n className=\"px-4 py-2.5 rounded-xl bg-status-error-bg text-white font-medium hover:bg-status-error-bg-hover transition-colors\"\n >\n {tr(\"auth.users.permanentlyDelete\", \"Permanently Delete\")}\n </button>\n )}\n </div>\n </div>\n </div>\n );\n }\n\n // Edit form\n return (\n <div className=\"max-w-2xl mx-auto p-6\">\n {pendingActionDialog}\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n >\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n />\n </svg>\n {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n </button>\n\n <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n <h1 className=\"text-2xl font-semibold text-text-primary mb-2\">\n {tr(\"auth.users.editUser\", \"Edit User\")}\n </h1>\n\n {selectedUser && (\n <p className=\"text-text-secondary mb-6\">\n {tr(\"auth.users.editingUser\", \"Editing:\")}{\" \"}\n <strong>{selectedUser.email}</strong>\n </p>\n )}\n\n {error && (\n <div className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\">\n <AlertIcon className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n <div className=\"flex-1\">\n <p className=\"text-sm text-status-error-text\">{error}</p>\n </div>\n </div>\n )}\n\n <form\n onSubmit={handleUpdate}\n className=\"space-y-6\"\n aria-describedby={error ? errorId : undefined}\n noValidate\n >\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-username\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldUsername\", \"Username\")}\n </label>\n <input\n id=\"edit-username\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldUsername\", \"Username\")}\n value={formData.username}\n onChange={(e) =>\n setFormData({ ...formData, username: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n\n <div>\n <label\n htmlFor=\"edit-name\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldName\", \"Name\")}\n </label>\n <input\n id=\"edit-name\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldName\", \"Name\")}\n value={formData.name}\n onChange={(e) =>\n setFormData({ ...formData, name: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n </div>\n\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-firstName\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldFirstName\", \"First Name\")}\n </label>\n <input\n id=\"edit-firstName\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldFirstName\", \"First Name\")}\n value={formData.firstName}\n onChange={(e) =>\n setFormData({ ...formData, firstName: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n\n <div>\n <label\n htmlFor=\"edit-lastName\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldLastName\", \"Last Name\")}\n </label>\n <input\n id=\"edit-lastName\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldLastName\", \"Last Name\")}\n value={formData.lastName}\n onChange={(e) =>\n setFormData({ ...formData, lastName: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n </div>\n\n <div>\n <label\n htmlFor=\"edit-phoneNumber\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n </label>\n <input\n id=\"edit-phoneNumber\"\n type=\"tel\"\n aria-label={tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n aria-invalid={phoneError ? true : undefined}\n aria-describedby={\n phoneError ? \"edit-phoneNumber-error\" : undefined\n }\n value={formData.phoneNumber}\n onChange={(e) => {\n setFormData({ ...formData, phoneNumber: e.target.value });\n if (phoneError) {\n setPhoneError(null);\n setError(null);\n }\n }}\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n {phoneError && (\n <p\n id=\"edit-phoneNumber-error\"\n role=\"alert\"\n className=\"mt-2 text-sm text-[var(--color-status-error-text)]\"\n >\n {phoneError}\n </p>\n )}\n </div>\n\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-role\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldRole\", \"Role\")}\n </label>\n <select\n id=\"edit-role\"\n aria-label={tr(\"auth.users.fieldRole\", \"Role\")}\n value={formData.role}\n onChange={(e) =>\n setFormData({ ...formData, role: e.target.value as UserRole })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n >\n {USER_ROLES.map((role) => (\n <option key={role} value={role}>\n {role.replace(\"_\", \" \")}\n </option>\n ))}\n </select>\n </div>\n\n <div>\n <label\n htmlFor=\"edit-status\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldStatus\", \"Status\")}\n </label>\n <select\n id=\"edit-status\"\n aria-label={tr(\"auth.users.fieldStatus\", \"Status\")}\n value={formData.status}\n onChange={(e) =>\n setFormData({\n ...formData,\n status: e.target.value as UserStatus,\n })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n >\n {USER_STATUSES.map((status) => (\n <option key={status} value={status}>\n {status}\n </option>\n ))}\n </select>\n </div>\n </div>\n\n <div className=\"flex items-center gap-3 p-4 rounded-xl bg-bg-canvas/50\">\n <input\n type=\"checkbox\"\n id=\"emailVerified\"\n checked={formData.emailVerified}\n onChange={(e) =>\n setFormData({ ...formData, emailVerified: e.target.checked })\n }\n className=\"size-5 rounded border-border-default text-text-link focus:ring-action-primary-bg\"\n />\n <label\n htmlFor=\"emailVerified\"\n className=\"text-sm font-medium text-text-primary\"\n >\n {tr(\"auth.users.fieldEmailVerified\", \"Email Verified\")}\n </label>\n </div>\n\n <div className=\"flex gap-3 pt-6 mt-6 border-t border-border-default\">\n <Button\n type=\"submit\"\n disabled={isLoading}\n variant=\"default\"\n size=\"lg\"\n className=\"font-semibold\"\n >\n {isLoading ? (\n <>\n <SpinnerIcon className=\"size-4 animate-spin\" />\n {tr(\"auth.users.saving\", \"Saving...\")}\n </>\n ) : (\n tr(\"auth.users.saveChanges\", \"Save Changes\")\n )}\n </Button>\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"inline-flex items-center h-10 px-8 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.cancel\", \"Cancel\")}\n </button>\n </div>\n </form>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"UsersPage.js","names":[],"sources":["../../../src/auth/pages/UsersPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useId } from \"react\";\nimport { useNavigate } from \"react-router\";\nimport { useTr } from \"../../shared/hooks/useTr\";\nimport { Button } from \"@burdenoff/fe-libs/button\";\nimport {\n EmphasisPanel,\n IllustratedEmptyState,\n PagePurpose,\n NextSteps,\n} from \"@burdenoff/fe-libs/ui\";\nimport { useAuthPermissions } from \"../hooks/useAuthPermissions\";\nimport { useUserOperations } from \"../hooks/useUserOperations\";\nimport { validatePhoneNumber } from \"../utils/validation\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { validateUserFields } from \"../utils/validation\";\nimport { ConfirmActionDialog } from \"../components/ConfirmActionDialog\";\nimport type {\n User,\n UserRole,\n UserStatus,\n UserFilterInput,\n PaginationInput,\n} from \"../types\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\ntype ViewMode = \"list\" | \"edit\" | \"view\";\n\ninterface FormData {\n username: string;\n firstName: string;\n lastName: string;\n name: string;\n phoneNumber: string;\n role: UserRole;\n status: UserStatus;\n emailVerified: boolean;\n}\n\n// SUPER_ADMIN is determined by email allowlist at runtime, not stored as a\n// DB role — filtering by it always returns 0 rows, so it is excluded here.\nconst USER_ROLES: UserRole[] = [\n \"TENANT_ADMIN\",\n \"ORG_ADMIN\",\n \"WORKSPACE_ADMIN\",\n \"MEMBER\",\n \"GUEST\",\n];\n\nconst USER_STATUSES: UserStatus[] = [\n \"ACTIVE\",\n \"INACTIVE\",\n \"SUSPENDED\",\n \"DELETED\",\n];\n\n/**\n * Users CRUDL page for managing users (admin only)\n */\nexport function UsersPage() {\n const tr = useTr();\n const navigate = useNavigate();\n\n const isAuthenticated = useAuthStore((state) => state.isAuthenticated);\n const currentUser = useAuthStore((state) => state.user);\n const {\n canViewUsers,\n canUpdateUsers,\n canDeleteUsers,\n isLoading: permissionsLoading,\n } = useAuthPermissions();\n const { listUsers, updateUser, deleteUser, hardDeleteUser, isLoading } =\n useUserOperations();\n\n // Stable IDs for ARIA associations (accessibility)\n const searchId = useId();\n const roleFilterId = useId();\n const statusFilterId = useId();\n const errorId = useId();\n const successId = useId();\n\n const [isExporting, setIsExporting] = useState(false);\n\n const handleExport = async () => {\n setIsExporting(true);\n try {\n const filter: UserFilterInput = {};\n if (searchQuery) filter.search = searchQuery;\n if (filterRole) filter.role = filterRole;\n if (filterStatus) filter.status = filterStatus;\n\n const result = await listUsers(filter, { offset: 0, limit: 10000 });\n const rows = result.users;\n\n const headers = [\n \"ID\",\n \"Email\",\n \"Username\",\n \"First Name\",\n \"Last Name\",\n \"Phone\",\n \"Role\",\n \"Status\",\n \"Email Verified\",\n \"MFA Enabled\",\n \"Last Login\",\n \"Created At\",\n ];\n\n const escape = (v: string | undefined | null) => {\n if (v == null) return \"\";\n const s = String(v);\n return s.includes(\",\") || s.includes('\"') || s.includes(\"\\n\")\n ? `\"${s.replace(/\"/g, '\"\"')}\"`\n : s;\n };\n\n const lines = [\n headers.join(\",\"),\n ...rows.map((u) =>\n [\n escape(u.id),\n escape(u.email),\n escape(u.username),\n escape(u.firstName),\n escape(u.lastName),\n escape(u.phoneNumber),\n escape(u.role),\n escape(u.status),\n escape(String(u.emailVerified)),\n escape(String(u.mfaEnabled)),\n escape(u.lastLoginAt),\n escape(u.createdAt),\n ].join(\",\"),\n ),\n ];\n\n const blob = new Blob([lines.join(\"\\n\")], {\n type: \"text/csv;charset=utf-8;\",\n });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = `users-${new Date().toISOString().slice(0, 10)}.csv`;\n a.click();\n URL.revokeObjectURL(url);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Failed to export users\");\n } finally {\n setIsExporting(false);\n }\n };\n\n const [users, setUsers] = useState<User[]>([]);\n const [totalCount, setTotalCount] = useState(0);\n const [hasMore, setHasMore] = useState(false);\n const [viewMode, setViewMode] = useState<ViewMode>(\"list\");\n const [selectedUser, setSelectedUser] = useState<User | null>(null);\n const [formData, setFormData] = useState<FormData>({\n username: \"\",\n firstName: \"\",\n lastName: \"\",\n name: \"\",\n phoneNumber: \"\",\n role: \"MEMBER\",\n status: \"ACTIVE\",\n emailVerified: false,\n });\n const [error, setError] = useState<string | null>(null);\n const [phoneError, setPhoneError] = useState<string | null>(null);\n const [isUnauthorized, setIsUnauthorized] = useState(false);\n const [successMessage, setSuccessMessage] = useState<string | null>(null);\n const [pendingAction, setPendingAction] = useState<{\n type: \"deactivate\" | \"hard-delete\";\n user: User;\n } | null>(null);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [filterRole, setFilterRole] = useState<UserRole | \"\">(\"\");\n const [filterStatus, setFilterStatus] = useState<UserStatus | \"\">(\"\");\n const [currentPage, setCurrentPage] = useState(0);\n const pageSize = 10;\n\n const fetchUsers = useCallback(async () => {\n if (!isAuthenticated) return;\n\n try {\n setIsUnauthorized(false);\n const filter: UserFilterInput = {};\n if (searchQuery) filter.search = searchQuery;\n if (filterRole) filter.role = filterRole;\n if (filterStatus) filter.status = filterStatus;\n\n const pagination: PaginationInput = {\n offset: currentPage * pageSize,\n limit: pageSize,\n };\n\n const result = await listUsers(filter, pagination);\n setUsers(result.users);\n setTotalCount(result.totalCount);\n setHasMore(result.hasMore);\n setError(null);\n } catch (err) {\n // Ignore abort errors - they happen during component unmount/re-render\n if (\n err instanceof Error &&\n (err.name === \"AbortError\" || err.message.includes(\"aborted\"))\n ) {\n return;\n }\n const errorMessage =\n err instanceof Error ? err.message : \"Failed to fetch users\";\n // Check if it's an authorization error\n if (\n errorMessage.toLowerCase().includes(\"not authorized\") ||\n errorMessage.toLowerCase().includes(\"forbidden\")\n ) {\n setIsUnauthorized(true);\n setError(null);\n } else {\n setError(errorMessage);\n }\n }\n }, [\n listUsers,\n searchQuery,\n filterRole,\n filterStatus,\n currentPage,\n isAuthenticated,\n ]);\n\n useEffect(() => {\n fetchUsers();\n }, [fetchUsers]);\n\n const resetForm = () => {\n setFormData({\n username: \"\",\n firstName: \"\",\n lastName: \"\",\n name: \"\",\n phoneNumber: \"\",\n role: \"MEMBER\",\n status: \"ACTIVE\",\n emailVerified: false,\n });\n setSelectedUser(null);\n setError(null);\n setPhoneError(null);\n setSuccessMessage(null);\n };\n\n const handleUpdate = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!selectedUser) return;\n setError(null);\n setPhoneError(null);\n\n const phoneValidation = validatePhoneNumber(formData.phoneNumber);\n if (!phoneValidation.valid) {\n const phoneMsg = tr(\n \"auth.users.phoneNumber_invalid\",\n \"Invalid phone number\",\n );\n setPhoneError(phoneMsg);\n setError(phoneMsg);\n return;\n }\n\n // BOFF-7214: same name/username invariants the signup form enforces\n // must hold on user edit too, otherwise an admin (or anyone with\n // users:update) can re-introduce a numbers-only account. Same\n // validator the register form uses, same canonicalised output.\n // Pass `requireAll: false` so an existing user whose optional\n // `firstName`/`lastName` is unset (e.g. provisioned via IdP) can\n // still update unrelated fields like phone or role (Codex P2 review).\n const validation = validateUserFields(formData, { requireAll: false });\n if (!validation.valid) {\n setError(\n validation.errors\n .map((e) => {\n const key = `auth.users.${e.field}_${e.code}`;\n return tr(key, e.message);\n })\n .join(\" · \"),\n );\n return;\n }\n\n try {\n await updateUser(selectedUser.id, {\n username: validation.values.username || undefined,\n firstName: validation.values.firstName || undefined,\n lastName: validation.values.lastName || undefined,\n name: formData.name || undefined,\n phoneNumber: formData.phoneNumber || undefined,\n role: formData.role,\n status: formData.status,\n emailVerified: formData.emailVerified,\n });\n setSuccessMessage(\n tr(\"auth.users.updateSuccess\", \"User updated successfully!\"),\n );\n setViewMode(\"list\");\n resetForm();\n fetchUsers();\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Failed to update user\");\n }\n };\n\n const handleDelete = async (user: User) => {\n void nativeImpact(\"medium\");\n try {\n const result = await deleteUser(user.id);\n if (result.success) {\n void nativeNotify(\"success\");\n setSuccessMessage(\n tr(\n \"auth.users.userDeactivated\",\n 'User \"{email}\" has been deactivated.',\n ).replace(\"{email}\", user.email),\n );\n setPendingAction(null);\n fetchUsers();\n } else {\n void nativeNotify(\"error\");\n setError(result.message);\n }\n } catch (err) {\n void nativeNotify(\"error\");\n setError(err instanceof Error ? err.message : \"Failed to delete user\");\n }\n };\n\n const handleHardDelete = async (user: User) => {\n try {\n const result = await hardDeleteUser(user.id);\n if (result.success) {\n setSuccessMessage(\n tr(\n \"auth.users.userPermanentlyDeleted\",\n 'User \"{email}\" has been permanently deleted.',\n ).replace(\"{email}\", user.email),\n );\n setPendingAction(null);\n fetchUsers();\n } else {\n setError(result.message);\n }\n } catch (err) {\n setError(\n err instanceof Error ? err.message : \"Failed to hard delete user\",\n );\n }\n };\n\n const startEdit = (user: User) => {\n setSelectedUser(user);\n setFormData({\n username: user.username || \"\",\n firstName: user.firstName || \"\",\n lastName: user.lastName || \"\",\n name: user.name || \"\",\n phoneNumber: user.phoneNumber || \"\",\n role: user.role,\n status: user.status,\n emailVerified: user.emailVerified,\n });\n setViewMode(\"edit\");\n setError(null);\n };\n\n const pendingActionDialog = (\n <ConfirmActionDialog\n open={pendingAction !== null}\n onOpenChange={(open) => {\n if (!open) {\n setPendingAction(null);\n }\n }}\n title={\n pendingAction?.type === \"hard-delete\"\n ? tr(\"auth.users.hardDeleteTitle\", \"Permanently delete user?\")\n : tr(\"auth.users.deactivateTitle\", \"Deactivate user?\")\n }\n description={\n pendingAction?.type === \"hard-delete\"\n ? pendingAction\n ? tr(\n \"auth.users.hardDeleteDesc\",\n 'This permanently deletes \"{email}\" and cannot be undone.',\n ).replace(\"{email}\", pendingAction.user.email)\n : \"\"\n : pendingAction\n ? tr(\n \"auth.users.deactivateDesc\",\n '\"{email}\" will be prevented from signing in until reactivated.',\n ).replace(\"{email}\", pendingAction.user.email)\n : \"\"\n }\n confirmText={\n pendingAction?.type === \"hard-delete\"\n ? tr(\"auth.users.hardDeleteConfirm\", \"Delete permanently\")\n : tr(\"auth.users.deactivateConfirm\", \"Deactivate user\")\n }\n variant={pendingAction?.type === \"hard-delete\" ? \"danger\" : \"warning\"}\n onConfirm={async () => {\n if (!pendingAction) return;\n if (pendingAction.type === \"hard-delete\") {\n await handleHardDelete(pendingAction.user);\n return;\n }\n await handleDelete(pendingAction.user);\n }}\n />\n );\n\n const getRoleColor = (role: UserRole) => {\n switch (role) {\n case \"SUPER_ADMIN\":\n return \"bg-accent-purple-subtle text-accent-purple\";\n case \"TENANT_ADMIN\":\n return \"bg-status-info-bg-subtle text-status-info-text\";\n case \"ORG_ADMIN\":\n return \"bg-accent-indigo-subtle text-accent-indigo\";\n case \"WORKSPACE_ADMIN\":\n return \"bg-accent-cyan-subtle text-accent-cyan\";\n case \"MEMBER\":\n return \"bg-status-success-bg-subtle text-status-success-text\";\n case \"GUEST\":\n return \"bg-bg-sunken text-text-primary\";\n default:\n return \"bg-bg-sunken text-text-primary\";\n }\n };\n\n const getStatusColor = (status: UserStatus) => {\n switch (status) {\n case \"ACTIVE\":\n return \"bg-status-success-bg-subtle text-status-success-text\";\n case \"INACTIVE\":\n return \"bg-status-warning-bg-subtle text-status-warning-text\";\n case \"SUSPENDED\":\n return \"bg-status-warning-bg-subtle text-status-warning-text\";\n case \"DELETED\":\n return \"bg-status-error-bg-subtle text-status-error-text\";\n default:\n return \"bg-bg-sunken text-text-primary\";\n }\n };\n\n // Authentication check\n if (!isAuthenticated) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <IllustratedEmptyState\n illustration=\"empty-generic\"\n title={tr(\"auth.users.authRequired\", \"Authentication Required\")}\n description={tr(\n \"auth.users.signInToManage\",\n \"Please sign in to manage users\",\n )}\n />\n </div>\n );\n }\n\n // Loading permissions\n if (permissionsLoading) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <div className=\"text-center py-16\">\n <SpinnerIcon className=\"size-8 mx-auto text-text-secondary animate-spin\" />\n <p className=\"mt-4 text-text-secondary\">\n {tr(\"auth.users.loadingPermissions\", \"Loading permissions...\")}\n </p>\n </div>\n </div>\n );\n }\n\n // Authorization check - user needs user:read permission\n if (!canViewUsers || isUnauthorized) {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n <IllustratedEmptyState\n illustration=\"empty-generic\"\n title={tr(\"auth.users.adminAccessRequired\", \"Admin Access Required\")}\n description={\n <>\n {tr(\n \"auth.users.adminAccessDesc\",\n \"You need administrator privileges to view and manage users.\",\n )}{\" \"}\n {tr(\n \"auth.users.requiredRoles\",\n \"Required roles: Super Admin, Tenant Admin, or Org Admin\",\n )}\n </>\n }\n />\n </div>\n );\n }\n\n // List view\n if (viewMode === \"list\") {\n return (\n <div className=\"max-w-6xl mx-auto p-6\">\n {pendingActionDialog}\n {/* Header */}\n <div className=\"flex items-center justify-between mb-8\">\n <div>\n <h1 className=\"text-3xl font-semibold text-text-primary\">\n {tr(\"auth.users.title\", \"Users\")}\n </h1>\n <p className=\"text-text-secondary mt-2\">\n {tr(\"auth.users.subtitle\", \"Manage users in your organization\")} (\n {totalCount} {tr(\"auth.users.paginationUsers\", \"total\")})\n </p>\n </div>\n {/* Export button */}\n <button\n type=\"button\"\n onClick={() => void handleExport()}\n disabled={isExporting}\n aria-label={tr(\"auth.users.exportAriaLabel\", \"Export user list\")}\n className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n >\n {isExporting ? (\n <>\n <SpinnerIcon\n className=\"size-4 animate-spin\"\n aria-hidden=\"true\"\n />\n {tr(\"auth.users.exporting\", \"Exporting...\")}\n </>\n ) : (\n <>\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n />\n </svg>\n {tr(\"auth.users.export\", \"Export\")}\n </>\n )}\n </button>\n </div>\n\n <PagePurpose className=\"mb-6\">\n {tr(\n \"auth.users.purpose\",\n \"Manage everyone with access to your organization. Search and filter accounts, review their role and status, edit details, or deactivate people who should no longer have access.\",\n )}\n </PagePurpose>\n\n {/* Emphasis: directory summary — the one highlighted zone */}\n <EmphasisPanel className=\"mb-6\">\n <p className=\"text-sm font-medium text-text-secondary\">\n {tr(\"auth.users.summaryLabel\", \"People in this organization\")}\n </p>\n <p className=\"mt-1 text-3xl font-semibold text-text-primary\">\n {totalCount}\n </p>\n <p className=\"mt-1 text-sm text-text-secondary\">\n {tr(\n \"auth.users.summaryHint\",\n \"Use the filters below to find a specific person or role.\",\n )}\n </p>\n </EmphasisPanel>\n\n {/* Live region for status announcements */}\n <div aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n {successMessage}\n </div>\n <div\n role=\"alert\"\n aria-live=\"assertive\"\n aria-atomic=\"true\"\n className=\"sr-only\"\n >\n {error}\n </div>\n\n {/* Success Message */}\n {successMessage && (\n <output\n id={successId}\n className=\"block mb-6 p-4 rounded-xl bg-status-success-bg-subtle border border-status-success-border\"\n >\n <p className=\"text-status-success-text\">{successMessage}</p>\n <button\n type=\"button\"\n onClick={() => setSuccessMessage(null)}\n className=\"mt-2 text-sm text-status-success-text hover:underline\"\n >\n {tr(\"auth.users.dismiss\", \"Dismiss\")}\n </button>\n </output>\n )}\n\n {/* Error Message */}\n {error && (\n <div\n id={errorId}\n role=\"alert\"\n className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n >\n <AlertIcon\n className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n aria-hidden=\"true\"\n />\n <div className=\"flex-1\">\n <p className=\"text-sm text-status-error-text\">{error}</p>\n <button\n type=\"button\"\n onClick={() => setError(null)}\n className=\"mt-2 text-sm text-status-error-text hover:underline\"\n >\n {tr(\"auth.users.dismiss\", \"Dismiss\")}\n </button>\n </div>\n </div>\n )}\n\n {/* Filters */}\n <div className=\"mb-6 p-4 rounded-xl border border-border-subtle bg-bg-surface\">\n <div className=\"flex flex-wrap gap-4 items-end\">\n {/* Visually hidden labels satisfy WCAG — placeholders are not labels */}\n <div className=\"flex-1 min-w-[200px]\">\n <label htmlFor={searchId} className=\"sr-only\">\n {tr(\"auth.users.searchLabel\", \"Search users\")}\n </label>\n <input\n id={searchId}\n type=\"search\"\n aria-label={tr(\"auth.users.searchLabel\", \"Search users\")}\n placeholder={tr(\n \"auth.users.searchPlaceholder\",\n \"Search by email, username, or name...\",\n )}\n value={searchQuery}\n onChange={(e) => {\n setSearchQuery(e.target.value);\n setCurrentPage(0);\n }}\n className=\"w-full px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary placeholder-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n <div>\n <label htmlFor={roleFilterId} className=\"sr-only\">\n {tr(\"auth.users.filterRoleLabel\", \"Filter by role\")}\n </label>\n <select\n id={roleFilterId}\n value={filterRole}\n onChange={(e) => {\n setFilterRole(e.target.value as UserRole | \"\");\n setCurrentPage(0);\n }}\n className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n <option value=\"\">\n {tr(\"auth.users.allRoles\", \"All Roles\")}\n </option>\n {USER_ROLES.map((role) => (\n <option key={role} value={role}>\n {role.replace(\"_\", \" \")}\n </option>\n ))}\n </select>\n </div>\n <div>\n <label htmlFor={statusFilterId} className=\"sr-only\">\n {tr(\"auth.users.filterStatusLabel\", \"Filter by status\")}\n </label>\n <select\n id={statusFilterId}\n value={filterStatus}\n onChange={(e) => {\n setFilterStatus(e.target.value as UserStatus | \"\");\n setCurrentPage(0);\n }}\n className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n <option value=\"\">\n {tr(\"auth.users.allStatuses\", \"All Statuses\")}\n </option>\n {USER_STATUSES.map((status) => (\n <option key={status} value={status}>\n {status}\n </option>\n ))}\n </select>\n </div>\n </div>\n </div>\n\n {isLoading ? (\n <div\n aria-live=\"polite\"\n aria-busy=\"true\"\n className=\"flex items-center justify-center py-12\"\n >\n <SpinnerIcon\n className=\"size-8 text-text-link animate-spin\"\n aria-hidden=\"true\"\n />\n <span className=\"ml-3 text-text-secondary\">\n {tr(\"auth.users.loadingUsers\", \"Loading users...\")}\n </span>\n </div>\n ) : users.length === 0 ? (\n <IllustratedEmptyState\n illustration={\n searchQuery || filterRole || filterStatus\n ? \"empty-search\"\n : \"empty-people\"\n }\n title={tr(\"auth.users.noUsersFound\", \"No users found\")}\n description={\n searchQuery || filterRole || filterStatus\n ? tr(\n \"auth.users.noUsersFilteredDesc\",\n \"No users match your current search or filters. Try clearing them to see everyone.\",\n )\n : tr(\n \"auth.users.noUsersDesc\",\n \"Once people join your organization they'll show up here for you to manage.\",\n )\n }\n />\n ) : (\n <>\n {/* Users Table */}\n <div className=\"rounded-xl border border-border-subtle bg-bg-surface overflow-hidden shadow-sm\">\n <div className=\"overflow-x-auto\">\n <table\n className=\"w-full min-w-[800px]\"\n aria-label={tr(\"auth.users.tableAriaLabel\", \"Users table\")}\n >\n <thead>\n <tr className=\"border-b border-border-subtle bg-bg-canvas\">\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[280px]\"\n >\n {tr(\"auth.users.columnUser\", \"User\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[130px]\"\n >\n {tr(\"auth.users.columnRole\", \"Role\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n >\n {tr(\"auth.users.columnStatus\", \"Status\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[80px]\"\n >\n {tr(\"auth.users.columnVerified\", \"Verified\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n >\n {tr(\"auth.users.columnLastLogin\", \"Last Login\")}\n </th>\n <th\n scope=\"col\"\n className=\"text-right p-4 text-sm font-medium text-text-secondary w-[180px]\"\n >\n {tr(\"auth.users.columnActions\", \"Actions\")}\n </th>\n </tr>\n </thead>\n <tbody>\n {users.map((user) => (\n <tr\n key={user.id}\n className=\"border-b border-border-subtle last:border-b-0 hover:bg-bg-sunken/50 transition-colors\"\n >\n <td className=\"p-4\">\n <div className=\"flex items-center gap-3 min-w-0\">\n <div className=\"auth-brand-badge flex size-10 shrink-0 items-center justify-center rounded-full font-medium\">\n {(user.name || user.username || user.email)\n .charAt(0)\n .toUpperCase()}\n </div>\n <div className=\"min-w-0 flex-1\">\n <p className=\"font-medium text-text-primary truncate\">\n {user.name || user.username}\n </p>\n <p className=\"text-sm text-text-secondary truncate\">\n {user.email}\n </p>\n </div>\n </div>\n </td>\n <td className=\"p-4\">\n <span\n className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getRoleColor(user.role)}`}\n >\n {user.role.replace(\"_\", \" \")}\n </span>\n </td>\n <td className=\"p-4\">\n <span\n className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getStatusColor(user.status)}`}\n >\n {user.status}\n </span>\n </td>\n <td className=\"p-4\">\n {user.emailVerified ? (\n <span className=\"inline-flex items-center gap-1 text-status-success-text whitespace-nowrap\">\n <svg\n className=\"size-4 flex-shrink-0\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n clipRule=\"evenodd\"\n />\n </svg>\n <span className=\"text-sm\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n </span>\n ) : (\n <span className=\"inline-flex items-center gap-1 text-status-warning-text whitespace-nowrap\">\n <svg\n className=\"size-4 flex-shrink-0\"\n fill=\"currentColor\"\n viewBox=\"0 0 20 20\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n clipRule=\"evenodd\"\n />\n </svg>\n <span className=\"text-sm\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n </span>\n )}\n </td>\n <td className=\"p-4 text-sm text-text-secondary whitespace-nowrap\">\n {user.lastLoginAt\n ? new Date(user.lastLoginAt).toLocaleDateString()\n : tr(\"auth.users.lastLoginNever\", \"Never\")}\n </td>\n <td className=\"p-4\">\n <div className=\"flex justify-end gap-1.5 flex-nowrap\">\n <button\n type=\"button\"\n onClick={() => navigate(`/auth/users/${user.id}`)}\n aria-label={`${tr(\"auth.users.actionView\", \"View\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionView\", \"View\")}\n </button>\n {canUpdateUsers && (\n <button\n type=\"button\"\n onClick={() => startEdit(user)}\n aria-label={`${tr(\"auth.users.actionEdit\", \"Edit\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-info-border text-text-link bg-bg-surface hover:bg-status-info-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionEdit\", \"Edit\")}\n </button>\n )}\n {canDeleteUsers && user.status !== \"DELETED\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({ type: \"deactivate\", user })\n }\n aria-label={`${tr(\"auth.users.actionDelete\", \"Delete\")} ${user.name || user.username || user.email}`}\n className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-error-border text-status-error-text bg-bg-surface hover:bg-status-error-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n >\n {tr(\"auth.users.actionDelete\", \"Delete\")}\n </button>\n )}\n </div>\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n </div>\n\n {/* Pagination */}\n <div className=\"mt-6 flex items-center justify-between\">\n <p className=\"text-sm text-text-secondary\">\n {tr(\"auth.users.showing\", \"Showing\")}{\" \"}\n {currentPage * pageSize + 1} {tr(\"auth.users.to\", \"to\")}{\" \"}\n {Math.min((currentPage + 1) * pageSize, totalCount)}{\" \"}\n {tr(\"auth.users.of\", \"of\")} {totalCount}{\" \"}\n {tr(\"auth.users.paginationUsers\", \"users\")}\n </p>\n <nav\n aria-label={tr(\n \"auth.users.paginationAriaLabel\",\n \"User list pagination\",\n )}\n >\n <div className=\"flex gap-2\">\n <button\n type=\"button\"\n onClick={() =>\n setCurrentPage((prev) => Math.max(0, prev - 1))\n }\n disabled={currentPage === 0}\n aria-label={tr(\n \"auth.users.previousPageAriaLabel\",\n \"Go to previous page\",\n )}\n className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.previousPage\", \"Previous\")}\n </button>\n <button\n type=\"button\"\n onClick={() => setCurrentPage((prev) => prev + 1)}\n disabled={!hasMore}\n aria-label={tr(\n \"auth.users.nextPageAriaLabel\",\n \"Go to next page\",\n )}\n className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.nextPage\", \"Next\")}\n </button>\n </div>\n </nav>\n </div>\n\n <NextSteps\n className=\"mt-8\"\n storageKey=\"auth-users\"\n steps={[\n {\n id: \"search-user\",\n label: tr(\"auth.users.nextSearch\", \"Find a specific person\"),\n description: tr(\n \"auth.users.nextSearchDesc\",\n \"Use the search and role / status filters above to narrow the list.\",\n ),\n onClick: () => {\n const el = document.getElementById(searchId);\n if (el instanceof HTMLInputElement) el.focus();\n },\n },\n {\n id: \"export-users\",\n label: tr(\"auth.users.nextExport\", \"Export the user list\"),\n description: tr(\n \"auth.users.nextExportDesc\",\n \"Download a CSV of users matching your current filters.\",\n ),\n onClick: () => void handleExport(),\n },\n ]}\n />\n </>\n )}\n </div>\n );\n }\n\n // View details\n if (viewMode === \"view\" && selectedUser) {\n return (\n <div className=\"max-w-4xl mx-auto p-6\">\n {pendingActionDialog}\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n >\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n />\n </svg>\n {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n </button>\n\n <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n <div className=\"flex items-center gap-4 mb-8\">\n <div className=\"auth-brand-badge flex size-20 items-center justify-center rounded-full text-3xl font-semibold\">\n {(\n selectedUser.name ||\n selectedUser.username ||\n selectedUser.email\n )\n .charAt(0)\n .toUpperCase()}\n </div>\n <div>\n <h1 className=\"text-2xl font-semibold text-text-primary\">\n {selectedUser.name || selectedUser.username}\n </h1>\n <p className=\"text-text-secondary\">{selectedUser.email}</p>\n <div className=\"flex items-center gap-2 mt-2\">\n <span\n className={`px-2.5 py-1 rounded-full text-xs font-medium ${getRoleColor(selectedUser.role)}`}\n >\n {selectedUser.role.replace(\"_\", \" \")}\n </span>\n <span\n className={`px-2.5 py-1 rounded-full text-xs font-medium ${getStatusColor(selectedUser.status)}`}\n >\n {selectedUser.status}\n </span>\n </div>\n </div>\n </div>\n\n <div className=\"grid grid-cols-2 gap-6\">\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsUsername\", \"Username\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.username}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsEmail\", \"Email\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.email}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsEmailVerified\", \"Email Verified\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.emailVerified ? (\n <span className=\"text-status-success-text\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n ) : (\n <span className=\"text-status-warning-text\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n )}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsMfaEnabled\", \"MFA Enabled\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.mfaEnabled ? (\n <span className=\"text-status-success-text\">\n {tr(\"auth.users.verifiedYes\", \"Yes\")}\n </span>\n ) : (\n <span className=\"text-text-secondary\">\n {tr(\"auth.users.verifiedNo\", \"No\")}\n </span>\n )}\n </p>\n </div>\n\n {selectedUser.phoneNumber && (\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsPhoneNumber\", \"Phone Number\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.phoneNumber}\n </p>\n </div>\n )}\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsLastLogin\", \"Last Login\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {selectedUser.lastLoginAt\n ? new Date(selectedUser.lastLoginAt).toLocaleString()\n : tr(\"auth.users.lastLoginNever\", \"Never\")}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsCreated\", \"Created\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {new Date(selectedUser.createdAt).toLocaleString()}\n </p>\n </div>\n\n <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n {tr(\"auth.users.viewDetailsLastUpdated\", \"Last Updated\")}\n </label>\n <p className=\"text-text-primary font-medium\">\n {new Date(selectedUser.updatedAt).toLocaleString()}\n </p>\n </div>\n </div>\n\n <div className=\"mt-8 pt-6 border-t border-border-subtle flex gap-3\">\n <Button\n type=\"button\"\n onClick={() => startEdit(selectedUser)}\n variant=\"default\"\n className=\"font-semibold\"\n >\n {tr(\"auth.users.editUser\", \"Edit User\")}\n </Button>\n {selectedUser.status !== \"DELETED\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({ type: \"deactivate\", user: selectedUser })\n }\n className=\"px-4 py-2.5 rounded-xl border border-status-error-border text-status-error-text font-medium hover:bg-status-error-bg-subtle transition-colors\"\n >\n {tr(\"auth.users.deleteUser\", \"Delete User\")}\n </button>\n )}\n {canDeleteUsers &&\n selectedUser.status === \"DELETED\" &&\n currentUser?.role === \"SUPER_ADMIN\" && (\n <button\n type=\"button\"\n onClick={() =>\n setPendingAction({\n type: \"hard-delete\",\n user: selectedUser,\n })\n }\n className=\"px-4 py-2.5 rounded-xl bg-status-error-bg text-white font-medium hover:bg-status-error-bg-hover transition-colors\"\n >\n {tr(\"auth.users.permanentlyDelete\", \"Permanently Delete\")}\n </button>\n )}\n </div>\n </div>\n </div>\n );\n }\n\n // Edit form\n return (\n <div className=\"max-w-2xl mx-auto p-6\">\n {pendingActionDialog}\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n >\n <svg\n className=\"size-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n />\n </svg>\n {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n </button>\n\n <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n <h1 className=\"text-2xl font-semibold text-text-primary mb-2\">\n {tr(\"auth.users.editUser\", \"Edit User\")}\n </h1>\n\n {selectedUser && (\n <p className=\"text-text-secondary mb-6\">\n {tr(\"auth.users.editingUser\", \"Editing:\")}{\" \"}\n <strong>{selectedUser.email}</strong>\n </p>\n )}\n\n {error && (\n <div className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\">\n <AlertIcon className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n <div className=\"flex-1\">\n <p className=\"text-sm text-status-error-text\">{error}</p>\n </div>\n </div>\n )}\n\n <form\n onSubmit={handleUpdate}\n className=\"space-y-6\"\n aria-describedby={error ? errorId : undefined}\n noValidate\n >\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-username\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldUsername\", \"Username\")}\n </label>\n <input\n id=\"edit-username\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldUsername\", \"Username\")}\n value={formData.username}\n onChange={(e) =>\n setFormData({ ...formData, username: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n\n <div>\n <label\n htmlFor=\"edit-name\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldName\", \"Name\")}\n </label>\n <input\n id=\"edit-name\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldName\", \"Name\")}\n value={formData.name}\n onChange={(e) =>\n setFormData({ ...formData, name: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n </div>\n\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-firstName\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldFirstName\", \"First Name\")}\n </label>\n <input\n id=\"edit-firstName\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldFirstName\", \"First Name\")}\n value={formData.firstName}\n onChange={(e) =>\n setFormData({ ...formData, firstName: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n\n <div>\n <label\n htmlFor=\"edit-lastName\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldLastName\", \"Last Name\")}\n </label>\n <input\n id=\"edit-lastName\"\n type=\"text\"\n aria-label={tr(\"auth.users.fieldLastName\", \"Last Name\")}\n value={formData.lastName}\n onChange={(e) =>\n setFormData({ ...formData, lastName: e.target.value })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n </div>\n </div>\n\n <div>\n <label\n htmlFor=\"edit-phoneNumber\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n </label>\n <input\n id=\"edit-phoneNumber\"\n type=\"tel\"\n aria-label={tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n aria-invalid={phoneError ? true : undefined}\n aria-describedby={\n phoneError ? \"edit-phoneNumber-error\" : undefined\n }\n value={formData.phoneNumber}\n onChange={(e) => {\n setFormData({ ...formData, phoneNumber: e.target.value });\n if (phoneError) {\n setPhoneError(null);\n setError(null);\n }\n }}\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n />\n {phoneError && (\n <p\n id=\"edit-phoneNumber-error\"\n role=\"alert\"\n className=\"mt-2 text-sm text-[var(--color-status-error-text)]\"\n >\n {phoneError}\n </p>\n )}\n </div>\n\n <div className=\"grid grid-cols-2 gap-4\">\n <div>\n <label\n htmlFor=\"edit-role\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldRole\", \"Role\")}\n </label>\n <select\n id=\"edit-role\"\n aria-label={tr(\"auth.users.fieldRole\", \"Role\")}\n value={formData.role}\n onChange={(e) =>\n setFormData({ ...formData, role: e.target.value as UserRole })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n {USER_ROLES.map((role) => (\n <option key={role} value={role}>\n {role.replace(\"_\", \" \")}\n </option>\n ))}\n </select>\n </div>\n\n <div>\n <label\n htmlFor=\"edit-status\"\n className=\"block text-sm font-medium text-text-primary mb-2\"\n >\n {tr(\"auth.users.fieldStatus\", \"Status\")}\n </label>\n <select\n id=\"edit-status\"\n aria-label={tr(\"auth.users.fieldStatus\", \"Status\")}\n value={formData.status}\n onChange={(e) =>\n setFormData({\n ...formData,\n status: e.target.value as UserStatus,\n })\n }\n className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n {USER_STATUSES.map((status) => (\n <option key={status} value={status}>\n {status}\n </option>\n ))}\n </select>\n </div>\n </div>\n\n <div className=\"flex items-center gap-3 p-4 rounded-xl bg-bg-canvas/50\">\n <input\n type=\"checkbox\"\n id=\"emailVerified\"\n checked={formData.emailVerified}\n onChange={(e) =>\n setFormData({ ...formData, emailVerified: e.target.checked })\n }\n className=\"size-5 rounded border-border-default text-text-link focus:ring-action-primary-bg\"\n />\n <label\n htmlFor=\"emailVerified\"\n className=\"text-sm font-medium text-text-primary\"\n >\n {tr(\"auth.users.fieldEmailVerified\", \"Email Verified\")}\n </label>\n </div>\n\n <div className=\"flex gap-3 pt-6 mt-6 border-t border-border-default\">\n <Button\n type=\"submit\"\n disabled={isLoading}\n variant=\"default\"\n size=\"lg\"\n className=\"font-semibold\"\n >\n {isLoading ? (\n <>\n <SpinnerIcon className=\"size-4 animate-spin\" />\n {tr(\"auth.users.saving\", \"Saving...\")}\n </>\n ) : (\n tr(\"auth.users.saveChanges\", \"Save Changes\")\n )}\n </Button>\n <button\n type=\"button\"\n onClick={() => {\n setViewMode(\"list\");\n resetForm();\n }}\n className=\"inline-flex items-center h-10 px-8 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors\"\n >\n {tr(\"auth.users.cancel\", \"Cancel\")}\n </button>\n </div>\n </form>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
|
package/dist/microfe-auth.css
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono:"JetBrains Mono", ui-monospace, monospace;--color-indigo-500:oklch(58.5% .233 277.117);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-widest:.1em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--blur-3xl:64px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--radius:.5rem;--color-primary:var(--color-action-primary-bg,#2563eb);--color-primary-foreground:var(--color-action-primary-text,#fff)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:0}.inset-y-0{inset-block:0}.-top-40{top:calc(var(--spacing) * -40)}.top-0{top:0}.top-1\/2{top:50%}.top-4{top:calc(var(--spacing) * 4)}.top-full{top:100%}.-right-20{right:calc(var(--spacing) * -20)}.right-0{right:0}.right-4{right:calc(var(--spacing) * 4)}.-bottom-40{bottom:calc(var(--spacing) * -40)}.bottom-0{bottom:0}.-left-40{left:calc(var(--spacing) * -40)}.left-0{left:0}.left-1\/4{left:25%}.z-10{z-index:10}.z-50{z-index:50}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-8{margin-block:calc(var(--spacing) * 8)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-3{margin-left:calc(var(--spacing) * 3)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-14{width:calc(var(--spacing) * 14);height:calc(var(--spacing) * 14)}.size-16{width:calc(var(--spacing) * 16);height:calc(var(--spacing) * 16)}.size-20{width:calc(var(--spacing) * 20);height:calc(var(--spacing) * 20)}.size-48{width:calc(var(--spacing) * 48);height:calc(var(--spacing) * 48)}.size-72{width:calc(var(--spacing) * 72);height:calc(var(--spacing) * 72)}.size-80{width:calc(var(--spacing) * 80);height:calc(var(--spacing) * 80)}.size-96{width:calc(var(--spacing) * 96);height:calc(var(--spacing) * 96)}.size-full{width:100%;height:100%}.h-0\.5{height:calc(var(--spacing) * .5)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-full{height:100%}.min-h-\[400px\]{min-height:400px}.min-h-screen{min-height:100vh}.w-1\/4{width:25%}.w-2\/4{width:50%}.w-3\/4{width:75%}.w-10{width:calc(var(--spacing) * 10)}.w-48{width:calc(var(--spacing) * 48)}.w-64{width:calc(var(--spacing) * 64)}.w-\[80px\]{width:80px}.w-\[100px\]{width:100px}.w-\[130px\]{width:130px}.w-\[180px\]{width:180px}.w-\[280px\]{width:280px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.min-w-\[200px\]{min-width:200px}.min-w-\[800px\]{min-width:800px}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:var(--radius)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--color-accent-primary\)\]{border-color:var(--color-accent-primary)}.border-\[var\(--color-border-default\)\]{border-color:var(--color-border-default)}.border-\[var\(--color-border-primary\)\]{border-color:var(--color-border-primary)}.border-\[var\(--color-border-subtle\)\]{border-color:var(--color-border-subtle)}.border-\[var\(--color-status-error-border\)\]{border-color:var(--color-status-error-border)}.border-\[var\(--color-status-success-border\)\]{border-color:var(--color-status-success-border)}.border-\[var\(--color-status-warning-border\)\]{border-color:var(--color-status-warning-border)}.border-primary{border-color:var(--color-primary)}.border-t-transparent{border-top-color:#0000}.bg-\[var\(--color-accent-primary\)\]{background-color:var(--color-accent-primary)}.bg-\[var\(--color-action-primary-bg\)\]{background-color:var(--color-action-primary-bg)}.bg-\[var\(--color-action-secondary-bg-subtle\)\]{background-color:var(--color-action-secondary-bg-subtle)}.bg-\[var\(--color-background-base\)\]{background-color:var(--color-background-base)}.bg-\[var\(--color-bg-accent\)\]{background-color:var(--color-bg-accent)}.bg-\[var\(--color-bg-canvas\)\]{background-color:var(--color-bg-canvas)}.bg-\[var\(--color-bg-disabled\)\]{background-color:var(--color-bg-disabled)}.bg-\[var\(--color-bg-muted\)\]{background-color:var(--color-bg-muted)}.bg-\[var\(--color-bg-sunken\)\]{background-color:var(--color-bg-sunken)}.bg-\[var\(--color-bg-surface\)\]{background-color:var(--color-bg-surface)}.bg-\[var\(--color-status-error-bg\)\]{background-color:var(--color-status-error-bg)}.bg-\[var\(--color-status-error-bg-subtle\)\]{background-color:var(--color-status-error-bg-subtle)}.bg-\[var\(--color-status-error-subtle\)\]{background-color:var(--color-status-error-subtle)}.bg-\[var\(--color-status-info-bg-subtle\)\]{background-color:var(--color-status-info-bg-subtle)}.bg-\[var\(--color-status-success-bg-subtle\)\]{background-color:var(--color-status-success-bg-subtle)}.bg-\[var\(--color-status-success-subtle\)\]{background-color:var(--color-status-success-subtle)}.bg-\[var\(--color-status-warning-bg\)\]{background-color:var(--color-status-warning-bg)}.bg-\[var\(--color-status-warning-bg-subtle\)\]{background-color:var(--color-status-warning-bg-subtle)}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab, red, red)){.bg-black\/40{background-color:color-mix(in oklab, var(--color-black) 40%, transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.bg-primary,.bg-primary\/5{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/5{background-color:color-mix(in oklab, var(--color-primary) 5%, transparent)}}.bg-primary\/10{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/10{background-color:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.bg-primary\/15{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/15{background-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-12{padding:calc(var(--spacing) * 12)}.px-1{padding-inline:var(--spacing)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-12{padding-top:calc(var(--spacing) * 12)}.pr-3\.5{padding-right:calc(var(--spacing) * 3.5)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-\[3\.5rem\]{padding-left:3.5rem}.pl-\[3\.25rem\]{padding-left:3.25rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--color-accent-primary\)\]{color:var(--color-accent-primary)}.text-\[var\(--color-action-primary-bg\)\]{color:var(--color-action-primary-bg)}.text-\[var\(--color-action-primary-text\)\]{color:var(--color-action-primary-text)}.text-\[var\(--color-action-secondary-text\)\]{color:var(--color-action-secondary-text)}.text-\[var\(--color-status-error\)\]{color:var(--color-status-error)}.text-\[var\(--color-status-error-text\)\]{color:var(--color-status-error-text)}.text-\[var\(--color-status-info-text\)\]{color:var(--color-status-info-text)}.text-\[var\(--color-status-success\)\]{color:var(--color-status-success)}.text-\[var\(--color-status-success-text\)\]{color:var(--color-status-success-text)}.text-\[var\(--color-status-warning-text\)\]{color:var(--color-status-warning-text)}.text-\[var\(--color-text-disabled\)\]{color:var(--color-text-disabled)}.text-\[var\(--color-text-inverse\)\]{color:var(--color-text-inverse)}.text-\[var\(--color-text-link\)\]{color:var(--color-text-link)}.text-\[var\(--color-text-primary\)\]{color:var(--color-text-primary)}.text-\[var\(--color-text-secondary\)\]{color:var(--color-text-secondary)}.text-\[var\(--color-text-tertiary\)\]{color:var(--color-text-tertiary)}.text-primary{color:var(--color-primary)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.placeholder-\[var\(--color-text-secondary\)\]::placeholder{color:var(--color-text-secondary)}.opacity-0{opacity:0}.opacity-5{opacity:.05}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.blur-3xl{--tw-blur:blur(var(--blur-3xl));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}@media (hover:hover){.group-hover\:bg-\[var\(--color-action-primary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-primary-bg-subtle)}.group-hover\:bg-\[var\(--color-action-secondary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-secondary-bg-subtle)}.group-hover\:text-\[var\(--color-text-primary\)\]:is(:where(.group):hover *){color:var(--color-text-primary)}.group-hover\:text-indigo-500:is(:where(.group):hover *){color:var(--color-indigo-500)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.placeholder\:text-\[var\(--color-text-tertiary\)\]::placeholder{color:var(--color-text-tertiary)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-\[var\(--color-action-primary-border\)\]:hover{border-color:var(--color-action-primary-border)}.hover\:border-\[var\(--color-action-secondary-border\)\]:hover{border-color:var(--color-action-secondary-border)}.hover\:border-\[var\(--color-border-strong\)\]:hover{border-color:var(--color-border-strong)}.hover\:bg-\[var\(--color-accent-primary-hover\)\]:hover{background-color:var(--color-accent-primary-hover)}.hover\:bg-\[var\(--color-action-primary-bgHover\)\]:hover{background-color:var(--color-action-primary-bgHover)}.hover\:bg-\[var\(--color-bg-muted\)\]:hover{background-color:var(--color-bg-muted)}.hover\:bg-\[var\(--color-bg-subtle\)\]:hover{background-color:var(--color-bg-subtle)}.hover\:bg-\[var\(--color-bg-sunken\)\]:hover{background-color:var(--color-bg-sunken)}.hover\:bg-\[var\(--color-status-error-bg-subtle\)\]:hover{background-color:var(--color-status-error-bg-subtle)}.hover\:bg-primary\/90:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--color-primary) 90%, transparent)}}.hover\:text-\[var\(--color-text-primary\)\]:hover{color:var(--color-text-primary)}.hover\:text-\[var\(--color-text-secondary\)\]:hover{color:var(--color-text-secondary)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:border-primary:focus{border-color:var(--color-primary)}.focus\:border-transparent:focus{border-color:#0000}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--color-accent-primary\)\]:focus{--tw-ring-color:var(--color-accent-primary)}.focus\:ring-primary\/20:focus{--tw-ring-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (width>=40rem){.sm\:not-sr-only{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.sm\:top-6{top:calc(var(--spacing) * 6)}.sm\:right-6{right:calc(var(--spacing) * 6)}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:h-14{height:calc(var(--spacing) * 14)}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:p-12{padding:calc(var(--spacing) * 12)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}@media (width>=48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}}@media (width>=64rem){.lg\:col-span-1{grid-column:span 1/span 1}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:w-1\/2{width:50%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:text-left{text-align:left}}}.dark{--color-background:#020817;--color-foreground:#f8fafc;--color-card:#020817;--color-card-foreground:#020817;--color-popover:#020817;--color-popover-foreground:#020817;--color-primary:var(--color-action-primary-bg,#3b82f6);--color-primary-foreground:var(--color-action-primary-text,#0f172a);--color-ring:var(--color-action-primary-bg,#3b82f6);--color-secondary:#1e293b;--color-secondary-foreground:#f8fafc;--color-muted:#1e293b;--color-muted-foreground:#94a3b8;--color-accent:#1e293b;--color-accent-foreground:#f8fafc;--color-destructive:#7f1d1d;--color-destructive-foreground:#f8fafc;--color-border:#1e293b;--color-input:#1e293b}body{font-feature-settings:"rlig" 1, "calt" 1}.auth-primary-button{background:var(--color-action-primary-bg);color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg);border-radius:.75rem}@supports (color:color-mix(in lab, red, red)){.auth-primary-button{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 24%, transparent)}}.auth-primary-button{transition:opacity .16s,transform .16s,box-shadow .16s,background-color .16s}.auth-primary-button:hover{opacity:.96;box-shadow:0 16px 36px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:hover{box-shadow:0 16px 36px color-mix(in srgb, var(--color-action-primary-bg) 30%, transparent)}}.auth-primary-button:focus-visible{outline:2px solid var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:focus-visible{outline:2px solid color-mix(in srgb, var(--color-action-primary-bg) 45%, transparent)}}.auth-primary-button:focus-visible{outline-offset:2px}.auth-primary-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.auth-brand-badge{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-action-primary-bg) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 92%, white 8%) 0%, color-mix(in srgb, var(--color-action-primary-bg) 72%, var(--color-bg-surface) 28%) 100%)}}.auth-brand-badge{color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 22%, transparent)}}.auth-brand-panel{background:radial-gradient(circle at top left, var(--color-action-primary-bg) 0%, transparent 35%), radial-gradient(circle at bottom right, var(--color-text-link) 0%, transparent 38%), linear-gradient(135deg, var(--color-bg-surface) 0%, var(--color-bg-canvas) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-panel{background:radial-gradient(circle at top left, color-mix(in srgb, var(--color-action-primary-bg) 20%, transparent) 0%, transparent 35%), radial-gradient(circle at bottom right, color-mix(in srgb, var(--color-text-link) 18%, transparent) 0%, transparent 38%), linear-gradient(135deg, color-mix(in srgb, var(--color-bg-surface) 92%, black 8%) 0%, color-mix(in srgb, var(--color-bg-canvas) 70%, black 30%) 100%)}}.auth-brand-panel,.auth-brand-copy{color:var(--color-text-primary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy{color:color-mix(in srgb, var(--color-text-primary) 88%, white 12%)}}.auth-brand-copy-muted{color:var(--color-text-secondary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy-muted{color:color-mix(in srgb, var(--color-text-secondary) 75%, white 25%)}}.auth-highlight-chip{background:var(--color-bg-surface)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{background:color-mix(in srgb, var(--color-bg-surface) 84%, transparent)}}.auth-highlight-chip{border:1px solid var(--color-border-subtle)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{border:1px solid color-mix(in srgb, var(--color-border-subtle) 65%, transparent)}}.auth-highlight-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.auth-shell-gradient{background:linear-gradient(180deg, var(--color-bg-canvas) 0%, var(--color-bg-surface) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-shell-gradient{background:linear-gradient(180deg, color-mix(in srgb, var(--color-bg-canvas) 96%, transparent) 0%, color-mix(in srgb, var(--color-bg-surface) 96%, transparent) 100%)}}.auth-hero-card{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-text-link) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 90%, transparent) 0%, color-mix(in srgb, var(--color-text-link) 70%, var(--color-action-primary-bg) 30%) 100%)}}.auth-hero-card{color:var(--color-action-primary-text);box-shadow:0 18px 42px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{box-shadow:0 18px 42px color-mix(in srgb, var(--color-action-primary-bg) 26%, transparent)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono:"JetBrains Mono", ui-monospace, monospace;--color-indigo-500:oklch(58.5% .233 277.117);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-widest:.1em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--blur-3xl:64px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--radius:.5rem;--color-primary:var(--color-action-primary-bg,#2563eb);--color-primary-foreground:var(--color-action-primary-text,#fff)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:0}.inset-y-0{inset-block:0}.-top-40{top:calc(var(--spacing) * -40)}.top-0{top:0}.top-1\/2{top:50%}.top-4{top:calc(var(--spacing) * 4)}.top-full{top:100%}.-right-20{right:calc(var(--spacing) * -20)}.right-0{right:0}.right-4{right:calc(var(--spacing) * 4)}.-bottom-40{bottom:calc(var(--spacing) * -40)}.bottom-0{bottom:0}.-left-40{left:calc(var(--spacing) * -40)}.left-0{left:0}.left-1\/4{left:25%}.z-10{z-index:10}.z-50{z-index:50}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-8{margin-block:calc(var(--spacing) * 8)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-3{margin-left:calc(var(--spacing) * 3)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-14{width:calc(var(--spacing) * 14);height:calc(var(--spacing) * 14)}.size-16{width:calc(var(--spacing) * 16);height:calc(var(--spacing) * 16)}.size-20{width:calc(var(--spacing) * 20);height:calc(var(--spacing) * 20)}.size-48{width:calc(var(--spacing) * 48);height:calc(var(--spacing) * 48)}.size-72{width:calc(var(--spacing) * 72);height:calc(var(--spacing) * 72)}.size-80{width:calc(var(--spacing) * 80);height:calc(var(--spacing) * 80)}.size-96{width:calc(var(--spacing) * 96);height:calc(var(--spacing) * 96)}.size-full{width:100%;height:100%}.h-0\.5{height:calc(var(--spacing) * .5)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-full{height:100%}.min-h-\[400px\]{min-height:400px}.min-h-screen{min-height:100vh}.w-1\/4{width:25%}.w-2\/4{width:50%}.w-3\/4{width:75%}.w-10{width:calc(var(--spacing) * 10)}.w-48{width:calc(var(--spacing) * 48)}.w-64{width:calc(var(--spacing) * 64)}.w-\[80px\]{width:80px}.w-\[100px\]{width:100px}.w-\[130px\]{width:130px}.w-\[180px\]{width:180px}.w-\[280px\]{width:280px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.min-w-\[200px\]{min-width:200px}.min-w-\[800px\]{min-width:800px}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:var(--radius)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--color-accent-primary\)\]{border-color:var(--color-accent-primary)}.border-\[var\(--color-border-default\)\]{border-color:var(--color-border-default)}.border-\[var\(--color-border-primary\)\]{border-color:var(--color-border-primary)}.border-\[var\(--color-border-subtle\)\]{border-color:var(--color-border-subtle)}.border-\[var\(--color-status-error-border\)\]{border-color:var(--color-status-error-border)}.border-\[var\(--color-status-success-border\)\]{border-color:var(--color-status-success-border)}.border-\[var\(--color-status-warning-border\)\]{border-color:var(--color-status-warning-border)}.border-primary{border-color:var(--color-primary)}.border-t-transparent{border-top-color:#0000}.bg-\[var\(--color-accent-primary\)\]{background-color:var(--color-accent-primary)}.bg-\[var\(--color-action-primary-bg\)\]{background-color:var(--color-action-primary-bg)}.bg-\[var\(--color-action-secondary-bg-subtle\)\]{background-color:var(--color-action-secondary-bg-subtle)}.bg-\[var\(--color-background-base\)\]{background-color:var(--color-background-base)}.bg-\[var\(--color-bg-accent\)\]{background-color:var(--color-bg-accent)}.bg-\[var\(--color-bg-canvas\)\]{background-color:var(--color-bg-canvas)}.bg-\[var\(--color-bg-disabled\)\]{background-color:var(--color-bg-disabled)}.bg-\[var\(--color-bg-muted\)\]{background-color:var(--color-bg-muted)}.bg-\[var\(--color-bg-sunken\)\]{background-color:var(--color-bg-sunken)}.bg-\[var\(--color-bg-surface\)\]{background-color:var(--color-bg-surface)}.bg-\[var\(--color-status-error-bg\)\]{background-color:var(--color-status-error-bg)}.bg-\[var\(--color-status-error-bg-subtle\)\]{background-color:var(--color-status-error-bg-subtle)}.bg-\[var\(--color-status-error-subtle\)\]{background-color:var(--color-status-error-subtle)}.bg-\[var\(--color-status-info-bg-subtle\)\]{background-color:var(--color-status-info-bg-subtle)}.bg-\[var\(--color-status-success-bg-subtle\)\]{background-color:var(--color-status-success-bg-subtle)}.bg-\[var\(--color-status-success-subtle\)\]{background-color:var(--color-status-success-subtle)}.bg-\[var\(--color-status-warning-bg\)\]{background-color:var(--color-status-warning-bg)}.bg-\[var\(--color-status-warning-bg-subtle\)\]{background-color:var(--color-status-warning-bg-subtle)}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab, red, red)){.bg-black\/40{background-color:color-mix(in oklab, var(--color-black) 40%, transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.bg-primary,.bg-primary\/5{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/5{background-color:color-mix(in oklab, var(--color-primary) 5%, transparent)}}.bg-primary\/10{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/10{background-color:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.bg-primary\/15{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/15{background-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-12{padding:calc(var(--spacing) * 12)}.px-1{padding-inline:var(--spacing)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-12{padding-top:calc(var(--spacing) * 12)}.pr-3\.5{padding-right:calc(var(--spacing) * 3.5)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-\[3\.5rem\]{padding-left:3.5rem}.pl-\[3\.25rem\]{padding-left:3.25rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--color-accent-primary\)\]{color:var(--color-accent-primary)}.text-\[var\(--color-action-primary-bg\)\]{color:var(--color-action-primary-bg)}.text-\[var\(--color-action-primary-text\)\]{color:var(--color-action-primary-text)}.text-\[var\(--color-action-secondary-text\)\]{color:var(--color-action-secondary-text)}.text-\[var\(--color-status-error\)\]{color:var(--color-status-error)}.text-\[var\(--color-status-error-text\)\]{color:var(--color-status-error-text)}.text-\[var\(--color-status-info-text\)\]{color:var(--color-status-info-text)}.text-\[var\(--color-status-success\)\]{color:var(--color-status-success)}.text-\[var\(--color-status-success-text\)\]{color:var(--color-status-success-text)}.text-\[var\(--color-status-warning-text\)\]{color:var(--color-status-warning-text)}.text-\[var\(--color-text-disabled\)\]{color:var(--color-text-disabled)}.text-\[var\(--color-text-inverse\)\]{color:var(--color-text-inverse)}.text-\[var\(--color-text-link\)\]{color:var(--color-text-link)}.text-\[var\(--color-text-primary\)\]{color:var(--color-text-primary)}.text-\[var\(--color-text-secondary\)\]{color:var(--color-text-secondary)}.text-\[var\(--color-text-tertiary\)\]{color:var(--color-text-tertiary)}.text-primary{color:var(--color-primary)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.placeholder-\[var\(--color-text-secondary\)\]::placeholder{color:var(--color-text-secondary)}.scheme-normal{color-scheme:normal}.opacity-0{opacity:0}.opacity-5{opacity:.05}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.blur-3xl{--tw-blur:blur(var(--blur-3xl));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}@media (hover:hover){.group-hover\:bg-\[var\(--color-action-primary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-primary-bg-subtle)}.group-hover\:bg-\[var\(--color-action-secondary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-secondary-bg-subtle)}.group-hover\:text-\[var\(--color-text-primary\)\]:is(:where(.group):hover *){color:var(--color-text-primary)}.group-hover\:text-indigo-500:is(:where(.group):hover *){color:var(--color-indigo-500)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.placeholder\:text-\[var\(--color-text-tertiary\)\]::placeholder{color:var(--color-text-tertiary)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-\[var\(--color-action-primary-border\)\]:hover{border-color:var(--color-action-primary-border)}.hover\:border-\[var\(--color-action-secondary-border\)\]:hover{border-color:var(--color-action-secondary-border)}.hover\:border-\[var\(--color-border-strong\)\]:hover{border-color:var(--color-border-strong)}.hover\:bg-\[var\(--color-accent-primary-hover\)\]:hover{background-color:var(--color-accent-primary-hover)}.hover\:bg-\[var\(--color-action-primary-bgHover\)\]:hover{background-color:var(--color-action-primary-bgHover)}.hover\:bg-\[var\(--color-bg-muted\)\]:hover{background-color:var(--color-bg-muted)}.hover\:bg-\[var\(--color-bg-subtle\)\]:hover{background-color:var(--color-bg-subtle)}.hover\:bg-\[var\(--color-bg-sunken\)\]:hover{background-color:var(--color-bg-sunken)}.hover\:bg-\[var\(--color-status-error-bg-subtle\)\]:hover{background-color:var(--color-status-error-bg-subtle)}.hover\:bg-primary\/90:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--color-primary) 90%, transparent)}}.hover\:text-\[var\(--color-text-primary\)\]:hover{color:var(--color-text-primary)}.hover\:text-\[var\(--color-text-secondary\)\]:hover{color:var(--color-text-secondary)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:border-primary:focus{border-color:var(--color-primary)}.focus\:border-transparent:focus{border-color:#0000}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--color-accent-primary\)\]:focus{--tw-ring-color:var(--color-accent-primary)}.focus\:ring-primary\/20:focus{--tw-ring-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (width>=40rem){.sm\:not-sr-only{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.sm\:top-6{top:calc(var(--spacing) * 6)}.sm\:right-6{right:calc(var(--spacing) * 6)}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:h-14{height:calc(var(--spacing) * 14)}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:p-12{padding:calc(var(--spacing) * 12)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}@media (width>=48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}}@media (width>=64rem){.lg\:col-span-1{grid-column:span 1/span 1}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:w-1\/2{width:50%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:text-left{text-align:left}}@media (prefers-color-scheme:dark){.dark\:scheme-dark{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}}.dark{--color-background:#020817;--color-foreground:#f8fafc;--color-card:#020817;--color-card-foreground:#020817;--color-popover:#020817;--color-popover-foreground:#020817;--color-primary:var(--color-action-primary-bg,#3b82f6);--color-primary-foreground:var(--color-action-primary-text,#0f172a);--color-ring:var(--color-action-primary-bg,#3b82f6);--color-secondary:#1e293b;--color-secondary-foreground:#f8fafc;--color-muted:#1e293b;--color-muted-foreground:#94a3b8;--color-accent:#1e293b;--color-accent-foreground:#f8fafc;--color-destructive:#7f1d1d;--color-destructive-foreground:#f8fafc;--color-border:#1e293b;--color-input:#1e293b}body{font-feature-settings:"rlig" 1, "calt" 1}.auth-primary-button{background:var(--color-action-primary-bg);color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg);border-radius:.75rem}@supports (color:color-mix(in lab, red, red)){.auth-primary-button{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 24%, transparent)}}.auth-primary-button{transition:opacity .16s,transform .16s,box-shadow .16s,background-color .16s}.auth-primary-button:hover{opacity:.96;box-shadow:0 16px 36px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:hover{box-shadow:0 16px 36px color-mix(in srgb, var(--color-action-primary-bg) 30%, transparent)}}.auth-primary-button:focus-visible{outline:2px solid var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:focus-visible{outline:2px solid color-mix(in srgb, var(--color-action-primary-bg) 45%, transparent)}}.auth-primary-button:focus-visible{outline-offset:2px}.auth-primary-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.auth-brand-badge{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-action-primary-bg) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 92%, white 8%) 0%, color-mix(in srgb, var(--color-action-primary-bg) 72%, var(--color-bg-surface) 28%) 100%)}}.auth-brand-badge{color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 22%, transparent)}}.auth-brand-panel{background:radial-gradient(circle at top left, var(--color-action-primary-bg) 0%, transparent 35%), radial-gradient(circle at bottom right, var(--color-text-link) 0%, transparent 38%), linear-gradient(135deg, var(--color-bg-surface) 0%, var(--color-bg-canvas) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-panel{background:radial-gradient(circle at top left, color-mix(in srgb, var(--color-action-primary-bg) 20%, transparent) 0%, transparent 35%), radial-gradient(circle at bottom right, color-mix(in srgb, var(--color-text-link) 18%, transparent) 0%, transparent 38%), linear-gradient(135deg, color-mix(in srgb, var(--color-bg-surface) 92%, black 8%) 0%, color-mix(in srgb, var(--color-bg-canvas) 70%, black 30%) 100%)}}.auth-brand-panel,.auth-brand-copy{color:var(--color-text-primary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy{color:color-mix(in srgb, var(--color-text-primary) 88%, white 12%)}}.auth-brand-copy-muted{color:var(--color-text-secondary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy-muted{color:color-mix(in srgb, var(--color-text-secondary) 75%, white 25%)}}.auth-highlight-chip{background:var(--color-bg-surface)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{background:color-mix(in srgb, var(--color-bg-surface) 84%, transparent)}}.auth-highlight-chip{border:1px solid var(--color-border-subtle)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{border:1px solid color-mix(in srgb, var(--color-border-subtle) 65%, transparent)}}.auth-highlight-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.auth-shell-gradient{background:linear-gradient(180deg, var(--color-bg-canvas) 0%, var(--color-bg-surface) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-shell-gradient{background:linear-gradient(180deg, color-mix(in srgb, var(--color-bg-canvas) 96%, transparent) 0%, color-mix(in srgb, var(--color-bg-surface) 96%, transparent) 100%)}}.auth-hero-card{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-text-link) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 90%, transparent) 0%, color-mix(in srgb, var(--color-text-link) 70%, var(--color-action-primary-bg) 30%) 100%)}}.auth-hero-card{color:var(--color-action-primary-text);box-shadow:0 18px 42px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{box-shadow:0 18px 42px color-mix(in srgb, var(--color-action-primary-bg) 26%, transparent)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
|
|
3
3
|
/*$vite$:1*/
|