feat(login): update to nextjs 16, improve caching, change default colors (#11629)

# Which Problems Are Solved

Updated the project to use the latest versions of Next.js and React, and
implemented a SWR caching strategy for key settings API calls to improve
performance. Adjusted configuration to ensure compatibility with Next.js
16.

# How the Problems Are Solved

- Updated next to 16.1.6, react & react-dom to 19.2.4, and next-intl to
4.8.3.
- Implemented `API_CACHE_ENABLED` and `API_CACHE_CONFIG` (replacing
deprecated unstable_cacheLife) for:
  - getBrandingSettings
  - getSecuritySettings
  - getPasswordComplexitySettings
  - getLoginSettings ...
- Updated default theme colors from blue to a more neutral black and
white

# Additional changes

- Updated login docker image to node 24

---------

Co-authored-by: Ramon <[email protected]>

apps/login/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:22-alpine
+FROM node:24-alpine
 WORKDIR /app
 RUN addgroup --system --gid 1001 nodejs && \
     adduser --system --uid 1001 nextjs

apps/login/next-env-vars.d.ts

@@ -83,6 +83,24 @@ declare namespace NodeJS {
      * which is safer for environments with enterprise email link scanners.
      */
     NEXT_PUBLIC_AUTO_SUBMIT_CODE?: string;
+
+    /**
+     * Optional: Enable the SWR in-memory cache for API requests globally.
+     * Defaults to true. Set to "false" to disable completely.
+     */
+    API_CACHE_ENABLED?: string;
+
+    /**
+     * Optional: JSON string to configure the cache TTLs (in minutes) for specific backend API routes or global fallbacks.
+     * Example: '{"defaultMinutes": 15, "longMinutes": 60, "getBrandingSettings": 120}'
+     * 
+     * Properties:
+     * - \`defaultMinutes\`: The globally utilized default TTL in minutes (falls back to 15 if not set).
+     * - \`longMinutes\`: The TTL utilized string for long-cached routes, like branding/translation (falls back to 60 if not set).
+     * - \`[route_name]\`: Explicit overrides per specific API method (e.g., \`getHostedLoginTranslation\`).
+     */
+    API_CACHE_CONFIG?: string;
+
     /**
      * Optional: Disable OpenTelemetry instrumentation.
      * Set to "true" to bypass OTEL initialization.

apps/login/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-/// <reference path="./.next/types/routes.d.ts" />
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

apps/login/package.json

@@ -41,8 +41,8 @@
     "escape-html": "^1.0.3",
     "lucide-react": "^0.562.0",
     "moment": "^2.30.1",
-    "next": "15.5.10",
-    "next-intl": "^3.26.5",
+    "next": "16.1.6",
+    "next-intl": "^4.8.3",
     "next-themes": "^0.2.1",
     "nice-grpc": "^2.1.14",
     "qrcode.react": "^4.2.0",

apps/login/src/app/(login)/idp/[provider]/process/page.tsx

@@ -1,4 +1,9 @@
+import { DynamicTheme } from "@/components/dynamic-theme";
 import { IdpProcessHandler } from "@/components/idp-process-handler";
+import { getServiceConfig } from "@/lib/service-url";
+import { getBrandingSettings, getDefaultOrg } from "@/lib/zitadel";
+import { Organization } from "@zitadel/proto/zitadel/org/v2/org_pb";
+import { headers } from "next/headers";
 
 /**
  * This page handles the initial IDP callback with the single-use token.
@@ -20,17 +25,32 @@ export default async function ProcessPage(props: {
     throw new Error("Missing required IDP callback parameters");
   }
 
+  const _headers = await headers();
+  const { serviceConfig } = getServiceConfig(_headers);
+
+  let defaultOrganization;
+  if (!organization) {
+    const org: Organization | null = await getDefaultOrg({ serviceConfig });
+    if (org) {
+      defaultOrganization = org.id;
+    }
+  }
+
+  const branding = await getBrandingSettings({ serviceConfig, organization: organization ?? defaultOrganization });
+
   return (
-    <IdpProcessHandler
-      provider={provider}
-      id={id}
-      token={token}
-      requestId={requestId}
-      organization={organization}
-      link={link}
-      sessionId={linkToSessionId}
-      linkFingerprint={linkFingerprint}
-      postErrorRedirectUrl={postErrorRedirectUrl}
-    />
+    <DynamicTheme branding={branding}>
+      <IdpProcessHandler
+        provider={provider}
+        id={id}
+        token={token}
+        requestId={requestId}
+        organization={organization}
+        link={link}
+        sessionId={linkToSessionId}
+        linkFingerprint={linkFingerprint}
+        postErrorRedirectUrl={postErrorRedirectUrl}
+      />
+    </DynamicTheme>
   );
 }

apps/login/src/app/login/route.ts

@@ -10,8 +10,6 @@ import { NextRequest, NextResponse } from "next/server";
 export const dynamic = "force-dynamic";
 export const revalidate = false;
 export const fetchCache = "default-no-store";
-// Add this to prevent RSC requests
-export const runtime = "nodejs";
 
 async function loadSessions({ serviceConfig, ids }: { serviceConfig: ServiceConfig; ids: string[] }): Promise<Session[]> {
   const response = await listSessions({ serviceConfig, ids: ids.filter((id: string | undefined) => !!id) });

apps/login/src/app/otel-test/route.ts

@@ -10,7 +10,6 @@ import {
 import { metrics, SpanStatusCode, trace } from "@opentelemetry/api";
 import { NextResponse } from "next/server";
 
-export const runtime = "nodejs";
 const logger = createLogger("otel-test");
 
 export async function GET() {

apps/login/src/components/idp-process-handler.tsx

@@ -94,7 +94,7 @@ export function IdpProcessHandler({
   }, [provider, id, token, requestId, organization, link, sessionId, linkFingerprint, postErrorRedirectUrl, router, t]);
 
   return (
-    <div className="flex min-h-screen items-center justify-center">
+    <div className="flex items-center justify-center">
       {samlData && <AutoSubmitForm url={samlData.url} fields={samlData.fields} />}
       {loading && (
         <div className="flex flex-col items-center space-y-4">

apps/login/src/helpers/colors.ts

@@ -30,13 +30,13 @@ export type ColorMap = {
   [_key in MapName]: Color[];
 };
 
-export const DARK_PRIMARY = "#2073c4";
+export const DARK_PRIMARY = "#eeeeee";
 export const PRIMARY = "#5469d4";
 
 export const DARK_WARN = "#ff3b5b";
 export const WARN = "#cd3d56";
 
-export const DARK_BACKGROUND = "#111827";
+export const DARK_BACKGROUND = "#252526";
 export const BACKGROUND = "#fafafa";
 
 export const DARK_TEXT = "#ffffff";

apps/login/src/lib/theme.test.ts

@@ -78,6 +78,12 @@ describe("Theme Configuration", () => {
 
   describe("getThemeConfig", () => {
     it("should return default theme when no environment variables are set", () => {
+      delete process.env.NEXT_PUBLIC_THEME_ROUNDNESS;
+      delete process.env.NEXT_PUBLIC_THEME_LAYOUT;
+      delete process.env.NEXT_PUBLIC_THEME_APPEARANCE;
+      delete process.env.NEXT_PUBLIC_THEME_SPACING;
+      delete process.env.NEXT_PUBLIC_THEME_BACKGROUND_IMAGE;
+
       const config = getThemeConfig();
 
       expect(config.roundness).toBe(DEFAULT_THEME.roundness);

apps/login/src/lib/zitadel.ts

@@ -30,7 +30,7 @@ import {
   VerifyU2FRegistrationRequest,
 } from "@zitadel/proto/zitadel/user/v2/user_service_pb";
 import { getTranslations } from "next-intl/server";
-import { unstable_cacheLife as cacheLife } from "next/cache";
+
 import { getUserAgent } from "./fingerprint";
 import { createLogger } from "./logger";
 
@@ -40,13 +40,55 @@ import { createServiceForHost } from "./service";
 
 const logger = createLogger("zitadel");
 
-const useCache = process.env.DEBUG !== "true";
+const useCache = process.env.API_CACHE_ENABLED !== "false";
 
-async function cacheWrapper<T>(callback: Promise<T>) {
-  "use cache";
-  cacheLife("hours");
+let cacheConfig: Record<string, number> = {};
+try {
+  if (process.env.API_CACHE_CONFIG) {
+    cacheConfig = JSON.parse(process.env.API_CACHE_CONFIG);
+  }
+} catch (e) {
+  console.error("Failed to parse API_CACHE_CONFIG", e);
+}
 
-  return callback;
+const defaultCacheTTL = (cacheConfig.defaultMinutes ?? 15) * 60 * 1000; // 15 mins default
+const longCacheTTL = (cacheConfig.longMinutes ?? 60) * 60 * 1000; // 1 hour default
+
+/**
+ * Helper to determine the TTL for a specific API method.
+ * Allows overriding per-resource via the API_CACHE_CONFIG environment variable.
+ */
+function getTTLForKey(keyPrefix: string, fallbackTtl: number) {
+  const configTTL = cacheConfig[keyPrefix];
+  if (typeof configTTL === "number" && !isNaN(configTTL)) {
+    return configTTL * 60 * 1000; // Config expects minutes
+  }
+  return fallbackTtl;
+}
+
+const promiseCache = new Map<string, { promise: Promise<any>; expiresAt: number }>();
+
+/**
+ * A stale-while-revalidate in-memory cache to keep data fresh and deduplicate concurrent requests.
+ * We cache the Promise, so concurrent requests share the exact same execution.
+ */
+function freshCache<T>(key: string, fetcher: () => Promise<T>, ttlMs: number): Promise<T> {
+  if (!useCache) {
+    return fetcher();
+  }
+
+  const now = Date.now();
+  const cached = promiseCache.get(key);
+  if (cached && now < cached.expiresAt) {
+    return cached.promise;
+  }
+
+  const promise = fetcher();
+  promiseCache.set(key, { promise, expiresAt: now + ttlMs });
+
+  promise.catch(() => promiseCache.delete(key));
+
+  return promise;
 }
 
 export async function getHostedLoginTranslation({
@@ -57,29 +99,35 @@ export async function getHostedLoginTranslation({
   organization?: string;
   locale?: string;
 }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getHostedLoginTranslation(
-      {
-        level: organization
-          ? {
-              case: "organizationId",
-              value: organization,
-            }
-          : {
-              case: "instance",
-              value: true,
-            },
-        locale: locale,
-      },
-      {},
-    )
-    .then((resp) => {
-      return resp.translations ? resp.translations : undefined;
-    });
+    return settingsService
+      .getHostedLoginTranslation(
+        {
+          level: organization
+            ? {
+                case: "organizationId",
+                value: organization,
+              }
+            : {
+                case: "instance",
+                value: true,
+              },
+          locale: locale,
+        },
+        {},
+      )
+      .then((resp) => {
+        return resp.translations ? resp.translations : undefined;
+      });
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getHostedLoginTranslation-${organization || "instance"}-${locale || "default"}`,
+    fetcher,
+    getTTLForKey("getHostedLoginTranslation", longCacheTTL),
+  );
 }
 
 export async function getBrandingSettings({
@@ -88,13 +136,19 @@ export async function getBrandingSettings({
 }: WithServiceConfig<{
   organization?: string;
 }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getBrandingSettings({ ctx: makeReqCtx(organization) }, {})
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getBrandingSettings({ ctx: makeReqCtx(organization) }, {})
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getBrandingSettings-${organization || "instance"}`,
+    fetcher,
+    getTTLForKey("getBrandingSettings", longCacheTTL),
+  );
 }
 
 export async function getLoginSettings({
@@ -103,41 +157,61 @@ export async function getLoginSettings({
 }: WithServiceConfig<{
   organization?: string;
 }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getLoginSettings({ ctx: makeReqCtx(organization) }, {})
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getLoginSettings({ ctx: makeReqCtx(organization) }, {})
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getLoginSettings-${organization || "instance"}`,
+    fetcher,
+    getTTLForKey("getLoginSettings", defaultCacheTTL),
+  );
 }
 
 export async function getSecuritySettings({ serviceConfig }: WithServiceConfig) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService.getSecuritySettings({}).then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService.getSecuritySettings({}).then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(`getSecuritySettings-instance`, fetcher, getTTLForKey("getSecuritySettings", defaultCacheTTL));
 }
 
 export async function getLockoutSettings({ serviceConfig, orgId }: WithServiceConfig<{ orgId?: string }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getLockoutSettings({ ctx: makeReqCtx(orgId) }, {})
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getLockoutSettings({ ctx: makeReqCtx(orgId) }, {})
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getLockoutSettings-${orgId || "instance"}`,
+    fetcher,
+    getTTLForKey("getLockoutSettings", defaultCacheTTL),
+  );
 }
 
 export async function getPasswordExpirySettings({ serviceConfig, orgId }: WithServiceConfig<{ orgId?: string }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getPasswordExpirySettings({ ctx: makeReqCtx(orgId) }, {})
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getPasswordExpirySettings({ ctx: makeReqCtx(orgId) }, {})
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getPasswordExpirySettings-${orgId || "instance"}`,
+    fetcher,
+    getTTLForKey("getPasswordExpirySettings", defaultCacheTTL),
+  );
 }
 
 export async function listIDPLinks({ serviceConfig, userId }: WithServiceConfig<{ userId: string }>) {
@@ -165,16 +239,18 @@ export async function registerTOTP({ serviceConfig, userId }: WithServiceConfig<
 }
 
 export async function getAllowedLanguages({ serviceConfig }: WithServiceConfig) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService.getGeneralSettings({}, {}).then((resp) => {
-    return {
-      allowedLanguages: resp.allowedLanguages,
-      defaultLanguage: resp.defaultLanguage,
-    };
-  });
+    return settingsService.getGeneralSettings({}, {}).then((resp) => {
+      return {
+        allowedLanguages: resp.allowedLanguages,
+        defaultLanguage: resp.defaultLanguage,
+      };
+    });
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(`getGeneralSettings-instance`, fetcher, getTTLForKey("getGeneralSettings", longCacheTTL));
 }
 
 export async function getLegalAndSupportSettings({
@@ -183,13 +259,19 @@ export async function getLegalAndSupportSettings({
 }: WithServiceConfig<{
   organization?: string;
 }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getLegalAndSupportSettings({ ctx: makeReqCtx(organization) }, {})
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getLegalAndSupportSettings({ ctx: makeReqCtx(organization) }, {})
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getLegalAndSupportSettings-${organization || "instance"}`,
+    fetcher,
+    getTTLForKey("getLegalAndSupportSettings", longCacheTTL),
+  );
 }
 
 export async function getPasswordComplexitySettings({
@@ -198,13 +280,19 @@ export async function getPasswordComplexitySettings({
 }: WithServiceConfig<{
   organization?: string;
 }>) {
-  const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
+  const fetcher = async () => {
+    const settingsService: Client<typeof SettingsService> = await createServiceForHost(SettingsService, serviceConfig);
 
-  const callback = settingsService
-    .getPasswordComplexitySettings({ ctx: makeReqCtx(organization) })
-    .then((resp) => (resp.settings ? resp.settings : undefined));
+    return settingsService
+      .getPasswordComplexitySettings({ ctx: makeReqCtx(organization) })
+      .then((resp) => (resp.settings ? resp.settings : undefined));
+  };
 
-  return useCache ? cacheWrapper(callback) : callback;
+  return freshCache(
+    `getPasswordComplexitySettings-${organization || "instance"}`,
+    fetcher,
+    getTTLForKey("getPasswordComplexitySettings", defaultCacheTTL),
+  );
 }
 
 export async function createSessionFromChecksAndChallenges({
@@ -740,23 +828,29 @@ export async function searchUsers({
 }
 
 export async function getDefaultOrg({ serviceConfig }: WithServiceConfig): Promise<Organization | null> {
-  const orgService: Client<typeof OrganizationService> = await createServiceForHost(OrganizationService, serviceConfig);
+  const fetcher = async () => {
+    const orgService: Client<typeof OrganizationService> = await createServiceForHost(OrganizationService, serviceConfig);
 
-  return orgService
-    .listOrganizations(
-      {
-        queries: [
-          {
-            query: {
-              case: "defaultQuery",
-              value: {},
+    return orgService
+      .listOrganizations(
+        {
+          queries: [
+            {
+              query: {
+                case: "defaultQuery",
+                value: {},
+              },
             },
-          },
-        ],
-      },
-      {},
-    )
-    .then((resp) => (resp?.result && resp.result[0] ? resp.result[0] : null));
+          ],
+        },
+        {},
+      )
+      .then((resp) => (resp?.result && resp.result[0] ? resp.result[0] : null));
+  };
+
+  return useCache
+    ? freshCache(`getDefaultOrg-${"instance"}`, fetcher, getTTLForKey("getDefaultOrg", defaultCacheTTL))
+    : fetcher();
 }
 
 export async function getOrgsByDomain({ serviceConfig, domain }: WithServiceConfig<{ domain: string }>) {

apps/login/src/proxy.ts

@@ -6,8 +6,6 @@ import { buildCSP } from "./lib/csp";
 import { createLogger } from "./lib/logger";
 import { getServiceConfig } from "./lib/service-url";
 
-export const runtime = "nodejs";
-
 const logger = createLogger("middleware");
 export const config = {
   matcher: ["/.well-known/:path*", "/oauth/:path*", "/oidc/:path*", "/idps/callback/:path*", "/saml/:path*", "/:path*"],
@@ -31,7 +29,7 @@ async function loadSecuritySettings(request: NextRequest): Promise<SecuritySetti
   return response.settings;
 }
 
-export async function middleware(request: NextRequest) {
+export async function proxy(request: NextRequest) {
   // Add the original URL as a header to all requests
   const requestHeaders = new Headers(request.headers);
 

apps/login/src/styles/globals.scss

@@ -1,6 +1,3 @@
-// include styles from the ui package
-@use "./vars.scss";
-
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

apps/login/src/styles/vars.scss

@@ -1,174 +0,0 @@
-:root {
-  --theme-dark-primary-50: #f1f7fd;
-  --theme-dark-primary-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-100: #afd1f2;
-  --theme-dark-primary-contrast-100: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-200: #7fb5ea;
-  --theme-dark-primary-contrast-200: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-300: #4192e0;
-  --theme-dark-primary-contrast-300: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-400: #2782dc;
-  --theme-dark-primary-contrast-400: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-500: #2073c4;
-  --theme-dark-primary-contrast-500: #ffffff;
-  --theme-dark-primary-600: #1c64aa;
-  --theme-dark-primary-contrast-600: #ffffff;
-  --theme-dark-primary-700: #17548f;
-  --theme-dark-primary-contrast-700: #ffffff;
-  --theme-dark-primary-800: #134575;
-  --theme-dark-primary-contrast-800: #ffffff;
-  --theme-dark-primary-900: #0f355b;
-  --theme-dark-primary-contrast-900: #ffffff;
-  --theme-dark-primary-A100: #e4f2ff;
-  --theme-dark-primary-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-A200: #7ebfff;
-  --theme-dark-primary-contrast-A200: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-A400: #278df0;
-  --theme-dark-primary-contrast-A400: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-primary-A700: #1d80e0;
-  --theme-dark-primary-contrast-A700: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-50: #ffffff;
-  --theme-light-primary-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-100: #ebedfa;
-  --theme-light-primary-contrast-100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-200: #bec6ef;
-  --theme-light-primary-contrast-200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-300: #8594e0;
-  --theme-light-primary-contrast-300: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-400: #6c7eda;
-  --theme-light-primary-contrast-400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-500: #5469d4;
-  --theme-light-primary-contrast-500: #ffffff;
-  --theme-light-primary-600: #3c54ce;
-  --theme-light-primary-contrast-600: #ffffff;
-  --theme-light-primary-700: #2f46bc;
-  --theme-light-primary-contrast-700: #ffffff;
-  --theme-light-primary-800: #293da3;
-  --theme-light-primary-contrast-800: #ffffff;
-  --theme-light-primary-900: #23348b;
-  --theme-light-primary-contrast-900: #ffffff;
-  --theme-light-primary-A100: #ffffff;
-  --theme-light-primary-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-A200: #c5cefc;
-  --theme-light-primary-contrast-A200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-A400: #7085ea;
-  --theme-light-primary-contrast-A400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-primary-A700: #6478de;
-  --theme-light-primary-contrast-A700: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-50: #ffffff;
-  --theme-dark-warn-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-100: #fff8f9;
-  --theme-dark-warn-contrast-100: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-200: #ffc0ca;
-  --theme-dark-warn-contrast-200: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-300: #ff788e;
-  --theme-dark-warn-contrast-300: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-400: #ff5a75;
-  --theme-dark-warn-contrast-400: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-500: #ff3b5b;
-  --theme-dark-warn-contrast-500: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-600: #ff1c41;
-  --theme-dark-warn-contrast-600: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-700: #fd0029;
-  --theme-dark-warn-contrast-700: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-800: #de0024;
-  --theme-dark-warn-contrast-800: #ffffff;
-  --theme-dark-warn-900: #c0001f;
-  --theme-dark-warn-contrast-900: #ffffff;
-  --theme-dark-warn-A100: #ffffff;
-  --theme-dark-warn-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-A200: #ffd4db;
-  --theme-dark-warn-contrast-A200: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-A400: #ff6e86;
-  --theme-dark-warn-contrast-A400: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-warn-A700: #ff5470;
-  --theme-dark-warn-contrast-A700: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-50: #ffffff;
-  --theme-light-warn-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-100: #f4d3d9;
-  --theme-light-warn-contrast-100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-200: #e8a6b2;
-  --theme-light-warn-contrast-200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-300: #da6e80;
-  --theme-light-warn-contrast-300: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-400: #d3556b;
-  --theme-light-warn-contrast-400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-500: #cd3d56;
-  --theme-light-warn-contrast-500: #ffffff;
-  --theme-light-warn-600: #bb3048;
-  --theme-light-warn-contrast-600: #ffffff;
-  --theme-light-warn-700: #a32a3f;
-  --theme-light-warn-contrast-700: #ffffff;
-  --theme-light-warn-800: #8a2436;
-  --theme-light-warn-contrast-800: #ffffff;
-  --theme-light-warn-900: #721d2c;
-  --theme-light-warn-contrast-900: #ffffff;
-  --theme-light-warn-A100: #ffffff;
-  --theme-light-warn-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-A200: #faa9b7;
-  --theme-light-warn-contrast-A200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-A400: #e65770;
-  --theme-light-warn-contrast-A400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-warn-A700: #d84c64;
-  --theme-light-warn-contrast-A700: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-background-50: #7c93c6;
-  --theme-dark-background-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-background-100: #4a69aa;
-  --theme-dark-background-contrast-100: #ffffff;
-  --theme-dark-background-200: #395183;
-  --theme-dark-background-contrast-200: #ffffff;
-  --theme-dark-background-300: #243252;
-  --theme-dark-background-contrast-300: #ffffff;
-  --theme-dark-background-400: #1a253c;
-  --theme-dark-background-contrast-400: #ffffff;
-  --theme-dark-background-500: #111827;
-  --theme-dark-background-contrast-500: #ffffff;
-  --theme-dark-background-600: #080b12;
-  --theme-dark-background-contrast-600: #ffffff;
-  --theme-dark-background-700: #000000;
-  --theme-dark-background-contrast-700: #ffffff;
-  --theme-dark-background-800: #000000;
-  --theme-dark-background-contrast-800: #ffffff;
-  --theme-dark-background-900: #000000;
-  --theme-dark-background-contrast-900: #ffffff;
-  --theme-dark-background-A100: #5782e0;
-  --theme-dark-background-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-background-A200: #204eb1;
-  --theme-dark-background-contrast-A200: #ffffff;
-  --theme-dark-background-A400: #182b53;
-  --theme-dark-background-contrast-A400: #ffffff;
-  --theme-dark-background-A700: #17223b;
-  --theme-dark-background-contrast-A700: #ffffff;
-  --theme-light-background-50: #ffffff;
-  --theme-light-background-contrast-50: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-100: #ffffff;
-  --theme-light-background-contrast-100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-200: #ffffff;
-  --theme-light-background-contrast-200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-300: #ffffff;
-  --theme-light-background-contrast-300: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-400: #ffffff;
-  --theme-light-background-contrast-400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-500: #fafafa;
-  --theme-light-background-contrast-500: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-600: #ebebeb;
-  --theme-light-background-contrast-600: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-700: #dbdbdb;
-  --theme-light-background-contrast-700: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-800: #cccccc;
-  --theme-light-background-contrast-800: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-900: #bdbdbd;
-  --theme-light-background-contrast-900: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-A100: #ffffff;
-  --theme-light-background-contrast-A100: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-A200: #ffffff;
-  --theme-light-background-contrast-A200: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-A400: #ffffff;
-  --theme-light-background-contrast-A400: hsla(0, 0%, 0%, 0.87);
-  --theme-light-background-A700: #ffffff;
-  --theme-light-background-contrast-A700: hsla(0, 0%, 0%, 0.87);
-  --theme-dark-text: #ffffff;
-  --theme-dark-secondary-text: #ffffffc7;
-  --theme-light-text: #000000;
-  --theme-light-secondary-text: #000000c7;
-}

apps/login/tsconfig.json

@@ -11,7 +11,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
     "plugins": [
       {

package.json

@@ -1,5 +1,5 @@
 {
-  "packageManager": "pnpm@10.28.2+sha512.41872f037ad22f7348e3b1debbaf7e867cfd448f2726d9cf74c08f19507c31d2c8e7a11525b983febc2df640b5438dee6023ebb1f84ed43cc2d654d2bc326264",
+  "packageManager": "pnpm@10.30.3",
   "private": true,
   "name": "@zitadel/zitadel",
   "pnpm": {
@@ -16,8 +16,8 @@
     "@bufbuild/buf": "^1.65.0",
     "@changesets/cli": "^2.29.8",
     "nx": "21.6.9",
-    "shiki": "^3.21.0",
     "sass": "^1.97.3",
+    "shiki": "^3.21.0",
     "wait-on": "^9.0.3"
   }
 }

pnpm-lock.yaml

@@ -80,7 +80,7 @@ importers:
         version: 2.74.0(@mixpanel/[email protected])
       next:
         specifier: 16.1.6
-        version: 16.1.6(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+        version: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
       next-themes:
         specifier: ^0.4.6
         version: 0.4.6([email protected]([email protected]))([email protected])
@@ -251,14 +251,14 @@ importers:
         specifier: ^2.30.1
         version: 2.30.1
       next:
-        specifier: 15.5.10
-        version: 15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+        specifier: 16.1.6
+        version: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
       next-intl:
-        specifier: ^3.26.5
-        version: 3.26.5([email protected](@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected])
+        specifier: ^4.8.3
+        version: 4.8.3(@swc/[email protected])([email protected](@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected])([email protected])
       next-themes:
         specifier: ^0.2.1
-        version: 0.2.1(next@15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected]([email protected]))([email protected])
+        version: 0.2.1(next@16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected]([email protected]))([email protected])
       nice-grpc:
         specifier: ^2.1.14
         version: 2.1.14
@@ -2251,26 +2251,17 @@ packages:
   '@floating-ui/[email protected]':
     resolution: {integrity: sha512-BfNqNW6KA83Nexspgb9DZuz578R7HT8MZw1CfK9I6Ah4QReNWEJsXWHN+SdmOVLNGmTPDi+fDT535Df5PzMLbQ==}
 
-  '@formatjs/ecma402-abstract@2.3.4':
-    resolution: {integrity: sha512-qrycXDeaORzIqNhBOx0btnhpD1c+/qFIHAN9znofuMJX6QBwtbrmlpWfD4oiUUD2vJUOIYFA/gYtg2KAMGG7sA==}
-
-  '@formatjs/[email protected]':
-    resolution: {integrity: sha512-Yabmi9nSvyOMrlSeGGWDiH7rf3a7sIwplbvo/dlz9WCIjzIQAfy1RMf4S0X3yG724n5Ghu2GmEl5NJIV6O9sZQ==}
+  '@formatjs/ecma402-abstract@3.1.1':
+    resolution: {integrity: sha512-jhZbTwda+2tcNrs4kKvxrPLPjx8QsBCLCUgrrJ/S+G9YrGHWLhAyFMMBHJBnBoOwuLHd7L14FgYudviKaxkO2Q==}
 
   '@formatjs/[email protected]':
     resolution: {integrity: sha512-b5mvSWCI+XVKiz5WhnBCY3RJ4ZwfjAidU0yVlKa3d3MSgKmH1hC3tBGEAtYyN5mqL7N0G5x0BOUYyO8CEupWgg==}
 
-  '@formatjs/icu-messageformat-parser@2.11.2':
-    resolution: {integrity: sha512-AfiMi5NOSo2TQImsYAg8UYddsNJ/vUEv/HaNqiFjnI3ZFfWihUtD5QtuX6kHl8+H+d3qvnE/3HZrfzgdWpsLNA==}
+  '@formatjs/icu-messageformat-parser@3.5.1':
+    resolution: {integrity: sha512-sSDmSvmmoVQ92XqWb499KrIhv/vLisJU8ITFrx7T7NZHUmMY7EL9xgRowAosaljhqnj/5iufG24QrdzB6X3ItA==}
 
-  '@formatjs/icu-skeleton-parser@1.8.14':
-    resolution: {integrity: sha512-i4q4V4qslThK4Ig8SxyD76cp3+QJ3sAqr7f6q9VVfeGtxG9OhiAk3y9XF6Q41OymsKzsGQ6OQQoJNY4/lI8TcQ==}
-
-  '@formatjs/[email protected]':
-    resolution: {integrity: sha512-af3qATX+m4Rnd9+wHcjJ4w2ijq+rAVP3CCinJQvFv1kgSu1W6jypUmvleJxcewdxmutM8dmIRZFxO/IQBZmP2Q==}
-
-  '@formatjs/[email protected]':
-    resolution: {integrity: sha512-ePEgLgVCqi2BBFnTMWPfIghu6FkbZnnBVhO2sSxvLfrdFw7wCHAHiDoM2h4NRgjbaY7+B7HgOLZGkK187pZTZg==}
+  '@formatjs/icu-skeleton-parser@2.1.1':
+    resolution: {integrity: sha512-PSFABlcNefjI6yyk8f7nyX1DC7NHmq6WaCHZLySEXBrXuLOB2f935YsnzuPjlz+ibhb9yWTdPeVX1OVcj24w2Q==}
 
   '@formatjs/[email protected]':
     resolution: {integrity: sha512-xwEuwQFdtSq1UKtQnyTZWC+eHdv7Uygoa+H2k/9uzBVQjDyp9r20LNDNKedWXll7FssT3GRHvqsdJGYSUWqYFA==}
@@ -3065,46 +3056,24 @@ packages:
     engines: {node: '>=18.14.0'}
     hasBin: true
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-plg+9A/KoZcTS26fe15LHg+QxReTazrIOoKKUC3Uz4leGGeNPgLHdevVraAAOX0snnUs3WkRx3eUQpj9mreG6A==}
-
   '@next/[email protected]':
     resolution: {integrity: sha512-N1ySLuZjnAtN3kFnwhAwPvZah8RJxKasD7x1f8shFqhncnWZn4JMfg37diLNuoHsLAlrDfM3g4mawVdtAG8XLQ==}
 
   '@next/[email protected]':
     resolution: {integrity: sha512-/Qq3PTagA6+nYVfryAtQ7/9FEr/6YVyvOtl6rZnGsbReGLf0jZU6gkpr1FuChAQpvV46a78p4cmHOVP8mbfSMQ==}
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-IZwtxCEpI91HVU/rAUOOobWSZv4P2DeTtNaCdHqLcTJU4wdNXgAySvKa/qJCgR5m6KI8UsKDXtO2B31jcaw1Yw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [darwin]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-wTzYulosJr/6nFnqGW7FrG3jfUUlEf8UjGA0/pyypJl42ExdVgC6xJgcXQ+V8QFn6niSG2Pb8+MIG1mZr2vczw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [darwin]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-UP6CaDBcqaCBuiq/gfCEJw7sPEoX1aIjZHnBWN9v9qYHQdMKvCKcAVs4OX1vIjeE+tC5EIuwDTVIoXpUes29lg==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [darwin]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-BLFPYPDO+MNJsiDWbeVzqvYd4NyuRrEYVB5k2N3JfWncuHAy2IVwMAOlVQDFjj+krkWzhY2apvmekMkfQR0CUQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [darwin]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-NCslw3GrNIw7OgmRBxHtdWFQYhexoUCq+0oS2ccjyYLtcn1SzGzeM54jpTFonIMUjNbHmpKpziXnpxhSWLcmBA==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-OJYkCd5pj/QloBvoEcJ2XiMnlJkRv9idWA/j0ugSuA34gMT6f5b7vOiCQHVRpvStoZUknhl6/UxOXL4OwtdaBw==}
     engines: {node: '>= 10'}
@@ -3112,13 +3081,6 @@ packages:
     os: [linux]
     libc: [glibc]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-nfymt+SE5cvtTrG9u1wdoxBr9bVB7mtKTcj0ltRn6gkP/2Nu1zM5ei8rwP9qKQP0Y//umK+TtkKgNtfboBxRrw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-S4J2v+8tT3NIO9u2q+S0G5KdvNDjXfAv06OhfOzNDaBn5rw84DGXWndOEB7d5/x852A20sW1M56vhC/tRVbccQ==}
     engines: {node: '>= 10'}
@@ -3126,13 +3088,6 @@ packages:
     os: [linux]
     libc: [musl]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-hvXcZvCaaEbCZcVzcY7E1uXN9xWZfFvkNHwbe/n4OkRhFWrs1J1QV+4U1BN06tXLdaS4DazEGXwgqnu/VMcmqw==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-2eEBDkFlMMNQnkTyPBhQOAyn2qMxyG2eE7GPH2WIDGEpEILcBPI/jdSv4t6xupSP+ot/jkfrCShLAa7+ZUPcJQ==}
     engines: {node: '>= 10'}
@@ -3140,13 +3095,6 @@ packages:
     os: [linux]
     libc: [glibc]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-4IUO539b8FmF0odY6/SqANJdgwn1xs1GkPO5doZugwZ3ETF6JUdckk7RGmsfSf7ws8Qb2YB5It33mvNL/0acqA==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-oicJwRlyOoZXVlxmIMaTq7f8pN9QNbdes0q2FXfRsPhfCi8n8JmOZJm5oo1pwDaFbnnD421rVU409M3evFbIqg==}
     engines: {node: '>= 10'}
@@ -3154,24 +3102,12 @@ packages:
     os: [linux]
     libc: [musl]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-CpJVTkYI3ZajQkC5vajM7/ApKJUOlm6uP4BknM3XKvJ7VXAvCqSjSLmM0LKdYzn6nBJVSjdclx8nYJSa3xlTgQ==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [win32]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-gQmm8izDTPgs+DCWH22kcDmuUp7NyiJgEl18bcr8irXA5N2m2O+JQIr6f3ct42GOs9c0h8QF3L5SzIxcYAAXXw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [win32]
 
-  '@next/[email protected]':
-    resolution: {integrity: sha512-gMzgBX164I6DN+9/PGA+9dQiwmTkE4TloBNx8Kv9UiGARsr9Nba7IpcBRA1iTV9vwlYnrE3Uy6I7Aj6qLjQuqw==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [win32]
-
   '@next/[email protected]':
     resolution: {integrity: sha512-NRfO39AIrzBnixKbjuo2YiYhB6o9d8v/ymU9m/Xk8cyVk+k7XylniXkHwjs4s70wedVffc6bQNbufk5v0xEm0A==}
     engines: {node: '>= 10'}
@@ -5198,6 +5134,9 @@ packages:
     resolution: {integrity: sha512-WkhW1HO8pA8JT8e27tvjQHQg8eO5KaOz+WsGkN00RyL5DwHgPSzu4a3eYug+b3rW7OGFub7jadXBuGSrzqgonA==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0, npm: ^6.11.0 || ^7.5.6 || >=8.0.0, yarn: '>= 1.13.0'}
 
+  '@schummar/[email protected]':
+    resolution: {integrity: sha512-bXHSaW5jRTmke9Vd0h5P7BtWZG9Znqb8gSDxZnxaGSJnGwPLDPfS+3g0BKzeWqzgZPsIVZkM7m2tbo18cm5HBw==}
+
   '@shikijs/[email protected]':
     resolution: {integrity: sha512-AXSQu/2n1UIQekY8euBJlvFYZIw0PHY63jUzGbrOma4wPxzznJXTXkri+QcHeBNaFxiiOljKxxJkVSoB3PjbyA==}
 
@@ -8530,6 +8469,9 @@ packages:
     resolution: {integrity: sha512-cf6L2Ds3h57VVmkZe+Pn+5APsT7FpqJtEhhieDCvrE2MK5Qk9MyffgQyuxQTm6BChfeZNtcOLHp9IcWRVcIcBQ==}
     engines: {node: '>=0.10.0'}
 
+  [email protected]:
+    resolution: {integrity: sha512-65Av7FLosNk7bPbmQx5z5XG2Y3T2GFppcjiXh4z1idHeVgQxlDpAmkGoYI0eFzAvrOnjpWTL5FmPDhsdfRMPEA==}
+
   [email protected]:
     resolution: {integrity: sha512-ZrYyM0sozNPZlvBvE7Oq9Bn44n0qKGrYu5sQ0JzMUnjIhpgWYE2JB6aBoFwEYdPjqj7jPyxXTMJiHDOxDfd8yw==}
     engines: {node: '>=18'}
@@ -8617,8 +8559,8 @@ packages:
     resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
     engines: {node: '>= 0.4'}
 
-  intl-messageformat@10.7.16:
-    resolution: {integrity: sha512-UmdmHUmp5CIKKjSoE10la5yfU+AYJAaiYLsodbjL4lji83JNvgOQUjGaGhGrpFCb0Uh7sl7qfP1IyILa8Z40ug==}
+  intl-messageformat@11.1.2:
+    resolution: {integrity: sha512-ucSrQmZGAxfiBHfBRXW/k7UC8MaGFlEj4Ry1tKiDcmgwQm1y3EDl40u+4VNHYomxJQMJi9NEI3riDRlth96jKg==}
 
   [email protected]:
     resolution: {integrity: sha512-NWv9YLW4PoW2B7xtzaS3NCot75m6nK7Icdv0o3lfMceJVRfSoQwqD4wEH5rLwoKJwUiZ/rfpiVBhnaF0FK4HoA==}
@@ -9880,11 +9822,18 @@ packages:
     peerDependencies:
       typescript: '5'
 
-  next-intl@3.26.5:
-    resolution: {integrity: sha512-EQlCIfY0jOhRldiFxwSXG+ImwkQtDEfQeSOEQp6ieAGSLWGlgjdb/Ck/O7wMfC430ZHGeUKVKax8KGusTPKCgg==}
+  next-intl[email protected]:
+    resolution: {integrity: sha512-YcaT+R9z69XkGhpDarVFWUprrCMbxgIQYPUaXoE6LGVnLjGdo8hu3gL6bramDVjNKViYY8a/pXPy7Bna0mXORg==}
+
+  [email protected]:
+    resolution: {integrity: sha512-PvdBDWg+Leh7BR7GJUQbCDVVaBRn37GwDBWc9sv0rVQOJDQ5JU1rVzx9EEGuOGYo0DHAl70++9LQ7HxTawdL7w==}
     peerDependencies:
-      next: ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0
+      next: ^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0
+      typescript: ^5.0.0
+    peerDependenciesMeta:
+      typescript:
+        optional: true
 
   [email protected]:
     resolution: {integrity: sha512-B+AKNfYNIzh0vqQQKqQItTS8evEouKD7H5Hj3kmuPERwddR2TxvDSFZuTj6T7Jfn1oyeUyJMydPl1Bkxkh0W7A==}
@@ -9902,27 +9851,6 @@ packages:
   [email protected]:
     resolution: {integrity: sha512-wR/VKyJlaTbUT5k1uujEnk6O616YtWGt52s9FJa3tRCQ2qL2TGFTAklXJ0QdX1NTAEeP6rGFOTtHEDwveFrc2g==}
 
-  [email protected]:
-    resolution: {integrity: sha512-r0X65PNwyDDyOrWNKpQoZvOatw7BcsTPRKdwEqtc9cj3wv7mbBIk9tKed4klRaFXJdX0rugpuMTHslDrAU1bBg==}
-    engines: {node: ^18.18.0 || ^19.8.0 || >= 20.0.0}
-    hasBin: true
-    peerDependencies:
-      '@opentelemetry/api': ^1.1.0
-      '@playwright/test': ^1.51.1
-      babel-plugin-react-compiler: '*'
-      react: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
-      react-dom: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
-      sass: ^1.3.0
-    peerDependenciesMeta:
-      '@opentelemetry/api':
-        optional: true
-      '@playwright/test':
-        optional: true
-      babel-plugin-react-compiler:
-        optional: true
-      sass:
-        optional: true
-
   [email protected]:
     resolution: {integrity: sha512-hkyRkcu5x/41KoqnROkfTm2pZVbKxvbZRuNvKXLRXxs3VfyO0WhY50TQS40EuKO9SW3rBj/sF3WbVwDACeMZyw==}
     engines: {node: '>=20.9.0'}
@@ -10441,6 +10369,9 @@ packages:
     resolution: {integrity: sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==}
     engines: {node: '>=10.13.0'}
 
+  [email protected]:
+    resolution: {integrity: sha512-ECF4zHLbUItpUgE3OTtLKlPjeBN+fKEczj2zYjDfCGOzicNs0GK3Vg2IoAYwx7LH/XYw43fZQP6xnZ4TkNxSLQ==}
+
   [email protected]:
     resolution: {integrity: sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==}
     engines: {node: '>= 0.4'}
@@ -12079,10 +12010,10 @@ packages:
       '@types/react':
         optional: true
 
-  use-intl@3.26.5:
-    resolution: {integrity: sha512-OdsJnC/znPvHCHLQH/duvQNXnP1w0hPfS+tkSi3mAbfjYBGh4JnyfdwkQBfIVf7t8gs9eSX/CntxUMvtKdG2MQ==}
+  use-intl@4.8.3:
+    resolution: {integrity: sha512-nLxlC/RH+le6g3amA508Itnn/00mE+J22ui21QhOWo5V9hCEC43+WtnRAITbJW0ztVZphev5X9gvOf2/Dk9PLA==}
     peerDependencies:
-      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0
 
   [email protected]:
     resolution: {integrity: sha512-tpZZ+EX0gaghDAiFR37hj5MgY6ZN55kLiPkJsKxBMZ6GZdOSPJXiOzPM984oPYZ5AnehYx5WQp1+ME8I/P/pRA==}
@@ -14085,38 +14016,26 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
-  '@formatjs/ecma402-abstract@2.3.4':
+  '@formatjs/ecma402-abstract@3.1.1':
     dependencies:
-      '@formatjs/fast-memoize': 2.2.7
-      '@formatjs/intl-localematcher': 0.6.1
+      '@formatjs/fast-memoize': 3.1.0
+      '@formatjs/intl-localematcher': 0.8.1
       decimal.js: 10.6.0
       tslib: 2.8.1
 
-  '@formatjs/[email protected]':
-    dependencies:
-      tslib: 2.8.1
-
   '@formatjs/[email protected]':
     dependencies:
       tslib: 2.8.1
 
-  '@formatjs/icu-messageformat-parser@2.11.2':
+  '@formatjs/icu-messageformat-parser@3.5.1':
     dependencies:
-      '@formatjs/ecma402-abstract': 2.3.4
-      '@formatjs/icu-skeleton-parser': 1.8.14
+      '@formatjs/ecma402-abstract': 3.1.1
+      '@formatjs/icu-skeleton-parser': 2.1.1
       tslib: 2.8.1
 
-  '@formatjs/icu-skeleton-parser@1.8.14':
-    dependencies:
-      '@formatjs/ecma402-abstract': 2.3.4
-      tslib: 2.8.1
-
-  '@formatjs/[email protected]':
-    dependencies:
-      tslib: 2.8.1
-
-  '@formatjs/[email protected]':
+  '@formatjs/icu-skeleton-parser@2.1.1':
     dependencies:
+      '@formatjs/ecma402-abstract': 3.1.1
       tslib: 2.8.1
 
   '@formatjs/[email protected]':
@@ -14949,59 +14868,33 @@ snapshots:
       yaml: 2.8.1
       yargs: 17.7.2
 
-  '@next/[email protected]': {}
-
   '@next/[email protected]': {}
 
   '@next/[email protected]':
     dependencies:
       fast-glob: 3.3.1
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
-  '@next/[email protected]':
-    optional: true
-
   '@next/[email protected]':
     optional: true
 
@@ -16088,7 +15981,6 @@ snapshots:
       '@parcel/watcher-win32-arm64': 2.5.1
       '@parcel/watcher-win32-ia32': 2.5.1
       '@parcel/watcher-win32-x64': 2.5.1
-    optional: true
 
   '@phosphor-icons/[email protected]': {}
 
@@ -17541,6 +17433,8 @@ snapshots:
     transitivePeerDependencies:
       - chokidar
 
+  '@schummar/[email protected]': {}
+
   '@shikijs/[email protected]':
     dependencies:
       '@shikijs/types': 3.21.0
@@ -17755,10 +17649,8 @@ snapshots:
       '@swc/core-win32-ia32-msvc': 1.15.3
       '@swc/core-win32-x64-msvc': 1.15.3
       '@swc/helpers': 0.5.17
-    optional: true
 
-  '@swc/[email protected]':
-    optional: true
+  '@swc/[email protected]': {}
 
   '@swc/[email protected]':
     dependencies:
@@ -17771,7 +17663,6 @@ snapshots:
   '@swc/[email protected]':
     dependencies:
       '@swc/counter': 0.1.3
-    optional: true
 
   '@tailwindcss/[email protected]([email protected])':
     dependencies:
@@ -20948,7 +20839,7 @@ snapshots:
       '@types/react': 19.2.14
       algoliasearch: 5.37.0
       lucide-react: 0.574.0([email protected])
-      next: 16.1.6(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+      next: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
       react: 19.2.4
       react-dom: 19.2.4([email protected])
       zod: 4.3.6
@@ -20979,7 +20870,7 @@ snapshots:
       '@types/mdast': 4.0.4
       '@types/mdx': 2.0.13
       '@types/react': 19.2.14
-      next: 16.1.6(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+      next: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
       react: 19.2.4
       vite: 7.1.11(@types/[email protected])([email protected])([email protected])([email protected])([email protected])([email protected])([email protected])([email protected])
     transitivePeerDependencies:
@@ -21049,7 +20940,7 @@ snapshots:
     optionalDependencies:
       '@types/mdx': 2.0.13
       '@types/react': 19.2.14
-      next: 16.1.6(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+      next: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
     transitivePeerDependencies:
       - '@emotion/is-prop-valid'
       - '@types/react-dom'
@@ -21569,6 +21460,10 @@ snapshots:
     dependencies:
       safer-buffer: 2.1.2
 
+  [email protected]:
+    dependencies:
+      '@formatjs/icu-messageformat-parser': 3.5.1
+
   [email protected]:
     dependencies:
       reserved-identifiers: 1.2.0
@@ -21632,11 +21527,11 @@ snapshots:
       hasown: 2.0.2
       side-channel: 1.1.0
 
-  intl-messageformat@10.7.16:
+  intl-messageformat@11.1.2:
     dependencies:
-      '@formatjs/ecma402-abstract': 2.3.4
-      '@formatjs/fast-memoize': 2.2.7
-      '@formatjs/icu-messageformat-parser': 2.11.2
+      '@formatjs/ecma402-abstract': 3.1.1
+      '@formatjs/fast-memoize': 3.1.0
+      '@formatjs/icu-messageformat-parser': 3.5.1
       tslib: 2.8.1
 
   [email protected]: {}
@@ -23224,17 +23119,28 @@ snapshots:
     dependencies:
       typescript: 5.9.3
 
-  next-intl@3.26.5([email protected](@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected]):
-    dependencies:
-      '@formatjs/intl-localematcher': 0.5.10
-      negotiator: 1.0.0
-      next: 15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
-      react: 19.2.4
-      use-intl: 3.26.5([email protected])
+  next-intl[email protected]: {}
 
-  next-themes@0.2.1(next@15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))(react[email protected]([email protected]))([email protected]):
+  next-[email protected](@swc/helpers@0.5.17)(next@16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))(react@19.2.4)([email protected]):
     dependencies:
-      next: 15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+      '@formatjs/intl-localematcher': 0.8.1
+      '@parcel/watcher': 2.5.1
+      '@swc/core': 1.15.3(@swc/[email protected])
+      icu-minify: 4.8.3
+      negotiator: 1.0.0
+      next: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
+      next-intl-swc-plugin-extractor: 4.8.3
+      po-parser: 2.1.1
+      react: 19.2.4
+      use-intl: 4.8.3([email protected])
+    optionalDependencies:
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - '@swc/helpers'
+
+  [email protected]([email protected](@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]))([email protected]([email protected]))([email protected]):
+    dependencies:
+      next: 16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected])
       react: 19.2.4
       react-dom: 19.2.4([email protected])
 
@@ -23255,33 +23161,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  next@15.5.10(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]):
-    dependencies:
-      '@next/env': 15.5.10
-      '@swc/helpers': 0.5.15
-      caniuse-lite: 1.0.30001760
-      postcss: 8.4.31
-      react: 19.2.4
-      react-dom: 19.2.4([email protected])
-      styled-jsx: 5.1.6(@babel/[email protected])([email protected])
-    optionalDependencies:
-      '@next/swc-darwin-arm64': 15.5.7
-      '@next/swc-darwin-x64': 15.5.7
-      '@next/swc-linux-arm64-gnu': 15.5.7
-      '@next/swc-linux-arm64-musl': 15.5.7
-      '@next/swc-linux-x64-gnu': 15.5.7
-      '@next/swc-linux-x64-musl': 15.5.7
-      '@next/swc-win32-arm64-msvc': 15.5.7
-      '@next/swc-win32-x64-msvc': 15.5.7
-      '@opentelemetry/api': 1.9.0
-      '@playwright/test': 1.58.0
-      sass: 1.97.3
-      sharp: 0.34.5
-    transitivePeerDependencies:
-      - '@babel/core'
-      - babel-plugin-macros
-
-  [email protected](@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]):
+  next@16.1.6(@babel/[email protected])(@opentelemetry/[email protected])(@playwright/[email protected])([email protected]([email protected]))([email protected])([email protected]):
     dependencies:
       '@next/env': 16.1.6
       '@swc/helpers': 0.5.15
@@ -23329,8 +23209,7 @@ snapshots:
   [email protected]:
     optional: true
 
-  [email protected]:
-    optional: true
+  [email protected]: {}
 
   [email protected]: {}
 
@@ -23920,6 +23799,8 @@ snapshots:
 
   [email protected]: {}
 
+  [email protected]: {}
+
   [email protected]: {}
 
   [email protected]([email protected]):
@@ -25872,10 +25753,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.14
 
-  use-intl@3.26.5([email protected]):
+  use-intl@4.8.3([email protected]):
     dependencies:
-      '@formatjs/fast-memoize': 2.2.7
-      intl-messageformat: 10.7.16
+      '@formatjs/fast-memoize': 3.1.0
+      '@schummar/icu-type-parser': 1.21.5
+      icu-minify: 4.8.3
+      intl-messageformat: 11.1.2
       react: 19.2.4
 
   [email protected](@types/[email protected])([email protected]):