From 817ba754235aaf451f9919dcdc28b3b953890633 Mon Sep 17 00:00:00 2001
From: David Silva <ti@mkplace.com.br>
Date: Wed, 10 Apr 2024 04:36:04 -0300
Subject: [PATCH 1/3] feat(darkmode): add tailwind darkmode and change
 templates

---
 html/login/error.html                         | 10 +--
 html/login/login-config-totp.html             | 14 ++--
 html/login/login-idp-link-confirm.html        | 10 +--
 html/login/login-oauth-grant.html             | 12 ++--
 html/login/login-otp.html                     | 12 ++--
 html/login/login-page-expired.html            | 12 ++--
 html/login/login-password.html                | 12 ++--
 .../login-recovery-authn-code-config.html     | 16 ++---
 .../login-recovery-authn-code-input.html      | 12 ++--
 html/login/login-reset-password.html          | 12 ++--
 html/login/login-update-password.html         | 14 ++--
 html/login/login-update-profile.html          | 18 ++---
 html/login/login-username.html                | 72 ++++++++++++-------
 html/login/login-x509-info.html               | 12 ++--
 html/login/login.html                         | 72 ++++++++++++-------
 html/login/logout-confirm.html                | 10 +--
 html/login/register.html                      | 16 ++---
 html/login/select-authenticator.html          | 10 +--
 html/login/webauthn-authenticate.html         | 10 +--
 html/login/webauthn-error.html                | 10 +--
 package.json                                  |  3 +-
 tailwind.config.ts                            |  1 +
 .../keywind/login/components/atoms/alert.ftl  | 10 +--
 theme/keywind/login/components/atoms/body.ftl |  4 +-
 .../keywind/login/components/atoms/button.ftl |  2 +-
 theme/keywind/login/components/atoms/card.ftl |  2 +-
 .../login/components/atoms/checkbox.ftl       |  2 +-
 .../keywind/login/components/atoms/input.ftl  |  2 +-
 .../molecules/identity-provider.ftl           | 36 +++++-----
 .../resources/dist/assets/index-a7b84447.js   |  1 -
 .../dist/assets/module.esm-9a996e1c.js        |  5 --
 .../dist/assets/module.esm-a81817bb.js        |  5 ++
 .../resources/dist/assets/rfc4648-b81320ce.js |  1 +
 theme/keywind/login/resources/dist/index.css  |  2 +-
 theme/keywind/login/resources/dist/index.js   |  2 +-
 .../login/resources/dist/recoveryCodes.js     |  2 +-
 .../resources/dist/webAuthnAuthenticate.js    |  2 +-
 .../login/resources/dist/webAuthnRegister.js  |  2 +-
 theme/keywind/login/template.ftl              |  2 +-
 39 files changed, 250 insertions(+), 202 deletions(-)
 delete mode 100644 theme/keywind/login/resources/dist/assets/index-a7b84447.js
 delete mode 100644 theme/keywind/login/resources/dist/assets/module.esm-9a996e1c.js
 create mode 100644 theme/keywind/login/resources/dist/assets/module.esm-a81817bb.js
 create mode 100644 theme/keywind/login/resources/dist/assets/rfc4648-b81320ce.js
diff --git a/html/login/error.html b/html/login/error.html
index 061fb6e12..3d5f67dcc 100644
--- a/html/login/error.html
+++ b/html/login/error.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,11 +17,11 @@
           <h1 class="text-center text-xl">We are sorry...</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-config-totp.html b/html/login/login-config-totp.html
index f348b1f32..8547f77d4 100644
--- a/html/login/login-config-totp.html
+++ b/html/login/login-config-totp.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Mobile Authenticator Setup</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <ol class="list-decimal pl-4 space-y-2">
@@ -34,12 +34,12 @@ <h1 class="text-center text-xl">Mobile Authenticator Setup</h1>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <input name="totpSecret" type="hidden" value="totpSecret">
             <div>
-              <label class="sr-only" for="totp"> One-time code * </label> <input autofocus aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="totp" name="totp" placeholder="One-time code *" type="text" autocomplete="off">
+              <label class="sr-only" for="totp"> One-time code * </label> <input autofocus aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="totp" name="totp" placeholder="One-time code *" type="text" autocomplete="off">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="userLabel"> Device Name * </label> <input aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="userLabel" name="userLabel" placeholder="Device Name *" type="text" autocomplete="off">
+              <label class="sr-only" for="userLabel"> Device Name * </label> <input aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="userLabel" name="userLabel" placeholder="Device Name *" type="text" autocomplete="off">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -48,7 +48,7 @@ <h1 class="text-center text-xl">Mobile Authenticator Setup</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-idp-link-confirm.html b/html/login/login-idp-link-confirm.html
index 149daf805..ecf1d4604 100644
--- a/html/login/login-idp-link-confirm.html
+++ b/html/login/login-idp-link-confirm.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,14 +17,14 @@
           <h1 class="text-center text-xl">Account already exists</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="submitAction" type="submit" value="updateProfile"> Review profile </button> <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="submitAction" type="submit" value="linkAccount"> Add to existing account </button>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-oauth-grant.html b/html/login/login-oauth-grant.html
index 493fe8552..51a38fe64 100644
--- a/html/login/login-oauth-grant.html
+++ b/html/login/login-oauth-grant.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -18,7 +18,7 @@ <h1 class="text-center text-xl">
             <p>Grant Access to null</p></h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <h3>Do you grant these access privileges?</h3>
@@ -27,11 +27,11 @@ <h3>Do you grant these access privileges?</h3>
           <form class="m-0 space-y-4" method="post" action="oauthAction">
             <input name="code" type="hidden" value="code">
             <div class="flex flex-col pt-4 space-y-2">
-              <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="accept" type="submit"> Yes </button> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="cancel" type="submit"> No </button>
+              <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="accept" type="submit"> Yes </button> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="cancel" type="submit"> No </button>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-otp.html b/html/login/login-otp.html
index 8476be5c6..dfdfa0696 100644
--- a/html/login/login-otp.html
+++ b/html/login/login-otp.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,12 +17,12 @@
           <h1 class="text-center text-xl">Sign In</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <div>
-              <label class="sr-only" for="otp"> One-time code * </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="otp" name="otp" placeholder="One-time code *" type="text" autocomplete="off">
+              <label class="sr-only" for="otp"> One-time code * </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="otp" name="otp" placeholder="One-time code *" type="text" autocomplete="off">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -31,7 +31,7 @@ <h1 class="text-center text-xl">Sign In</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-page-expired.html b/html/login/login-page-expired.html
index 64db4a42f..c4d1ab61e 100644
--- a/html/login/login-page-expired.html
+++ b/html/login/login-page-expired.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,14 +17,14 @@
           <h1 class="text-center text-xl">Page has expired</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div class="flex flex-col pt-4 space-y-2">
-            <a class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" href="loginRestartFlowUrl"> Try again </a> <a class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" href="loginAction"> Continue </a>
+            <a class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" href="loginRestartFlowUrl"> Try again </a> <a class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" href="loginAction"> Continue </a>
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-password.html b/html/login/login-password.html
index cdca5ef9d..71aff975f 100644
--- a/html/login/login-password.html
+++ b/html/login/login-password.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,14 +17,14 @@
           <h1 class="text-center text-xl">Sign In</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction" onsubmit="login.disabled = true; return true;">
             <div>
               <label class="sr-only" for="password"> Password </label>
               <div class="relative" x-data="{ show: false }">
-                <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password" name="password" placeholder="Password" :type="show ? 'text' : 'password'"> <button @click="show = !show" aria-controls="password" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
+                <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password" name="password" placeholder="Password" :type="show ? 'text' : 'password'"> <button @click="show = !show" aria-controls="password" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
                   <div x-show="!show">
                     <svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                       <path d="M10 12.5C11.3807 12.5 12.5 11.3807 12.5 10C12.5 8.61929 11.3807 7.5 10 7.5C8.61929 7.5 7.5 8.61929 7.5 10C7.5 11.3807 8.61929 12.5 10 12.5Z" /> <path clip-rule="evenodd" d="M0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C2.10878 5.65788 5.7433 3 9.99859 3C14.256 3 17.892 5.66051 19.3347 9.40962C19.4816 9.79127 19.4814 10.2144 19.3344 10.5959C17.8902 14.3421 14.2557 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904ZM14.0004 10C14.0004 12.2091 12.2095 14 10.0004 14C7.79123 14 6.00037 12.2091 6.00037 10C6.00037 7.79086 7.79123 6 10.0004 6C12.2095 6 14.0004 7.79086 14.0004 10Z" fill-rule="evenodd" />
@@ -47,7 +47,7 @@ <h1 class="text-center text-xl">Sign In</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-recovery-authn-code-config.html b/html/login/login-recovery-authn-code-config.html
index 5a7a96a62..c20ab4f11 100644
--- a/html/login/login-recovery-authn-code-config.html
+++ b/html/login/login-recovery-authn-code-config.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -8,9 +8,9 @@
     <script defer src="http://localhost:5173/dist/recoveryCodes.js" type="module"></script>
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -18,11 +18,11 @@
           <h1 class="text-center text-xl">Recovery Authentication Codes</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div class="space-y-6" x-data="recoveryCodes">
-            <div class="bg-orange-100 text-orange-600 p-4 rounded-lg text-sm" role="alert">
+            <div class="dark:bg-opacity-90 bg-orange-100 text-orange-600 p-4 rounded-lg text-sm" role="alert">
               <div class="space-y-2">
                 <h4 class="font-medium">These recovery codes wont appear again after leaving this page</h4>
                 <p>Make sure to print, download, or copy them to a password manager and keep them save. Canceling this setup will remove these recovery codes from your account.</p>
@@ -33,12 +33,12 @@ <h4 class="font-medium">These recovery codes wont appear again after leaving thi
               <li>1111-1111-1111</li>
             </ul>
             <div class="flex items-stretch space-x-4 mb-4">
-              <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="print" type="button"> Print </button> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="download" type="button"> Download </button> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="copy" type="button"> Copy </button>
+              <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="print" type="button"> Print </button> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="download" type="button"> Download </button> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-2 py-1 text-xs flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" @click="copy" type="button"> Copy </button>
             </div>
             <form class="m-0 space-y-4" method="post" action="loginAction">
               <input name="generatedRecoveryAuthnCodes" type="hidden" value="generatedRecoveryAuthnCodesAsString"> <input name="generatedAt" type="hidden" value="&quot;generatedAt&quot;"> <input name="userLabel" type="hidden" value="Recovery codes">
               <div class="flex items-center">
-                <input class="border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="kcRecoveryCodesConfirmationCheck" name="kcRecoveryCodesConfirmationCheck" type="checkbox" required x-ref="confirmationCheck"> <label class="ml-2 text-secondary-600 text-sm" for="kcRecoveryCodesConfirmationCheck"> I have saved these codes somewhere safe </label>
+                <input class="dark:bg-zinc-800 dark:border-zinc-700 border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="kcRecoveryCodesConfirmationCheck" name="kcRecoveryCodesConfirmationCheck" type="checkbox" required x-ref="confirmationCheck"> <label class="ml-2 text-secondary-600 text-sm" for="kcRecoveryCodesConfirmationCheck"> I have saved these codes somewhere safe </label>
               </div>
               <div class="flex flex-col pt-4 space-y-2">
                 <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Complete setup </button>
@@ -46,7 +46,7 @@ <h4 class="font-medium">These recovery codes wont appear again after leaving thi
             </form>
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-recovery-authn-code-input.html b/html/login/login-recovery-authn-code-input.html
index 0f10d6f21..bed8464e6 100644
--- a/html/login/login-recovery-authn-code-input.html
+++ b/html/login/login-recovery-authn-code-input.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,12 +17,12 @@
           <h1 class="text-center text-xl">Login with a recovery authentication code</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <div>
-              <label class="sr-only" for="recoveryCodeInput"> Recovery code #"codeNumber" </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="recoveryCodeInput" name="recoveryCodeInput" placeholder="Recovery code #&quot;codeNumber&quot;" type="text" autocomplete="off">
+              <label class="sr-only" for="recoveryCodeInput"> Recovery code #"codeNumber" </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="recoveryCodeInput" name="recoveryCodeInput" placeholder="Recovery code #&quot;codeNumber&quot;" type="text" autocomplete="off">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -31,7 +31,7 @@ <h1 class="text-center text-xl">Login with a recovery authentication code</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-reset-password.html b/html/login/login-reset-password.html
index 17c549f75..4a202fdbf 100644
--- a/html/login/login-reset-password.html
+++ b/html/login/login-reset-password.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,12 +17,12 @@
           <h1 class="text-center text-xl">Forgot Your Password?</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <div>
-              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="Attempted Username">
+              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="Attempted Username">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -31,7 +31,7 @@ <h1 class="text-center text-xl">Forgot Your Password?</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
         <div class="space-y-4">
diff --git a/html/login/login-update-password.html b/html/login/login-update-password.html
index c223fa89f..033db7287 100644
--- a/html/login/login-update-password.html
+++ b/html/login/login-update-password.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Update password</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
@@ -25,7 +25,7 @@ <h1 class="text-center text-xl">Update password</h1>
             <div>
               <label class="sr-only" for="password-new"> New Password </label>
               <div class="relative" x-data="{ show: false }">
-                <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password-new" name="password-new" placeholder="New Password" :type="show ? 'text' : 'password'" autocomplete="new-password"> <button @click="show = !show" aria-controls="password-new" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
+                <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password-new" name="password-new" placeholder="New Password" :type="show ? 'text' : 'password'" autocomplete="new-password"> <button @click="show = !show" aria-controls="password-new" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
                   <div x-show="!show">
                     <svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                       <path d="M10 12.5C11.3807 12.5 12.5 11.3807 12.5 10C12.5 8.61929 11.3807 7.5 10 7.5C8.61929 7.5 7.5 8.61929 7.5 10C7.5 11.3807 8.61929 12.5 10 12.5Z" /> <path clip-rule="evenodd" d="M0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C2.10878 5.65788 5.7433 3 9.99859 3C14.256 3 17.892 5.66051 19.3347 9.40962C19.4816 9.79127 19.4814 10.2144 19.3344 10.5959C17.8902 14.3421 14.2557 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904ZM14.0004 10C14.0004 12.2091 12.2095 14 10.0004 14C7.79123 14 6.00037 12.2091 6.00037 10C6.00037 7.79086 7.79123 6 10.0004 6C12.2095 6 14.0004 7.79086 14.0004 10Z" fill-rule="evenodd" />
@@ -43,7 +43,7 @@ <h1 class="text-center text-xl">Update password</h1>
             <div>
               <label class="sr-only" for="password-confirm"> Confirm password </label>
               <div class="relative" x-data="{ show: false }">
-                <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password-confirm" name="password-confirm" placeholder="Confirm password" :type="show ? 'text' : 'password'" autocomplete="new-password"> <button @click="show = !show" aria-controls="password-confirm" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
+                <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password-confirm" name="password-confirm" placeholder="Confirm password" :type="show ? 'text' : 'password'" autocomplete="new-password"> <button @click="show = !show" aria-controls="password-confirm" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
                   <div x-show="!show">
                     <svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                       <path d="M10 12.5C11.3807 12.5 12.5 11.3807 12.5 10C12.5 8.61929 11.3807 7.5 10 7.5C8.61929 7.5 7.5 8.61929 7.5 10C7.5 11.3807 8.61929 12.5 10 12.5Z" /> <path clip-rule="evenodd" d="M0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C2.10878 5.65788 5.7433 3 9.99859 3C14.256 3 17.892 5.66051 19.3347 9.40962C19.4816 9.79127 19.4814 10.2144 19.3344 10.5959C17.8902 14.3421 14.2557 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904ZM14.0004 10C14.0004 12.2091 12.2095 14 10.0004 14C7.79123 14 6.00037 12.2091 6.00037 10C6.00037 7.79086 7.79123 6 10.0004 6C12.2095 6 14.0004 7.79086 14.0004 10Z" fill-rule="evenodd" />
@@ -63,7 +63,7 @@ <h1 class="text-center text-xl">Update password</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-update-profile.html b/html/login/login-update-profile.html
index 971a3ffc7..b6cd4c966 100644
--- a/html/login/login-update-profile.html
+++ b/html/login/login-update-profile.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,27 +17,27 @@
           <h1 class="text-center text-xl">Update Account Information</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <div>
-              <label class="sr-only" for="username"> Username </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Username" type="text" autocomplete="username" value="">
+              <label class="sr-only" for="username"> Username </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Username" type="text" autocomplete="username" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="email"> Email </label> <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="email" name="email" placeholder="Email" type="email" autocomplete="email" value="">
+              <label class="sr-only" for="email"> Email </label> <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="email" name="email" placeholder="Email" type="email" autocomplete="email" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="firstName"> First name </label> <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="firstName" name="firstName" placeholder="First name" type="text" autocomplete="given-name" value="">
+              <label class="sr-only" for="firstName"> First name </label> <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="firstName" name="firstName" placeholder="First name" type="text" autocomplete="given-name" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="lastName"> Last name </label> <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="lastName" name="lastName" placeholder="Last name" type="text" autocomplete="family-name" value="">
+              <label class="sr-only" for="lastName"> Last name </label> <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="lastName" name="lastName" placeholder="Last name" type="text" autocomplete="family-name" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -46,7 +46,7 @@ <h1 class="text-center text-xl">Update Account Information</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login-username.html b/html/login/login-username.html
index d5db05ed7..04d2b33e2 100644
--- a/html/login/login-username.html
+++ b/html/login/login-username.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,18 +17,18 @@
           <h1 class="text-center text-xl">Sign in to your account</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction" onsubmit="login.disabled = true; return true;">
             <div>
-              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="">
+              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div class="flex items-center justify-between">
               <div class="flex items-center">
-                <input checked class="border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="rememberMe" name="rememberMe" type="checkbox"> <label class="ml-2 text-secondary-600 text-sm" for="rememberMe"> Remember me </label>
+                <input checked class="dark:bg-zinc-800 dark:border-zinc-700 border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="rememberMe" name="rememberMe" type="checkbox"> <label class="ml-2 text-secondary-600 text-sm" for="rememberMe"> Remember me </label>
               </div>
             </div>
             <div class="flex flex-col pt-4 space-y-2">
@@ -36,29 +36,49 @@ <h1 class="text-center text-xl">Sign in to your account</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
-          <div class="pt-4 separate text-secondary-600 text-sm">
-            Or sign in with
+          <div class="relative flex py-4 text-gray-400 text-sm items-center">
+              <div class="flex-grow border-t dark:border-zinc-700"></div>
+              <span class="flex-shrink mx-4">Or sign in with</span>
+              <div class="flex-grow border-t dark:border-zinc-700"></div>
           </div>
           <div class="gap-4 grid grid-cols-3">
-            <a class="hover:bg-provider-facebook/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="facebook" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>Facebook</title><path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.38822 22.954 10.125 23.8542V15.4688H7.07813V12H10.125V9.35626C10.125 6.34875 11.9165 4.68751 14.6576 4.68751C15.9705 4.68751 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.3399 7.875 13.875 8.80002 13.875 9.74901V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2" /> <path d="M16.6711 15.4688L17.2031 12H13.875V9.74901C13.875 8.80002 14.3399 7.875 15.8306 7.875H17.3438V4.92188C17.3438 4.92188 15.9705 4.68751 14.6576 4.68751C11.9165 4.68751 10.125 6.34875 10.125 9.35626V12H7.07813V15.4688H10.125V23.8542C10.7453 23.9514 11.3722 24.0002 12 24C12.6379 24 13.2641 23.9501 13.875 23.8542V15.4688H16.6711Z" fill="white" />
-                </svg>
-              </div></a> <a class="hover:bg-provider-github/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="github" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>GitHub</title><path d="M11.8452 0C5.13387 0 0 5.09516 0 11.8065C0 17.1726 3.37742 21.7645 8.20161 23.3806C8.82097 23.4919 9.03871 23.1097 9.03871 22.7952C9.03871 22.4952 9.02419 20.8403 9.02419 19.8242C9.02419 19.8242 5.6371 20.55 4.92581 18.3823C4.92581 18.3823 4.37419 16.9742 3.58065 16.6113C3.58065 16.6113 2.47258 15.8516 3.65806 15.8661C3.65806 15.8661 4.8629 15.9629 5.52581 17.1145C6.58548 18.9823 8.36129 18.4452 9.05323 18.1258C9.16452 17.3516 9.47903 16.8145 9.82742 16.4952C7.12258 16.1952 4.39355 15.8032 4.39355 11.1484C4.39355 9.81774 4.76129 9.15 5.53548 8.29839C5.40968 7.98387 4.99839 6.6871 5.66129 5.0129C6.67258 4.69839 9 6.31936 9 6.31936C9.96774 6.04839 11.0081 5.90806 12.0387 5.90806C13.0694 5.90806 14.1097 6.04839 15.0774 6.31936C15.0774 6.31936 17.4048 4.69355 18.4161 5.0129C19.079 6.69194 18.6677 7.98387 18.5419 8.29839C19.3161 9.15484 19.7903 9.82258 19.7903 11.1484C19.7903 15.8177 16.9403 16.1903 14.2355 16.4952C14.6806 16.8774 15.0581 17.6032 15.0581 18.7403C15.0581 20.371 15.0435 22.3887 15.0435 22.7855C15.0435 23.1 15.2661 23.4823 15.8806 23.371C20.7194 21.7645 24 17.1726 24 11.8065C24 5.09516 18.5565 0 11.8452 0Z" fill="#181717" />
-                </svg>
-              </div></a> <a class="hover:bg-provider-google/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="google" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>Google</title><path d="M23.76 12.2727C23.76 11.4218 23.6836 10.6036 23.5418 9.81818H12.24V14.46H18.6982C18.42 15.96 17.5745 17.2309 16.3036 18.0818L18.2427 19.5873L20.1818 21.0927C22.4509 19.0036 23.76 15.9273 23.76 12.2727Z" fill="#4285F4" /> <path d="M12.24 24C15.48 24 18.1964 22.9255 20.1818 21.0927L16.3036 18.0818C15.2291 18.8018 13.8545 19.2273 12.24 19.2273C9.11455 19.2273 6.46909 17.1164 5.52545 14.28L3.52091 15.8345L1.51636 17.3891C3.49091 21.3109 7.54909 24 12.24 24Z" fill="#34A853" /> <path d="M5.52545 14.28C5.28545 13.56 5.14909 12.7909 5.14909 12C5.14909 11.2091 5.28545 10.44 5.52545 9.72L3.52091 8.16546L1.51636 6.61091C0.703637 8.23091 0.240001 10.0636 0.240001 12C0.240001 13.9364 0.703637 15.7691 1.51636 17.3891L5.52545 14.28Z" fill="#FBBC05" /> <path d="M12.24 4.77273C14.0018 4.77273 15.5836 5.37818 16.8273 6.56727L20.2691 3.12545C18.1909 1.18909 15.4745 0 12.24 0C7.54909 0 3.49091 2.68909 1.51636 6.61091L5.52545 9.72C6.46909 6.88364 9.11455 4.77273 12.24 4.77273Z" fill="#EA4335" />
-                </svg>
-              </div></a>
-          </div>
+  <div class="dark:bg-zinc-600 rounded-lg">
+    <a class="hover:bg-provider-facebook/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="facebook" href="loginUrl" type="button">
+      <div class="h-6 w-6">
+        <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <title>Facebook</title>
+          <path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.38822 22.954 10.125 23.8542V15.4688H7.07813V12H10.125V9.35626C10.125 6.34875 11.9165 4.68751 14.6576 4.68751C15.9705 4.68751 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.3399 7.875 13.875 8.80002 13.875 9.74901V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2" />
+          <path d="M16.6711 15.4688L17.2031 12H13.875V9.74901C13.875 8.80002 14.3399 7.875 15.8306 7.875H17.3438V4.92188C17.3438 4.92188 15.9705 4.68751 14.6576 4.68751C11.9165 4.68751 10.125 6.34875 10.125 9.35626V12H7.07813V15.4688H10.125V23.8542C10.7453 23.9514 11.3722 24.0002 12 24C12.6379 24 13.2641 23.9501 13.875 23.8542V15.4688H16.6711Z" fill="white" />
+        </svg>
+      </div>
+    </a>
+  </div>
+  <div class="dark:bg-zinc-600 rounded-lg">
+    <a class="hover:bg-provider-github/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="github" href="loginUrl" type="button">
+      <div class="h-6 w-6">
+        <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <title>GitHub</title>
+          <path d="M11.8452 0C5.13387 0 0 5.09516 0 11.8065C0 17.1726 3.37742 21.7645 8.20161 23.3806C8.82097 23.4919 9.03871 23.1097 9.03871 22.7952C9.03871 22.4952 9.02419 20.8403 9.02419 19.8242C9.02419 19.8242 5.6371 20.55 4.92581 18.3823C4.92581 18.3823 4.37419 16.9742 3.58065 16.6113C3.58065 16.6113 2.47258 15.8516 3.65806 15.8661C3.65806 15.8661 4.8629 15.9629 5.52581 17.1145C6.58548 18.9823 8.36129 18.4452 9.05323 18.1258C9.16452 17.3516 9.47903 16.8145 9.82742 16.4952C7.12258 16.1952 4.39355 15.8032 4.39355 11.1484C4.39355 9.81774 4.76129 9.15 5.53548 8.29839C5.40968 7.98387 4.99839 6.6871 5.66129 5.0129C6.67258 4.69839 9 6.31936 9 6.31936C9.96774 6.04839 11.0081 5.90806 12.0387 5.90806C13.0694 5.90806 14.1097 6.04839 15.0774 6.31936C15.0774 6.31936 17.4048 4.69355 18.4161 5.0129C19.079 6.69194 18.6677 7.98387 18.5419 8.29839C19.3161 9.15484 19.7903 9.82258 19.7903 11.1484C19.7903 15.8177 16.9403 16.1903 14.2355 16.4952C14.6806 16.8774 15.0581 17.6032 15.0581 18.7403C15.0581 20.371 15.0435 22.3887 15.0435 22.7855C15.0435 23.1 15.2661 23.4823 15.8806 23.371C20.7194 21.7645 24 17.1726 24 11.8065C24 5.09516 18.5565 0 11.8452 0Z" fill="#181717" />
+        </svg>
+      </div>
+    </a>
+  </div>
+  <div class="dark:bg-zinc-600 rounded-lg">
+    <a class="hover:bg-provider-google/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="google" href="loginUrl" type="button">
+      <div class="h-6 w-6">
+        <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <title>Google</title>
+          <path d="M23.76 12.2727C23.76 11.4218 23.6836 10.6036 23.5418 9.81818H12.24V14.46H18.6982C18.42 15.96 17.5745 17.2309 16.3036 18.0818L18.2427 19.5873L20.1818 21.0927C22.4509 19.0036 23.76 15.9273 23.76 12.2727Z" fill="#4285F4" />
+          <path d="M12.24 24C15.48 24 18.1964 22.9255 20.1818 21.0927L16.3036 18.0818C15.2291 18.8018 13.8545 19.2273 12.24 19.2273C9.11455 19.2273 6.46909 17.1164 5.52545 14.28L3.52091 15.8345L1.51636 17.3891C3.49091 21.3109 7.54909 24 12.24 24Z" fill="#34A853" />
+          <path d="M5.52545 14.28C5.28545 13.56 5.14909 12.7909 5.14909 12C5.14909 11.2091 5.28545 10.44 5.52545 9.72L3.52091 8.16546L1.51636 6.61091C0.703637 8.23091 0.240001 10.0636 0.240001 12C0.240001 13.9364 0.703637 15.7691 1.51636 17.3891L5.52545 14.28Z" fill="#FBBC05" />
+          <path d="M12.24 4.77273C14.0018 4.77273 15.5836 5.37818 16.8273 6.56727L20.2691 3.12545C18.1909 1.18909 15.4745 0 12.24 0C7.54909 0 3.49091 2.68909 1.51636 6.61091L5.52545 9.72C6.46909 6.88364 9.11455 4.77273 12.24 4.77273Z" fill="#EA4335" />
+        </svg>
+      </div>
+    </a>
+  </div>
+</div>
         </div>
         <div class="space-y-4">
           <div class="text-center">
diff --git a/html/login/login-x509-info.html b/html/login/login-x509-info.html
index 5d26f88ef..b59d60d8c 100644
--- a/html/login/login-x509-info.html
+++ b/html/login/login-x509-info.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Sign In</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div>
@@ -33,11 +33,11 @@ <h1 class="text-center text-xl">Sign In</h1>
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction">
             <div class="flex flex-col pt-4 space-y-2">
-              <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="login" type="submit"> Continue </button> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="cancel" type="submit"> Ignore </button>
+              <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="login" type="submit"> Continue </button> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="cancel" type="submit"> Ignore </button>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/login.html b/html/login/login.html
index d24c35875..7d75fea1d 100644
--- a/html/login/login.html
+++ b/html/login/login.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,20 +17,20 @@
           <h1 class="text-center text-xl">Sign in to your account</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="loginAction" onsubmit="login.disabled = true; return true;">
             <input name="credentialId" type="hidden" value="">
             <div>
-              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="">
+              <label class="sr-only" for="username"> Email </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="username" name="username" placeholder="Email" type="text" autocomplete="email" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
               <label class="sr-only" for="password"> Password </label>
               <div class="relative" x-data="{ show: false }">
-                <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password" name="password" placeholder="Password" :type="show ? 'text' : 'password'"> <button @click="show = !show" aria-controls="password" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
+                <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="password" name="password" placeholder="Password" :type="show ? 'text' : 'password'"> <button @click="show = !show" aria-controls="password" :aria-expanded="show" class="absolute text-secondary-400 right-3 top-3 sm:top-2" type="button">
                   <div x-show="!show">
                     <svg class="h-5 w-5" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                       <path d="M10 12.5C11.3807 12.5 12.5 11.3807 12.5 10C12.5 8.61929 11.3807 7.5 10 7.5C8.61929 7.5 7.5 8.61929 7.5 10C7.5 11.3807 8.61929 12.5 10 12.5Z" /> <path clip-rule="evenodd" d="M0.664255 10.5904C0.517392 10.2087 0.517518 9.78563 0.66461 9.40408C2.10878 5.65788 5.7433 3 9.99859 3C14.256 3 17.892 5.66051 19.3347 9.40962C19.4816 9.79127 19.4814 10.2144 19.3344 10.5959C17.8902 14.3421 14.2557 17 10.0004 17C5.74298 17 2.10698 14.3395 0.664255 10.5904ZM14.0004 10C14.0004 12.2091 12.2095 14 10.0004 14C7.79123 14 6.00037 12.2091 6.00037 10C6.00037 7.79086 7.79123 6 10.0004 6C12.2095 6 14.0004 7.79086 14.0004 10Z" fill-rule="evenodd" />
@@ -47,7 +47,7 @@ <h1 class="text-center text-xl">Sign in to your account</h1>
             </div>
             <div class="flex items-center justify-between">
               <div class="flex items-center">
-                <input checked class="border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="rememberMe" name="rememberMe" type="checkbox"> <label class="ml-2 text-secondary-600 text-sm" for="rememberMe"> Remember me </label>
+                <input checked class="dark:bg-zinc-800 dark:border-zinc-700 border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50" id="rememberMe" name="rememberMe" type="checkbox"> <label class="ml-2 text-secondary-600 text-sm" for="rememberMe"> Remember me </label>
               </div><a class="text-primary-600 hover:text-primary-500 text-sm inline-flex" href="loginResetCredentialsUrl"> Forgot Password? </a>
             </div>
             <div class="flex flex-col pt-4 space-y-2">
@@ -55,28 +55,48 @@ <h1 class="text-center text-xl">Sign in to your account</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
-          <div class="pt-4 separate text-secondary-600 text-sm">
-            Or sign in with
+          <div class="relative flex py-4 text-gray-400 text-sm items-center">
+              <div class="flex-grow border-t dark:border-zinc-700"></div>
+              <span class="flex-shrink mx-4">Or sign in with</span>
+              <div class="flex-grow border-t dark:border-zinc-700"></div>
           </div>
           <div class="gap-4 grid grid-cols-3">
-            <a class="hover:bg-provider-facebook/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="facebook" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>Facebook</title><path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.38822 22.954 10.125 23.8542V15.4688H7.07813V12H10.125V9.35626C10.125 6.34875 11.9165 4.68751 14.6576 4.68751C15.9705 4.68751 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.3399 7.875 13.875 8.80002 13.875 9.74901V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2" /> <path d="M16.6711 15.4688L17.2031 12H13.875V9.74901C13.875 8.80002 14.3399 7.875 15.8306 7.875H17.3438V4.92188C17.3438 4.92188 15.9705 4.68751 14.6576 4.68751C11.9165 4.68751 10.125 6.34875 10.125 9.35626V12H7.07813V15.4688H10.125V23.8542C10.7453 23.9514 11.3722 24.0002 12 24C12.6379 24 13.2641 23.9501 13.875 23.8542V15.4688H16.6711Z" fill="white" />
-                </svg>
-              </div></a> <a class="hover:bg-provider-github/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="github" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>GitHub</title><path d="M11.8452 0C5.13387 0 0 5.09516 0 11.8065C0 17.1726 3.37742 21.7645 8.20161 23.3806C8.82097 23.4919 9.03871 23.1097 9.03871 22.7952C9.03871 22.4952 9.02419 20.8403 9.02419 19.8242C9.02419 19.8242 5.6371 20.55 4.92581 18.3823C4.92581 18.3823 4.37419 16.9742 3.58065 16.6113C3.58065 16.6113 2.47258 15.8516 3.65806 15.8661C3.65806 15.8661 4.8629 15.9629 5.52581 17.1145C6.58548 18.9823 8.36129 18.4452 9.05323 18.1258C9.16452 17.3516 9.47903 16.8145 9.82742 16.4952C7.12258 16.1952 4.39355 15.8032 4.39355 11.1484C4.39355 9.81774 4.76129 9.15 5.53548 8.29839C5.40968 7.98387 4.99839 6.6871 5.66129 5.0129C6.67258 4.69839 9 6.31936 9 6.31936C9.96774 6.04839 11.0081 5.90806 12.0387 5.90806C13.0694 5.90806 14.1097 6.04839 15.0774 6.31936C15.0774 6.31936 17.4048 4.69355 18.4161 5.0129C19.079 6.69194 18.6677 7.98387 18.5419 8.29839C19.3161 9.15484 19.7903 9.82258 19.7903 11.1484C19.7903 15.8177 16.9403 16.1903 14.2355 16.4952C14.6806 16.8774 15.0581 17.6032 15.0581 18.7403C15.0581 20.371 15.0435 22.3887 15.0435 22.7855C15.0435 23.1 15.2661 23.4823 15.8806 23.371C20.7194 21.7645 24 17.1726 24 11.8065C24 5.09516 18.5565 0 11.8452 0Z" fill="#181717" />
-                </svg>
-              </div></a> <a class="hover:bg-provider-google/10 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="google" href="loginUrl" type="button">
-              <div class="h-6 w-6">
-                <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <title>Google</title><path d="M23.76 12.2727C23.76 11.4218 23.6836 10.6036 23.5418 9.81818H12.24V14.46H18.6982C18.42 15.96 17.5745 17.2309 16.3036 18.0818L18.2427 19.5873L20.1818 21.0927C22.4509 19.0036 23.76 15.9273 23.76 12.2727Z" fill="#4285F4" /> <path d="M12.24 24C15.48 24 18.1964 22.9255 20.1818 21.0927L16.3036 18.0818C15.2291 18.8018 13.8545 19.2273 12.24 19.2273C9.11455 19.2273 6.46909 17.1164 5.52545 14.28L3.52091 15.8345L1.51636 17.3891C3.49091 21.3109 7.54909 24 12.24 24Z" fill="#34A853" /> <path d="M5.52545 14.28C5.28545 13.56 5.14909 12.7909 5.14909 12C5.14909 11.2091 5.28545 10.44 5.52545 9.72L3.52091 8.16546L1.51636 6.61091C0.703637 8.23091 0.240001 10.0636 0.240001 12C0.240001 13.9364 0.703637 15.7691 1.51636 17.3891L5.52545 14.28Z" fill="#FBBC05" /> <path d="M12.24 4.77273C14.0018 4.77273 15.5836 5.37818 16.8273 6.56727L20.2691 3.12545C18.1909 1.18909 15.4745 0 12.24 0C7.54909 0 3.49091 2.68909 1.51636 6.61091L5.52545 9.72C6.46909 6.88364 9.11455 4.77273 12.24 4.77273Z" fill="#EA4335" />
-                </svg>
-              </div></a>
+            <div class="dark:bg-zinc-600 rounded-lg">
+              <a class="hover:bg-provider-facebook/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="facebook" href="loginUrl" type="button">
+                <div class="h-6 w-6">
+                  <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <title>Facebook</title>
+                    <path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.38822 22.954 10.125 23.8542V15.4688H7.07813V12H10.125V9.35626C10.125 6.34875 11.9165 4.68751 14.6576 4.68751C15.9705 4.68751 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.3399 7.875 13.875 8.80002 13.875 9.74901V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2" />
+                    <path d="M16.6711 15.4688L17.2031 12H13.875V9.74901C13.875 8.80002 14.3399 7.875 15.8306 7.875H17.3438V4.92188C17.3438 4.92188 15.9705 4.68751 14.6576 4.68751C11.9165 4.68751 10.125 6.34875 10.125 9.35626V12H7.07813V15.4688H10.125V23.8542C10.7453 23.9514 11.3722 24.0002 12 24C12.6379 24 13.2641 23.9501 13.875 23.8542V15.4688H16.6711Z" fill="white" />
+                  </svg>
+                </div>
+              </a>
+            </div>
+            <div class="dark:bg-zinc-600 rounded-lg">
+              <a class="hover:bg-provider-github/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="github" href="loginUrl" type="button">
+                <div class="h-6 w-6">
+                  <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <title>GitHub</title>
+                    <path d="M11.8452 0C5.13387 0 0 5.09516 0 11.8065C0 17.1726 3.37742 21.7645 8.20161 23.3806C8.82097 23.4919 9.03871 23.1097 9.03871 22.7952C9.03871 22.4952 9.02419 20.8403 9.02419 19.8242C9.02419 19.8242 5.6371 20.55 4.92581 18.3823C4.92581 18.3823 4.37419 16.9742 3.58065 16.6113C3.58065 16.6113 2.47258 15.8516 3.65806 15.8661C3.65806 15.8661 4.8629 15.9629 5.52581 17.1145C6.58548 18.9823 8.36129 18.4452 9.05323 18.1258C9.16452 17.3516 9.47903 16.8145 9.82742 16.4952C7.12258 16.1952 4.39355 15.8032 4.39355 11.1484C4.39355 9.81774 4.76129 9.15 5.53548 8.29839C5.40968 7.98387 4.99839 6.6871 5.66129 5.0129C6.67258 4.69839 9 6.31936 9 6.31936C9.96774 6.04839 11.0081 5.90806 12.0387 5.90806C13.0694 5.90806 14.1097 6.04839 15.0774 6.31936C15.0774 6.31936 17.4048 4.69355 18.4161 5.0129C19.079 6.69194 18.6677 7.98387 18.5419 8.29839C19.3161 9.15484 19.7903 9.82258 19.7903 11.1484C19.7903 15.8177 16.9403 16.1903 14.2355 16.4952C14.6806 16.8774 15.0581 17.6032 15.0581 18.7403C15.0581 20.371 15.0435 22.3887 15.0435 22.7855C15.0435 23.1 15.2661 23.4823 15.8806 23.371C20.7194 21.7645 24 17.1726 24 11.8065C24 5.09516 18.5565 0 11.8452 0Z" fill="#181717" />
+                  </svg>
+                </div>
+              </a>
+            </div>
+            <div class="dark:bg-zinc-600 rounded-lg">
+              <a class="hover:bg-provider-google/10 dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent" data-provider="google" href="loginUrl" type="button">
+                <div class="h-6 w-6">
+                  <svg viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <title>Google</title>
+                    <path d="M23.76 12.2727C23.76 11.4218 23.6836 10.6036 23.5418 9.81818H12.24V14.46H18.6982C18.42 15.96 17.5745 17.2309 16.3036 18.0818L18.2427 19.5873L20.1818 21.0927C22.4509 19.0036 23.76 15.9273 23.76 12.2727Z" fill="#4285F4" />
+                    <path d="M12.24 24C15.48 24 18.1964 22.9255 20.1818 21.0927L16.3036 18.0818C15.2291 18.8018 13.8545 19.2273 12.24 19.2273C9.11455 19.2273 6.46909 17.1164 5.52545 14.28L3.52091 15.8345L1.51636 17.3891C3.49091 21.3109 7.54909 24 12.24 24Z" fill="#34A853" />
+                    <path d="M5.52545 14.28C5.28545 13.56 5.14909 12.7909 5.14909 12C5.14909 11.2091 5.28545 10.44 5.52545 9.72L3.52091 8.16546L1.51636 6.61091C0.703637 8.23091 0.240001 10.0636 0.240001 12C0.240001 13.9364 0.703637 15.7691 1.51636 17.3891L5.52545 14.28Z" fill="#FBBC05" />
+                    <path d="M12.24 4.77273C14.0018 4.77273 15.5836 5.37818 16.8273 6.56727L20.2691 3.12545C18.1909 1.18909 15.4745 0 12.24 0C7.54909 0 3.49091 2.68909 1.51636 6.61091L5.52545 9.72C6.46909 6.88364 9.11455 4.77273 12.24 4.77273Z" fill="#EA4335" />
+                  </svg>
+                </div>
+              </a>
+            </div>
           </div>
         </div>
         <div class="space-y-4">
diff --git a/html/login/logout-confirm.html b/html/login/logout-confirm.html
index e13b12de6..fbe2b5a1b 100644
--- a/html/login/logout-confirm.html
+++ b/html/login/logout-confirm.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Logging out</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <p>Do you want to log out?</p>
@@ -25,7 +25,7 @@ <h1 class="text-center text-xl">Logging out</h1>
             <input name="session_code" type="hidden" value="code"> <button class="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" name="confirmLogout" type="submit" value="Logout"> Logout </button>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/register.html b/html/login/register.html
index b1f3691af..fbe0c2a65 100644
--- a/html/login/register.html
+++ b/html/login/register.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,22 +17,22 @@
           <h1 class="text-center text-xl">Register</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <form class="m-0 space-y-4" method="post" action="registrationAction">
             <div>
-              <label class="sr-only" for="firstName"> First name </label> <input autofocus required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="firstName" name="firstName" placeholder="First name" type="text" autocomplete="given-name" value="">
+              <label class="sr-only" for="firstName"> First name </label> <input autofocus required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="firstName" name="firstName" placeholder="First name" type="text" autocomplete="given-name" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="lastName"> Last name </label> <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="lastName" name="lastName" placeholder="Last name" type="text" autocomplete="family-name" value="">
+              <label class="sr-only" for="lastName"> Last name </label> <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="lastName" name="lastName" placeholder="Last name" type="text" autocomplete="family-name" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
             <div>
-              <label class="sr-only" for="email"> Email </label> <input required aria-invalid="false" class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="email" name="email" placeholder="Email" type="email" autocomplete="email" value="">
+              <label class="sr-only" for="email"> Email </label> <input required aria-invalid="false" class="dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm" id="email" name="email" placeholder="Email" type="email" autocomplete="email" value="">
               <div class="mt-2 text-red-600 text-sm">
               </div>
             </div>
@@ -41,7 +41,7 @@ <h1 class="text-center text-xl">Register</h1>
             </div>
           </form>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/select-authenticator.html b/html/login/select-authenticator.html
index 248bea36a..a339451fa 100644
--- a/html/login/select-authenticator.html
+++ b/html/login/select-authenticator.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Select login method</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div x-data>
@@ -32,7 +32,7 @@ <h1 class="text-center text-xl">Select login method</h1>
             </form>
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/webauthn-authenticate.html b/html/login/webauthn-authenticate.html
index dbc3c3ed0..6882b15fa 100644
--- a/html/login/webauthn-authenticate.html
+++ b/html/login/webauthn-authenticate.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -8,9 +8,9 @@
     <script defer src="http://localhost:5173/dist/webAuthnAuthenticate.js" type="module"></script>
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -18,7 +18,7 @@
           <h1 class="text-center text-xl">Security Key login</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div x-data="webAuthnAuthenticate">
@@ -30,7 +30,7 @@ <h1 class="text-center text-xl">Security Key login</h1>
             </div>
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/html/login/webauthn-error.html b/html/login/webauthn-error.html
index 24e893d6a..d48ff5423 100644
--- a/html/login/webauthn-error.html
+++ b/html/login/webauthn-error.html
@@ -1,4 +1,4 @@
-<html lang="en">
+<html lang="en" class="dark">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
@@ -7,9 +7,9 @@
     <link href="http://localhost:5173/src/index.css" rel="stylesheet">
     <script defer src="http://localhost:5173/src/index.ts" type="module"></script>
   </head>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
     <div class="max-w-md space-y-6 w-full">
-      <div class="bg-white p-8 rounded-lg space-y-6">
+      <div class="dark:bg-zinc-900 bg-white p-8 rounded-lg space-y-6">
         <div class="space-y-4">
           <div class="font-bold text-center text-2xl">
             Keywind
@@ -17,7 +17,7 @@
           <h1 class="text-center text-xl">Security Key Error</h1>
         </div>
         <div class="space-y-4">
-          <div class="bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
+          <div class="dark:bg-opacity-90 bg-red-100 text-red-600 p-4 rounded-lg text-sm" role="alert">
             Example of an error message
           </div>
           <div x-data>
@@ -29,7 +29,7 @@ <h1 class="text-center text-xl">Security Key Error</h1>
             </div>
           </div>
           <form action="loginAction" method="post">
-            <input name="tryAnotherWay" type="hidden" value="on"> <button class="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
+            <input name="tryAnotherWay" type="hidden" value="on"> <button class="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900 px-4 py-2 text-sm flex justify-center relative rounded-lg w-full focus:outline-none focus:ring-2 focus:ring-offset-2" type="submit"> Try Another Way </button>
           </form>
         </div>
       </div>
diff --git a/package.json b/package.json
index 284ee601c..182a7b562 100644
--- a/package.json
+++ b/package.json
@@ -23,5 +23,6 @@
     "typescript": "^5.2.2",
     "vite": "^4.4.9",
     "vite-node": "^0.34.5"
-  }
+  },
+  "packageManager": "pnpm@8.15.6+sha256.01c01eeb990e379b31ef19c03e9d06a14afa5250b82e81303f88721c99ff2e6f"
 }
diff --git a/tailwind.config.ts b/tailwind.config.ts
index cb7d1a0d6..bf235ff6f 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -6,6 +6,7 @@ export default {
   experimental: {
     optimizeUniversalDefaults: true,
   },
+  darkMode: "class",
   plugins: [require('@tailwindcss/forms')],
   theme: {
     extend: {
diff --git a/theme/keywind/login/components/atoms/alert.ftl b/theme/keywind/login/components/atoms/alert.ftl
index 58e8309f0..0244bd752 100644
--- a/theme/keywind/login/components/atoms/alert.ftl
+++ b/theme/keywind/login/components/atoms/alert.ftl
@@ -1,19 +1,19 @@
 <#macro kw color="">
   <#switch color>
     <#case "error">
-      <#assign colorClass="bg-red-100 text-red-600">
+      <#assign colorClass="dark:bg-opacity-90 bg-red-100 text-red-600">
       <#break>
     <#case "info">
-      <#assign colorClass="bg-blue-100 text-blue-600">
+      <#assign colorClass="dark:bg-opacity-90 bg-blue-100 text-blue-600">
       <#break>
     <#case "success">
-      <#assign colorClass="bg-green-100 text-green-600">
+      <#assign colorClass="dark:bg-opacity-90 bg-green-100 text-green-600">
       <#break>
     <#case "warning">
-      <#assign colorClass="bg-orange-100 text-orange-600">
+      <#assign colorClass="dark:bg-opacity-90 bg-orange-100 text-orange-600">
       <#break>
     <#default>
-      <#assign colorClass="bg-blue-100 text-blue-600">
+      <#assign colorClass="dark:bg-opacity-90 bg-blue-100 text-blue-600">
   </#switch>
 
   <div class="${colorClass} p-4 rounded-lg text-sm" role="alert">
diff --git a/theme/keywind/login/components/atoms/body.ftl b/theme/keywind/login/components/atoms/body.ftl
index dcc94a06e..b166632a5 100644
--- a/theme/keywind/login/components/atoms/body.ftl
+++ b/theme/keywind/login/components/atoms/body.ftl
@@ -1,5 +1,7 @@
 <#macro kw>
-  <body class="bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+  <body class="dark:bg-zinc-950 dark:text-gray-300 bg-secondary-100 flex flex-col items-center justify-center min-h-screen sm:py-16">
+    <!-- just for add class to bundle -->
+    <div class="flex dark:hidden"></div>
     <#nested>
   </body>
 </#macro>
diff --git a/theme/keywind/login/components/atoms/button.ftl b/theme/keywind/login/components/atoms/button.ftl
index eeb0af7b7..a65e0a889 100644
--- a/theme/keywind/login/components/atoms/button.ftl
+++ b/theme/keywind/login/components/atoms/button.ftl
@@ -4,7 +4,7 @@
       <#assign colorClass="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700">
       <#break>
     <#case "secondary">
-      <#assign colorClass="bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900">
+      <#assign colorClass="dark:bg-zinc-700 dark:text-secondary-200 bg-secondary-100 text-secondary-600 focus:ring-secondary-600 hover:bg-secondary-200 hover:text-secondary-900">
       <#break>
     <#default>
       <#assign colorClass="bg-primary-600 text-white focus:ring-primary-600 hover:bg-primary-700">
diff --git a/theme/keywind/login/components/atoms/card.ftl b/theme/keywind/login/components/atoms/card.ftl
index c1e808df1..720964db3 100644
--- a/theme/keywind/login/components/atoms/card.ftl
+++ b/theme/keywind/login/components/atoms/card.ftl
@@ -1,5 +1,5 @@
 <#macro kw content="" footer="" header="">
-  <div class="bg-white p-8 rounded-lg space-y-6">
+  <div class="dark:bg-zinc-900 dark:text-gray-300 bg-white p-8 rounded-lg space-y-6">
     <#if header?has_content>
       <div class="space-y-4">
         ${header}
diff --git a/theme/keywind/login/components/atoms/checkbox.ftl b/theme/keywind/login/components/atoms/checkbox.ftl
index e47fd619a..508b5ba87 100644
--- a/theme/keywind/login/components/atoms/checkbox.ftl
+++ b/theme/keywind/login/components/atoms/checkbox.ftl
@@ -3,7 +3,7 @@
     <input
       <#if checked>checked</#if>
 
-      class="border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50"
+      class="dark:bg-zinc-700 border-secondary-200 h-4 rounded text-primary-600 w-4 focus:ring-primary-200 focus:ring-opacity-50"
       id="${name}"
       name="${name}"
       type="checkbox"
diff --git a/theme/keywind/login/components/atoms/input.ftl b/theme/keywind/login/components/atoms/input.ftl
index 714f832c9..2976208bb 100644
--- a/theme/keywind/login/components/atoms/input.ftl
+++ b/theme/keywind/login/components/atoms/input.ftl
@@ -4,7 +4,7 @@
 <#macro
   kw
   autofocus=false
-  class="block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm"
+  class="dark:bg-zinc-800 dark:border-zinc-700 dark:bg-zinc-800 dark:border-zinc-700 block border-secondary-200 mt-1 rounded-md w-full focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 sm:text-sm"
   disabled=false
   invalid=false
   label=""
diff --git a/theme/keywind/login/components/molecules/identity-provider.ftl b/theme/keywind/login/components/molecules/identity-provider.ftl
index b59962eff..aa26b27ee 100644
--- a/theme/keywind/login/components/molecules/identity-provider.ftl
+++ b/theme/keywind/login/components/molecules/identity-provider.ftl
@@ -1,8 +1,10 @@
 <#import "/assets/providers/providers.ftl" as providerIcons>
 
 <#macro kw providers=[]>
-  <div class="pt-4 separate text-secondary-600 text-sm">
-    ${msg("identity-provider-login-label")}
+  <div class="relative flex py-4 text-gray-400 text-sm items-center">
+      <div class="flex-grow border-t dark:border-zinc-700"></div>
+      <span class="flex-shrink mx-4">${msg("identity-provider-login-label")}</span>
+      <div class="flex-grow border-t dark:border-zinc-700"></div>
   </div>
   <div class="gap-4 grid grid-cols-3">
     <#list providers as provider>
@@ -62,20 +64,22 @@
           <#assign colorClass="hover:bg-secondary-100">
       </#switch>
 
-      <a
-        class="${colorClass} border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent"
-        data-provider="${provider.alias}"
-        href="${provider.loginUrl}"
-        type="button"
-      >
-        <#if providerIcons[provider.alias]??>
-          <div class="h-6 w-6">
-            <@providerIcons[provider.alias] />
-          </div>
-        <#else>
-          ${provider.displayName!}
-        </#if>
-      </a>
+      <div class="dark:bg-zinc-600 rounded-lg">
+        <a
+          class="${colorClass} dark:border-zinc-700 border border-secondary-200 flex justify-center py-2 rounded-lg hover:border-transparent"
+          data-provider="${provider.alias}"
+          href="${provider.loginUrl}"
+          type="button"
+        >
+          <#if providerIcons[provider.alias]??>
+            <div class="h-6 w-6">
+              <@providerIcons[provider.alias] />
+            </div>
+          <#else>
+            ${provider.displayName!}
+          </#if>
+        </a>
+      </div>
     </#list>
   </div>
 </#macro>
diff --git a/theme/keywind/login/resources/dist/assets/index-a7b84447.js b/theme/keywind/login/resources/dist/assets/index-a7b84447.js
deleted file mode 100644
index c1b2f3c66..000000000
--- a/theme/keywind/login/resources/dist/assets/index-a7b84447.js
+++ /dev/null
@@ -1 +0,0 @@
-var s={};Object.defineProperty(s,"__esModule",{value:!0});function v(e,r,a){var l;if(a===void 0&&(a={}),!r.codes){r.codes={};for(var n=0;n<r.chars.length;++n)r.codes[r.chars[n]]=n}if(!a.loose&&e.length*r.bits&7)throw new SyntaxError("Invalid padding");for(var b=e.length;e[b-1]==="=";)if(--b,!a.loose&&!((e.length-b)*r.bits&7))throw new SyntaxError("Invalid padding");for(var c=new((l=a.out)!=null?l:Uint8Array)(b*r.bits/8|0),t=0,i=0,u=0,f=0;f<b;++f){var h=r.codes[e[f]];if(h===void 0)throw new SyntaxError("Invalid character "+e[f]);i=i<<r.bits|h,t+=r.bits,t>=8&&(t-=8,c[u++]=255&i>>t)}if(t>=r.bits||255&i<<8-t)throw new SyntaxError("Unexpected end of data");return c}function o(e,r,a){a===void 0&&(a={});for(var l=a,n=l.pad,b=n===void 0?!0:n,c=(1<<r.bits)-1,t="",i=0,u=0,f=0;f<e.length;++f)for(u=u<<8|255&e[f],i+=8;i>r.bits;)i-=r.bits,t+=r.chars[c&u>>i];if(i&&(t+=r.chars[c&u<<r.bits-i]),b)for(;t.length*r.bits&7;)t+="=";return t}var p={chars:"0123456789ABCDEF",bits:4},y={chars:"ABCDEFGHIJKLMNOPQRSTUVWXYZ234567",bits:5},d={chars:"0123456789ABCDEFGHIJKLMNOPQRSTUV",bits:5},w={chars:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",bits:6},x={chars:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_",bits:6},E={parse:function(r,a){return v(r.toUpperCase(),p,a)},stringify:function(r,a){return o(r,p,a)}},$={parse:function(r,a){return a===void 0&&(a={}),v(a.loose?r.toUpperCase().replace(/0/g,"O").replace(/1/g,"L").replace(/8/g,"B"):r,y,a)},stringify:function(r,a){return o(r,y,a)}},U={parse:function(r,a){return v(r,d,a)},stringify:function(r,a){return o(r,d,a)}},S={parse:function(r,a){return v(r,w,a)},stringify:function(r,a){return o(r,w,a)}},g={parse:function(r,a){return v(r,x,a)},stringify:function(r,a){return o(r,x,a)}},C={parse:v,stringify:o};s.base16=E;s.base32=$;s.base32hex=U;s.base64=S;s.base64url=g;s.codec=C;s.base16;s.base32;s.base32hex;s.base64;const I=s.base64url;s.codec;export{I as b};
diff --git a/theme/keywind/login/resources/dist/assets/module.esm-9a996e1c.js b/theme/keywind/login/resources/dist/assets/module.esm-9a996e1c.js
deleted file mode 100644
index 1917ce312..000000000
--- a/theme/keywind/login/resources/dist/assets/module.esm-9a996e1c.js
+++ /dev/null
@@ -1,5 +0,0 @@
-var Ae=!1,Oe=!1,N=[],Ce=-1;function Ln(e){Fn(e)}function Fn(e){N.includes(e)||N.push(e),Bn()}function St(e){let t=N.indexOf(e);t!==-1&&t>Ce&&N.splice(t,1)}function Bn(){!Oe&&!Ae&&(Ae=!0,queueMicrotask(Kn))}function Kn(){Ae=!1,Oe=!0;for(let e=0;e<N.length;e++)N[e](),Ce=e;N.length=0,Ce=-1,Oe=!1}var z,H,Z,At,Me=!0;function Dn(e){Me=!1,e(),Me=!0}function kn(e){z=e.reactive,Z=e.release,H=t=>e.effect(t,{scheduler:n=>{Me?Ln(n):n()}}),At=e.raw}function ft(e){H=e}function zn(e){let t=()=>{};return[r=>{let i=H(r);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),Z(i))},i},()=>{t()}]}function Y(e,t,n={}){e.dispatchEvent(new CustomEvent(t,{detail:n,bubbles:!0,composed:!0,cancelable:!0}))}function T(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>T(i,t));return}let n=!1;if(t(e,()=>n=!0),n)return;let r=e.firstElementChild;for(;r;)T(r,t),r=r.nextElementSibling}function I(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}var dt=!1;function Hn(){dt&&I("Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems."),dt=!0,document.body||I("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?"),Y(document,"alpine:init"),Y(document,"alpine:initializing"),Je(),Un(t=>O(t,T)),We(t=>qe(t)),Nt((t,n)=>{Qe(t,n).forEach(r=>r())});let e=t=>!pe(t.parentElement,!0);Array.from(document.querySelectorAll(Mt())).filter(e).forEach(t=>{O(t)}),Y(document,"alpine:initialized")}var He=[],Ot=[];function Ct(){return He.map(e=>e())}function Mt(){return He.concat(Ot).map(e=>e())}function Tt(e){He.push(e)}function It(e){Ot.push(e)}function pe(e,t=!1){return _e(e,n=>{if((t?Mt():Ct()).some(i=>n.matches(i)))return!0})}function _e(e,t){if(e){if(t(e))return e;if(e._x_teleportBack&&(e=e._x_teleportBack),!!e.parentElement)return _e(e.parentElement,t)}}function qn(e){return Ct().some(t=>e.matches(t))}var Pt=[];function Wn(e){Pt.push(e)}function O(e,t=T,n=()=>{}){or(()=>{t(e,(r,i)=>{n(r,i),Pt.forEach(o=>o(r,i)),Qe(r,r.attributes).forEach(o=>o()),r._x_ignore&&i()})})}function qe(e){T(e,t=>{Ft(t),Vn(t)})}var $t=[],Rt=[],jt=[];function Un(e){jt.push(e)}function We(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Rt.push(t))}function Nt(e){$t.push(e)}function Lt(e,t,n){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(n)}function Ft(e,t){e._x_attributeCleanups&&Object.entries(e._x_attributeCleanups).forEach(([n,r])=>{(t===void 0||t.includes(n))&&(r.forEach(i=>i()),delete e._x_attributeCleanups[n])})}function Vn(e){if(e._x_cleanups)for(;e._x_cleanups.length;)e._x_cleanups.pop()()}var Ue=new MutationObserver(Ge),Ve=!1;function Je(){Ue.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),Ve=!0}function Bt(){Jn(),Ue.disconnect(),Ve=!1}var G=[],me=!1;function Jn(){G=G.concat(Ue.takeRecords()),G.length&&!me&&(me=!0,queueMicrotask(()=>{Yn(),me=!1}))}function Yn(){Ge(G),G.length=0}function v(e){if(!Ve)return e();Bt();let t=e();return Je(),t}var Ye=!1,le=[];function Gn(){Ye=!0}function Xn(){Ye=!1,Ge(le),le=[]}function Ge(e){if(Ye){le=le.concat(e);return}let t=[],n=[],r=new Map,i=new Map;for(let o=0;o<e.length;o++)if(!e[o].target._x_ignoreMutationObserver&&(e[o].type==="childList"&&(e[o].addedNodes.forEach(s=>s.nodeType===1&&t.push(s)),e[o].removedNodes.forEach(s=>s.nodeType===1&&n.push(s))),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,u=e[o].oldValue,c=()=>{r.has(s)||r.set(s,[]),r.get(s).push({name:a,value:s.getAttribute(a)})},l=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&u===null?c():s.hasAttribute(a)?(l(),c()):l()}i.forEach((o,s)=>{Ft(s,o)}),r.forEach((o,s)=>{$t.forEach(a=>a(s,o))});for(let o of n)t.includes(o)||(Rt.forEach(s=>s(o)),qe(o));t.forEach(o=>{o._x_ignoreSelf=!0,o._x_ignore=!0});for(let o of t)n.includes(o)||o.isConnected&&(delete o._x_ignoreSelf,delete o._x_ignore,jt.forEach(s=>s(o)),o._x_ignore=!0,o._x_ignoreSelf=!0);t.forEach(o=>{delete o._x_ignoreSelf,delete o._x_ignore}),t=null,n=null,r=null,i=null}function Kt(e){return te(D(e))}function ee(e,t,n){return e._x_dataStack=[t,...D(n||e)],()=>{e._x_dataStack=e._x_dataStack.filter(r=>r!==t)}}function D(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?D(e.host):e.parentNode?D(e.parentNode):[]}function te(e){let t=new Proxy({},{ownKeys:()=>Array.from(new Set(e.flatMap(n=>Object.keys(n)))),has:(n,r)=>e.some(i=>i.hasOwnProperty(r)),get:(n,r)=>(e.find(i=>{if(i.hasOwnProperty(r)){let o=Object.getOwnPropertyDescriptor(i,r);if(o.get&&o.get._x_alreadyBound||o.set&&o.set._x_alreadyBound)return!0;if((o.get||o.set)&&o.enumerable){let s=o.get,a=o.set,u=o;s=s&&s.bind(t),a=a&&a.bind(t),s&&(s._x_alreadyBound=!0),a&&(a._x_alreadyBound=!0),Object.defineProperty(i,r,{...u,get:s,set:a})}return!0}return!1})||{})[r],set:(n,r,i)=>{let o=e.find(s=>s.hasOwnProperty(r));return o?o[r]=i:e[e.length-1][r]=i,!0}});return t}function Dt(e){let t=r=>typeof r=="object"&&!Array.isArray(r)&&r!==null,n=(r,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(r)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0)return;let u=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?r[o]=s.initialize(e,u,o):t(s)&&s!==r&&!(s instanceof Element)&&n(s,u)})};return n(e)}function kt(e,t=()=>{}){let n={initialValue:void 0,_x_interceptor:!0,initialize(r,i,o){return e(this.initialValue,()=>Qn(r,i),s=>Te(r,i,s),i,o)}};return t(n),r=>{if(typeof r=="object"&&r!==null&&r._x_interceptor){let i=n.initialize.bind(n);n.initialize=(o,s,a)=>{let u=r.initialize(o,s,a);return n.initialValue=u,i(o,s,a)}}else n.initialValue=r;return n}}function Qn(e,t){return t.split(".").reduce((n,r)=>n[r],e)}function Te(e,t,n){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=n;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),Te(e[t[0]],t.slice(1),n)}}var zt={};function S(e,t){zt[e]=t}function Ie(e,t){return Object.entries(zt).forEach(([n,r])=>{let i=null;function o(){if(i)return i;{let[s,a]=Jt(t);return i={interceptor:kt,...s},We(t,a),i}}Object.defineProperty(e,`$${n}`,{get(){return r(t,o())},enumerable:!1})}),e}function Zn(e,t,n,...r){try{return n(...r)}catch(i){Q(i,e,t)}}function Q(e,t,n=void 0){Object.assign(e,{el:t,expression:n}),console.warn(`Alpine Expression Error: ${e.message}
-
-${n?'Expression: "'+n+`"
-
-`:""}`,t),setTimeout(()=>{throw e},0)}var ce=!0;function Ht(e){let t=ce;ce=!1;let n=e();return ce=t,n}function L(e,t,n={}){let r;return m(e,t)(i=>r=i,n),r}function m(...e){return qt(...e)}var qt=Wt;function er(e){qt=e}function Wt(e,t){let n={};Ie(n,e);let r=[n,...D(e)],i=typeof t=="function"?tr(r,t):rr(r,t,e);return Zn.bind(null,e,t,i)}function tr(e,t){return(n=()=>{},{scope:r={},params:i=[]}={})=>{let o=t.apply(te([r,...e]),i);fe(n,o)}}var we={};function nr(e,t){if(we[e])return we[e];let n=Object.getPrototypeOf(async function(){}).constructor,r=/^[\n\s]*if.*\(.*\)/.test(e.trim())||/^(let|const)\s/.test(e.trim())?`(async()=>{ ${e} })()`:e,o=(()=>{try{return new n(["__self","scope"],`with (scope) { __self.result = ${r} }; __self.finished = true; return __self.result;`)}catch(s){return Q(s,t,e),Promise.resolve()}})();return we[e]=o,o}function rr(e,t,n){let r=nr(t,n);return(i=()=>{},{scope:o={},params:s=[]}={})=>{r.result=void 0,r.finished=!1;let a=te([o,...e]);if(typeof r=="function"){let u=r(r,a).catch(c=>Q(c,n,t));r.finished?(fe(i,r.result,a,s,n),r.result=void 0):u.then(c=>{fe(i,c,a,s,n)}).catch(c=>Q(c,n,t)).finally(()=>r.result=void 0)}}}function fe(e,t,n,r,i){if(ce&&typeof t=="function"){let o=t.apply(n,r);o instanceof Promise?o.then(s=>fe(e,s,n,r)).catch(s=>Q(s,i,t)):e(o)}else typeof t=="object"&&t instanceof Promise?t.then(o=>e(o)):e(t)}var Xe="x-";function q(e=""){return Xe+e}function ir(e){Xe=e}var Pe={};function g(e,t){return Pe[e]=t,{before(n){if(!Pe[n]){console.warn("Cannot find directive `${directive}`. `${name}` will use the default order of execution");return}const r=j.indexOf(n);j.splice(r>=0?r:j.indexOf("DEFAULT"),0,e)}}}function Qe(e,t,n){if(t=Array.from(t),e._x_virtualDirectives){let o=Object.entries(e._x_virtualDirectives).map(([a,u])=>({name:a,value:u})),s=Ut(o);o=o.map(a=>s.find(u=>u.name===a.name)?{name:`x-bind:${a.name}`,value:`"${a.value}"`}:a),t=t.concat(o)}let r={};return t.map(Xt((o,s)=>r[o]=s)).filter(Zt).map(ar(r,n)).sort(ur).map(o=>sr(e,o))}function Ut(e){return Array.from(e).map(Xt()).filter(t=>!Zt(t))}var $e=!1,J=new Map,Vt=Symbol();function or(e){$e=!0;let t=Symbol();Vt=t,J.set(t,[]);let n=()=>{for(;J.get(t).length;)J.get(t).shift()();J.delete(t)},r=()=>{$e=!1,n()};e(n),r()}function Jt(e){let t=[],n=a=>t.push(a),[r,i]=zn(e);return t.push(i),[{Alpine:ne,effect:r,cleanup:n,evaluateLater:m.bind(m,e),evaluate:L.bind(L,e)},()=>t.forEach(a=>a())]}function sr(e,t){let n=()=>{},r=Pe[t.type]||n,[i,o]=Jt(e);Lt(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(r.inline&&r.inline(e,t,i),r=r.bind(r,e,t,i),$e?J.get(Vt).push(r):r())};return s.runCleanups=o,s}var Yt=(e,t)=>({name:n,value:r})=>(n.startsWith(e)&&(n=n.replace(e,t)),{name:n,value:r}),Gt=e=>e;function Xt(e=()=>{}){return({name:t,value:n})=>{let{name:r,value:i}=Qt.reduce((o,s)=>s(o),{name:t,value:n});return r!==t&&e(r,t),{name:r,value:i}}}var Qt=[];function Ze(e){Qt.push(e)}function Zt({name:e}){return en().test(e)}var en=()=>new RegExp(`^${Xe}([^:^.]+)\\b`);function ar(e,t){return({name:n,value:r})=>{let i=n.match(en()),o=n.match(/:([a-zA-Z0-9\-:]+)/),s=n.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[n]||n;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(u=>u.replace(".","")),expression:r,original:a}}}var Re="DEFAULT",j=["ignore","ref","data","id","bind","init","for","model","modelable","transition","show","if",Re,"teleport"];function ur(e,t){let n=j.indexOf(e.type)===-1?Re:e.type,r=j.indexOf(t.type)===-1?Re:t.type;return j.indexOf(n)-j.indexOf(r)}var je=[],et=!1;function tt(e=()=>{}){return queueMicrotask(()=>{et||setTimeout(()=>{Ne()})}),new Promise(t=>{je.push(()=>{e(),t()})})}function Ne(){for(et=!1;je.length;)je.shift()()}function cr(){et=!0}function nt(e,t){return Array.isArray(t)?pt(e,t.join(" ")):typeof t=="object"&&t!==null?lr(e,t):typeof t=="function"?nt(e,t()):pt(e,t)}function pt(e,t){let n=i=>i.split(" ").filter(o=>!e.classList.contains(o)).filter(Boolean),r=i=>(e.classList.add(...i),()=>{e.classList.remove(...i)});return t=t===!0?t="":t||"",r(n(t))}function lr(e,t){let n=a=>a.split(" ").filter(Boolean),r=Object.entries(t).flatMap(([a,u])=>u?n(a):!1).filter(Boolean),i=Object.entries(t).flatMap(([a,u])=>u?!1:n(a)).filter(Boolean),o=[],s=[];return i.forEach(a=>{e.classList.contains(a)&&(e.classList.remove(a),s.push(a))}),r.forEach(a=>{e.classList.contains(a)||(e.classList.add(a),o.push(a))}),()=>{s.forEach(a=>e.classList.add(a)),o.forEach(a=>e.classList.remove(a))}}function he(e,t){return typeof t=="object"&&t!==null?fr(e,t):dr(e,t)}function fr(e,t){let n={};return Object.entries(t).forEach(([r,i])=>{n[r]=e.style[r],r.startsWith("--")||(r=pr(r)),e.style.setProperty(r,i)}),setTimeout(()=>{e.style.length===0&&e.removeAttribute("style")}),()=>{he(e,n)}}function dr(e,t){let n=e.getAttribute("style",t);return e.setAttribute("style",t),()=>{e.setAttribute("style",n||"")}}function pr(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}function Le(e,t=()=>{}){let n=!1;return function(){n?t.apply(this,arguments):(n=!0,e.apply(this,arguments))}}g("transition",(e,{value:t,modifiers:n,expression:r},{evaluate:i})=>{typeof r=="function"&&(r=i(r)),r!==!1&&(!r||typeof r=="boolean"?hr(e,n,t):_r(e,r,t))});function _r(e,t,n){tn(e,nt,""),{enter:i=>{e._x_transition.enter.during=i},"enter-start":i=>{e._x_transition.enter.start=i},"enter-end":i=>{e._x_transition.enter.end=i},leave:i=>{e._x_transition.leave.during=i},"leave-start":i=>{e._x_transition.leave.start=i},"leave-end":i=>{e._x_transition.leave.end=i}}[n](t)}function hr(e,t,n){tn(e,he);let r=!t.includes("in")&&!t.includes("out")&&!n,i=r||t.includes("in")||["enter"].includes(n),o=r||t.includes("out")||["leave"].includes(n);t.includes("in")&&!r&&(t=t.filter((_,x)=>x<t.indexOf("out"))),t.includes("out")&&!r&&(t=t.filter((_,x)=>x>t.indexOf("out")));let s=!t.includes("opacity")&&!t.includes("scale"),a=s||t.includes("opacity"),u=s||t.includes("scale"),c=a?0:1,l=u?U(t,"scale",95)/100:1,d=U(t,"delay",0)/1e3,p=U(t,"origin","center"),y="opacity, transform",C=U(t,"duration",150)/1e3,re=U(t,"duration",75)/1e3,f="cubic-bezier(0.4, 0.0, 0.2, 1)";i&&(e._x_transition.enter.during={transformOrigin:p,transitionDelay:`${d}s`,transitionProperty:y,transitionDuration:`${C}s`,transitionTimingFunction:f},e._x_transition.enter.start={opacity:c,transform:`scale(${l})`},e._x_transition.enter.end={opacity:1,transform:"scale(1)"}),o&&(e._x_transition.leave.during={transformOrigin:p,transitionDelay:`${d}s`,transitionProperty:y,transitionDuration:`${re}s`,transitionTimingFunction:f},e._x_transition.leave.start={opacity:1,transform:"scale(1)"},e._x_transition.leave.end={opacity:c,transform:`scale(${l})`})}function tn(e,t,n={}){e._x_transition||(e._x_transition={enter:{during:n,start:n,end:n},leave:{during:n,start:n,end:n},in(r=()=>{},i=()=>{}){Fe(e,t,{during:this.enter.during,start:this.enter.start,end:this.enter.end},r,i)},out(r=()=>{},i=()=>{}){Fe(e,t,{during:this.leave.during,start:this.leave.start,end:this.leave.end},r,i)}})}window.Element.prototype._x_toggleAndCascadeWithTransitions=function(e,t,n,r){const i=document.visibilityState==="visible"?requestAnimationFrame:setTimeout;let o=()=>i(n);if(t){e._x_transition&&(e._x_transition.enter||e._x_transition.leave)?e._x_transition.enter&&(Object.entries(e._x_transition.enter.during).length||Object.entries(e._x_transition.enter.start).length||Object.entries(e._x_transition.enter.end).length)?e._x_transition.in(n):o():e._x_transition?e._x_transition.in(n):o();return}e._x_hidePromise=e._x_transition?new Promise((s,a)=>{e._x_transition.out(()=>{},()=>s(r)),e._x_transitioning.beforeCancel(()=>a({isFromCancelledTransition:!0}))}):Promise.resolve(r),queueMicrotask(()=>{let s=nn(e);s?(s._x_hideChildren||(s._x_hideChildren=[]),s._x_hideChildren.push(e)):i(()=>{let a=u=>{let c=Promise.all([u._x_hidePromise,...(u._x_hideChildren||[]).map(a)]).then(([l])=>l());return delete u._x_hidePromise,delete u._x_hideChildren,c};a(e).catch(u=>{if(!u.isFromCancelledTransition)throw u})})})};function nn(e){let t=e.parentNode;if(t)return t._x_hidePromise?t:nn(t)}function Fe(e,t,{during:n,start:r,end:i}={},o=()=>{},s=()=>{}){if(e._x_transitioning&&e._x_transitioning.cancel(),Object.keys(n).length===0&&Object.keys(r).length===0&&Object.keys(i).length===0){o(),s();return}let a,u,c;gr(e,{start(){a=t(e,r)},during(){u=t(e,n)},before:o,end(){a(),c=t(e,i)},after:s,cleanup(){u(),c()}})}function gr(e,t){let n,r,i,o=Le(()=>{v(()=>{n=!0,r||t.before(),i||(t.end(),Ne()),t.after(),e.isConnected&&t.cleanup(),delete e._x_transitioning})});e._x_transitioning={beforeCancels:[],beforeCancel(s){this.beforeCancels.push(s)},cancel:Le(function(){for(;this.beforeCancels.length;)this.beforeCancels.shift()();o()}),finish:o},v(()=>{t.start(),t.during()}),cr(),requestAnimationFrame(()=>{if(n)return;let s=Number(getComputedStyle(e).transitionDuration.replace(/,.*/,"").replace("s",""))*1e3,a=Number(getComputedStyle(e).transitionDelay.replace(/,.*/,"").replace("s",""))*1e3;s===0&&(s=Number(getComputedStyle(e).animationDuration.replace("s",""))*1e3),v(()=>{t.before()}),r=!0,requestAnimationFrame(()=>{n||(v(()=>{t.end()}),Ne(),setTimeout(e._x_transitioning.finish,s+a),i=!0)})})}function U(e,t,n){if(e.indexOf(t)===-1)return n;const r=e[e.indexOf(t)+1];if(!r||t==="scale"&&isNaN(r))return n;if(t==="duration"||t==="delay"){let i=r.match(/([0-9]+)ms/);if(i)return i[1]}return t==="origin"&&["top","right","left","center","bottom"].includes(e[e.indexOf(t)+2])?[r,e[e.indexOf(t)+2]].join(" "):r}var P=!1;function ge(e,t=()=>{}){return(...n)=>P?t(...n):e(...n)}function xr(e){return(...t)=>P&&e(...t)}function yr(e,t){e._x_dataStack&&(t._x_dataStack=e._x_dataStack,t.setAttribute("data-has-alpine-state",!0)),P=!0,rn(()=>{O(t,(n,r)=>{r(n,()=>{})})}),P=!1}var Be=!1;function vr(e,t){t._x_dataStack||(t._x_dataStack=e._x_dataStack),P=!0,Be=!0,rn(()=>{br(t)}),P=!1,Be=!1}function br(e){let t=!1;O(e,(r,i)=>{T(r,(o,s)=>{if(t&&qn(o))return s();t=!0,i(o,s)})})}function rn(e){let t=H;ft((n,r)=>{let i=t(n);return Z(i),()=>{}}),e(),ft(t)}function mr(e){return P?Be?!0:e.hasAttribute("data-has-alpine-state"):!1}function on(e,t,n,r=[]){switch(e._x_bindings||(e._x_bindings=z({})),e._x_bindings[t]=n,t=r.includes("camel")?Tr(t):t,t){case"value":wr(e,n);break;case"style":Sr(e,n);break;case"class":Er(e,n);break;case"selected":case"checked":Ar(e,t,n);break;default:sn(e,t,n);break}}function wr(e,t){if(e.type==="radio")e.attributes.value===void 0&&(e.value=t),window.fromModel&&(e.checked=_t(e.value,t));else if(e.type==="checkbox")Number.isInteger(t)?e.value=t:!Array.isArray(t)&&typeof t!="boolean"&&![null,void 0].includes(t)?e.value=String(t):Array.isArray(t)?e.checked=t.some(n=>_t(n,e.value)):e.checked=!!t;else if(e.tagName==="SELECT")Mr(e,t);else{if(e.value===t)return;e.value=t===void 0?"":t}}function Er(e,t){e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedClasses=nt(e,t)}function Sr(e,t){e._x_undoAddedStyles&&e._x_undoAddedStyles(),e._x_undoAddedStyles=he(e,t)}function Ar(e,t,n){sn(e,t,n),Cr(e,t,n)}function sn(e,t,n){[null,void 0,!1].includes(n)&&Ir(t)?e.removeAttribute(t):(an(t)&&(n=t),Or(e,t,n))}function Or(e,t,n){e.getAttribute(t)!=n&&e.setAttribute(t,n)}function Cr(e,t,n){e[t]!==n&&(e[t]=n)}function Mr(e,t){const n=[].concat(t).map(r=>r+"");Array.from(e.options).forEach(r=>{r.selected=n.includes(r.value)})}function Tr(e){return e.toLowerCase().replace(/-(\w)/g,(t,n)=>n.toUpperCase())}function _t(e,t){return e==t}function an(e){return["disabled","checked","required","readonly","hidden","open","selected","autofocus","itemscope","multiple","novalidate","allowfullscreen","allowpaymentrequest","formnovalidate","autoplay","controls","loop","muted","playsinline","default","ismap","reversed","async","defer","nomodule"].includes(e)}function Ir(e){return!["aria-pressed","aria-checked","aria-expanded","aria-selected"].includes(e)}function Pr(e,t,n){return e._x_bindings&&e._x_bindings[t]!==void 0?e._x_bindings[t]:un(e,t,n)}function $r(e,t,n,r=!0){if(e._x_bindings&&e._x_bindings[t]!==void 0)return e._x_bindings[t];if(e._x_inlineBindings&&e._x_inlineBindings[t]!==void 0){let i=e._x_inlineBindings[t];return i.extract=r,Ht(()=>L(e,i.expression))}return un(e,t,n)}function un(e,t,n){let r=e.getAttribute(t);return r===null?typeof n=="function"?n():n:r===""?!0:an(t)?!![t,"true"].includes(r):r}function cn(e,t){var n;return function(){var r=this,i=arguments,o=function(){n=null,e.apply(r,i)};clearTimeout(n),n=setTimeout(o,t)}}function ln(e,t){let n;return function(){let r=this,i=arguments;n||(e.apply(r,i),n=!0,setTimeout(()=>n=!1,t))}}function fn({get:e,set:t},{get:n,set:r}){let i=!0,o,s,a,u=H(()=>{let c,l;i?(c=e(),r(JSON.parse(JSON.stringify(c))),l=n(),i=!1):(c=e(),l=n(),s=JSON.stringify(c),a=JSON.stringify(l),s!==o?(l=n(),r(c),l=c):(t(JSON.parse(a??null)),c=l)),o=JSON.stringify(c),JSON.stringify(l)});return()=>{Z(u)}}function Rr(e){(Array.isArray(e)?e:[e]).forEach(n=>n(ne))}var R={},ht=!1;function jr(e,t){if(ht||(R=z(R),ht=!0),t===void 0)return R[e];R[e]=t,typeof t=="object"&&t!==null&&t.hasOwnProperty("init")&&typeof t.init=="function"&&R[e].init(),Dt(R[e])}function Nr(){return R}var dn={};function Lr(e,t){let n=typeof t!="function"?()=>t:t;return e instanceof Element?pn(e,n()):(dn[e]=n,()=>{})}function Fr(e){return Object.entries(dn).forEach(([t,n])=>{Object.defineProperty(e,t,{get(){return(...r)=>n(...r)}})}),e}function pn(e,t,n){let r=[];for(;r.length;)r.pop()();let i=Object.entries(t).map(([s,a])=>({name:s,value:a})),o=Ut(i);return i=i.map(s=>o.find(a=>a.name===s.name)?{name:`x-bind:${s.name}`,value:`"${s.value}"`}:s),Qe(e,i,n).map(s=>{r.push(s.runCleanups),s()}),()=>{for(;r.length;)r.pop()()}}var _n={};function Br(e,t){_n[e]=t}function Kr(e,t){return Object.entries(_n).forEach(([n,r])=>{Object.defineProperty(e,n,{get(){return(...i)=>r.bind(t)(...i)},enumerable:!1})}),e}var Dr={get reactive(){return z},get release(){return Z},get effect(){return H},get raw(){return At},version:"3.13.0",flushAndStopDeferringMutations:Xn,dontAutoEvaluateFunctions:Ht,disableEffectScheduling:Dn,startObservingMutations:Je,stopObservingMutations:Bt,setReactivityEngine:kn,onAttributeRemoved:Lt,onAttributesAdded:Nt,closestDataStack:D,skipDuringClone:ge,onlyDuringClone:xr,addRootSelector:Tt,addInitSelector:It,addScopeToNode:ee,deferMutations:Gn,mapAttributes:Ze,evaluateLater:m,interceptInit:Wn,setEvaluator:er,mergeProxies:te,extractProp:$r,findClosest:_e,onElRemoved:We,closestRoot:pe,destroyTree:qe,interceptor:kt,transition:Fe,setStyles:he,mutateDom:v,directive:g,entangle:fn,throttle:ln,debounce:cn,evaluate:L,initTree:O,nextTick:tt,prefixed:q,prefix:ir,plugin:Rr,magic:S,store:jr,start:Hn,clone:vr,cloneNode:yr,bound:Pr,$data:Kt,walk:T,data:Br,bind:Lr},ne=Dr;function kr(e,t){const n=Object.create(null),r=e.split(",");for(let i=0;i<r.length;i++)n[r[i]]=!0;return t?i=>!!n[i.toLowerCase()]:i=>!!n[i]}var zr=Object.freeze({}),Hr=Object.prototype.hasOwnProperty,xe=(e,t)=>Hr.call(e,t),F=Array.isArray,X=e=>hn(e)==="[object Map]",qr=e=>typeof e=="string",rt=e=>typeof e=="symbol",ye=e=>e!==null&&typeof e=="object",Wr=Object.prototype.toString,hn=e=>Wr.call(e),gn=e=>hn(e).slice(8,-1),it=e=>qr(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,Ur=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},Vr=Ur(e=>e.charAt(0).toUpperCase()+e.slice(1)),xn=(e,t)=>e!==t&&(e===e||t===t),Ke=new WeakMap,V=[],A,B=Symbol("iterate"),De=Symbol("Map key iterate");function Jr(e){return e&&e._isEffect===!0}function Yr(e,t=zr){Jr(e)&&(e=e.raw);const n=Qr(e,t);return t.lazy||n(),n}function Gr(e){e.active&&(yn(e),e.options.onStop&&e.options.onStop(),e.active=!1)}var Xr=0;function Qr(e,t){const n=function(){if(!n.active)return e();if(!V.includes(n)){yn(n);try{return ei(),V.push(n),A=n,e()}finally{V.pop(),vn(),A=V[V.length-1]}}};return n.id=Xr++,n.allowRecurse=!!t.allowRecurse,n._isEffect=!0,n.active=!0,n.raw=e,n.deps=[],n.options=t,n}function yn(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}var k=!0,ot=[];function Zr(){ot.push(k),k=!1}function ei(){ot.push(k),k=!0}function vn(){const e=ot.pop();k=e===void 0?!0:e}function E(e,t,n){if(!k||A===void 0)return;let r=Ke.get(e);r||Ke.set(e,r=new Map);let i=r.get(n);i||r.set(n,i=new Set),i.has(A)||(i.add(A),A.deps.push(i),A.options.onTrack&&A.options.onTrack({effect:A,target:e,type:t,key:n}))}function $(e,t,n,r,i,o){const s=Ke.get(e);if(!s)return;const a=new Set,u=l=>{l&&l.forEach(d=>{(d!==A||d.allowRecurse)&&a.add(d)})};if(t==="clear")s.forEach(u);else if(n==="length"&&F(e))s.forEach((l,d)=>{(d==="length"||d>=r)&&u(l)});else switch(n!==void 0&&u(s.get(n)),t){case"add":F(e)?it(n)&&u(s.get("length")):(u(s.get(B)),X(e)&&u(s.get(De)));break;case"delete":F(e)||(u(s.get(B)),X(e)&&u(s.get(De)));break;case"set":X(e)&&u(s.get(B));break}const c=l=>{l.options.onTrigger&&l.options.onTrigger({effect:l,target:e,key:n,type:t,newValue:r,oldValue:i,oldTarget:o}),l.options.scheduler?l.options.scheduler(l):l()};a.forEach(c)}var ti=kr("__proto__,__v_isRef,__isVue"),bn=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(rt)),ni=mn(),ri=mn(!0),gt=ii();function ii(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=h(this);for(let o=0,s=this.length;o<s;o++)E(r,"get",o+"");const i=r[t](...n);return i===-1||i===!1?r[t](...n.map(h)):i}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){Zr();const r=h(this)[t].apply(this,n);return vn(),r}}),e}function mn(e=!1,t=!1){return function(r,i,o){if(i==="__v_isReactive")return!e;if(i==="__v_isReadonly")return e;if(i==="__v_raw"&&o===(e?t?bi:An:t?vi:Sn).get(r))return r;const s=F(r);if(!e&&s&&xe(gt,i))return Reflect.get(gt,i,o);const a=Reflect.get(r,i,o);return(rt(i)?bn.has(i):ti(i))||(e||E(r,"get",i),t)?a:ke(a)?!s||!it(i)?a.value:a:ye(a)?e?On(a):ct(a):a}}var oi=si();function si(e=!1){return function(n,r,i,o){let s=n[r];if(!e&&(i=h(i),s=h(s),!F(n)&&ke(s)&&!ke(i)))return s.value=i,!0;const a=F(n)&&it(r)?Number(r)<n.length:xe(n,r),u=Reflect.set(n,r,i,o);return n===h(o)&&(a?xn(i,s)&&$(n,"set",r,i,s):$(n,"add",r,i)),u}}function ai(e,t){const n=xe(e,t),r=e[t],i=Reflect.deleteProperty(e,t);return i&&n&&$(e,"delete",t,void 0,r),i}function ui(e,t){const n=Reflect.has(e,t);return(!rt(t)||!bn.has(t))&&E(e,"has",t),n}function ci(e){return E(e,"iterate",F(e)?"length":B),Reflect.ownKeys(e)}var li={get:ni,set:oi,deleteProperty:ai,has:ui,ownKeys:ci},fi={get:ri,set(e,t){return console.warn(`Set operation on key "${String(t)}" failed: target is readonly.`,e),!0},deleteProperty(e,t){return console.warn(`Delete operation on key "${String(t)}" failed: target is readonly.`,e),!0}},st=e=>ye(e)?ct(e):e,at=e=>ye(e)?On(e):e,ut=e=>e,ve=e=>Reflect.getPrototypeOf(e);function ie(e,t,n=!1,r=!1){e=e.__v_raw;const i=h(e),o=h(t);t!==o&&!n&&E(i,"get",t),!n&&E(i,"get",o);const{has:s}=ve(i),a=r?ut:n?at:st;if(s.call(i,t))return a(e.get(t));if(s.call(i,o))return a(e.get(o));e!==i&&e.get(t)}function oe(e,t=!1){const n=this.__v_raw,r=h(n),i=h(e);return e!==i&&!t&&E(r,"has",e),!t&&E(r,"has",i),e===i?n.has(e):n.has(e)||n.has(i)}function se(e,t=!1){return e=e.__v_raw,!t&&E(h(e),"iterate",B),Reflect.get(e,"size",e)}function xt(e){e=h(e);const t=h(this);return ve(t).has.call(t,e)||(t.add(e),$(t,"add",e,e)),this}function yt(e,t){t=h(t);const n=h(this),{has:r,get:i}=ve(n);let o=r.call(n,e);o?En(n,r,e):(e=h(e),o=r.call(n,e));const s=i.call(n,e);return n.set(e,t),o?xn(t,s)&&$(n,"set",e,t,s):$(n,"add",e,t),this}function vt(e){const t=h(this),{has:n,get:r}=ve(t);let i=n.call(t,e);i?En(t,n,e):(e=h(e),i=n.call(t,e));const o=r?r.call(t,e):void 0,s=t.delete(e);return i&&$(t,"delete",e,void 0,o),s}function bt(){const e=h(this),t=e.size!==0,n=X(e)?new Map(e):new Set(e),r=e.clear();return t&&$(e,"clear",void 0,void 0,n),r}function ae(e,t){return function(r,i){const o=this,s=o.__v_raw,a=h(s),u=t?ut:e?at:st;return!e&&E(a,"iterate",B),s.forEach((c,l)=>r.call(i,u(c),u(l),o))}}function ue(e,t,n){return function(...r){const i=this.__v_raw,o=h(i),s=X(o),a=e==="entries"||e===Symbol.iterator&&s,u=e==="keys"&&s,c=i[e](...r),l=n?ut:t?at:st;return!t&&E(o,"iterate",u?De:B),{next(){const{value:d,done:p}=c.next();return p?{value:d,done:p}:{value:a?[l(d[0]),l(d[1])]:l(d),done:p}},[Symbol.iterator](){return this}}}}function M(e){return function(...t){{const n=t[0]?`on key "${t[0]}" `:"";console.warn(`${Vr(e)} operation ${n}failed: target is readonly.`,h(this))}return e==="delete"?!1:this}}function di(){const e={get(o){return ie(this,o)},get size(){return se(this)},has:oe,add:xt,set:yt,delete:vt,clear:bt,forEach:ae(!1,!1)},t={get(o){return ie(this,o,!1,!0)},get size(){return se(this)},has:oe,add:xt,set:yt,delete:vt,clear:bt,forEach:ae(!1,!0)},n={get(o){return ie(this,o,!0)},get size(){return se(this,!0)},has(o){return oe.call(this,o,!0)},add:M("add"),set:M("set"),delete:M("delete"),clear:M("clear"),forEach:ae(!0,!1)},r={get(o){return ie(this,o,!0,!0)},get size(){return se(this,!0)},has(o){return oe.call(this,o,!0)},add:M("add"),set:M("set"),delete:M("delete"),clear:M("clear"),forEach:ae(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=ue(o,!1,!1),n[o]=ue(o,!0,!1),t[o]=ue(o,!1,!0),r[o]=ue(o,!0,!0)}),[e,n,t,r]}var[pi,_i,hi,gi]=di();function wn(e,t){const n=t?e?gi:hi:e?_i:pi;return(r,i,o)=>i==="__v_isReactive"?!e:i==="__v_isReadonly"?e:i==="__v_raw"?r:Reflect.get(xe(n,i)&&i in r?n:r,i,o)}var xi={get:wn(!1,!1)},yi={get:wn(!0,!1)};function En(e,t,n){const r=h(n);if(r!==n&&t.call(e,r)){const i=gn(e);console.warn(`Reactive ${i} contains both the raw and reactive versions of the same object${i==="Map"?" as keys":""}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`)}}var Sn=new WeakMap,vi=new WeakMap,An=new WeakMap,bi=new WeakMap;function mi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function wi(e){return e.__v_skip||!Object.isExtensible(e)?0:mi(gn(e))}function ct(e){return e&&e.__v_isReadonly?e:Cn(e,!1,li,xi,Sn)}function On(e){return Cn(e,!0,fi,yi,An)}function Cn(e,t,n,r,i){if(!ye(e))return console.warn(`value cannot be made reactive: ${String(e)}`),e;if(e.__v_raw&&!(t&&e.__v_isReactive))return e;const o=i.get(e);if(o)return o;const s=wi(e);if(s===0)return e;const a=new Proxy(e,s===2?r:n);return i.set(e,a),a}function h(e){return e&&h(e.__v_raw)||e}function ke(e){return!!(e&&e.__v_isRef===!0)}S("nextTick",()=>tt);S("dispatch",e=>Y.bind(Y,e));S("watch",(e,{evaluateLater:t,effect:n})=>(r,i)=>{let o=t(r),s=!0,a,u=n(()=>o(c=>{JSON.stringify(c),s?a=c:queueMicrotask(()=>{i(c,a),a=c}),s=!1}));e._x_effects.delete(u)});S("store",Nr);S("data",e=>Kt(e));S("root",e=>pe(e));S("refs",e=>(e._x_refs_proxy||(e._x_refs_proxy=te(Ei(e))),e._x_refs_proxy));function Ei(e){let t=[],n=e;for(;n;)n._x_refs&&t.push(n._x_refs),n=n.parentNode;return t}var Ee={};function Mn(e){return Ee[e]||(Ee[e]=0),++Ee[e]}function Si(e,t){return _e(e,n=>{if(n._x_ids&&n._x_ids[t])return!0})}function Ai(e,t){e._x_ids||(e._x_ids={}),e._x_ids[t]||(e._x_ids[t]=Mn(t))}S("id",e=>(t,n=null)=>{let r=Si(e,t),i=r?r._x_ids[t]:Mn(t);return n?`${t}-${i}-${n}`:`${t}-${i}`});S("el",e=>e);Tn("Focus","focus","focus");Tn("Persist","persist","persist");function Tn(e,t,n){S(t,r=>I(`You can't use [$${directiveName}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${n}`,r))}g("modelable",(e,{expression:t},{effect:n,evaluateLater:r,cleanup:i})=>{let o=r(t),s=()=>{let l;return o(d=>l=d),l},a=r(`${t} = __placeholder`),u=l=>a(()=>{},{scope:{__placeholder:l}}),c=s();u(c),queueMicrotask(()=>{if(!e._x_model)return;e._x_removeModelListeners.default();let l=e._x_model.get,d=e._x_model.set,p=fn({get(){return l()},set(y){d(y)}},{get(){return s()},set(y){u(y)}});i(p)})});var Oi=document.createElement("div");g("teleport",(e,{modifiers:t,expression:n},{cleanup:r})=>{e.tagName.toLowerCase()!=="template"&&I("x-teleport can only be used on a <template> tag",e);let i=ge(()=>document.querySelector(n),()=>Oi)();i||I(`Cannot find x-teleport element for selector: "${n}"`);let o=e.content.cloneNode(!0).firstElementChild;e._x_teleport=o,o._x_teleportBack=e,e._x_forwardEvents&&e._x_forwardEvents.forEach(s=>{o.addEventListener(s,a=>{a.stopPropagation(),e.dispatchEvent(new a.constructor(a.type,a))})}),ee(o,{},e),v(()=>{t.includes("prepend")?i.parentNode.insertBefore(o,i):t.includes("append")?i.parentNode.insertBefore(o,i.nextSibling):i.appendChild(o),O(o),o._x_ignore=!0}),r(()=>o.remove())});var In=()=>{};In.inline=(e,{modifiers:t},{cleanup:n})=>{t.includes("self")?e._x_ignoreSelf=!0:e._x_ignore=!0,n(()=>{t.includes("self")?delete e._x_ignoreSelf:delete e._x_ignore})};g("ignore",In);g("effect",(e,{expression:t},{effect:n})=>n(m(e,t)));function ze(e,t,n,r){let i=e,o=u=>r(u),s={},a=(u,c)=>l=>c(u,l);if(n.includes("dot")&&(t=Ci(t)),n.includes("camel")&&(t=Mi(t)),n.includes("passive")&&(s.passive=!0),n.includes("capture")&&(s.capture=!0),n.includes("window")&&(i=window),n.includes("document")&&(i=document),n.includes("debounce")){let u=n[n.indexOf("debounce")+1]||"invalid-wait",c=de(u.split("ms")[0])?Number(u.split("ms")[0]):250;o=cn(o,c)}if(n.includes("throttle")){let u=n[n.indexOf("throttle")+1]||"invalid-wait",c=de(u.split("ms")[0])?Number(u.split("ms")[0]):250;o=ln(o,c)}return n.includes("prevent")&&(o=a(o,(u,c)=>{c.preventDefault(),u(c)})),n.includes("stop")&&(o=a(o,(u,c)=>{c.stopPropagation(),u(c)})),n.includes("self")&&(o=a(o,(u,c)=>{c.target===e&&u(c)})),(n.includes("away")||n.includes("outside"))&&(i=document,o=a(o,(u,c)=>{e.contains(c.target)||c.target.isConnected!==!1&&(e.offsetWidth<1&&e.offsetHeight<1||e._x_isShown!==!1&&u(c))})),n.includes("once")&&(o=a(o,(u,c)=>{u(c),i.removeEventListener(t,o,s)})),o=a(o,(u,c)=>{Ii(t)&&Pi(c,n)||u(c)}),i.addEventListener(t,o,s),()=>{i.removeEventListener(t,o,s)}}function Ci(e){return e.replace(/-/g,".")}function Mi(e){return e.toLowerCase().replace(/-(\w)/g,(t,n)=>n.toUpperCase())}function de(e){return!Array.isArray(e)&&!isNaN(e)}function Ti(e){return[" ","_"].includes(e)?e:e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}function Ii(e){return["keydown","keyup"].includes(e)}function Pi(e,t){let n=t.filter(o=>!["window","document","prevent","stop","once","capture"].includes(o));if(n.includes("debounce")){let o=n.indexOf("debounce");n.splice(o,de((n[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(n.includes("throttle")){let o=n.indexOf("throttle");n.splice(o,de((n[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(n.length===0||n.length===1&&mt(e.key).includes(n[0]))return!1;const i=["ctrl","shift","alt","meta","cmd","super"].filter(o=>n.includes(o));return n=n.filter(o=>!i.includes(o)),!(i.length>0&&i.filter(s=>((s==="cmd"||s==="super")&&(s="meta"),e[`${s}Key`])).length===i.length&&mt(e.key).includes(n[0]))}function mt(e){if(!e)return[];e=Ti(e);let t={ctrl:"control",slash:"/",space:" ",spacebar:" ",cmd:"meta",esc:"escape",up:"arrow-up",down:"arrow-down",left:"arrow-left",right:"arrow-right",period:".",equal:"=",minus:"-",underscore:"_"};return t[e]=e,Object.keys(t).map(n=>{if(t[n]===e)return n}).filter(n=>n)}g("model",(e,{modifiers:t,expression:n},{effect:r,cleanup:i})=>{let o=e;t.includes("parent")&&(o=e.parentNode);let s=m(o,n),a;typeof n=="string"?a=m(o,`${n} = __placeholder`):typeof n=="function"&&typeof n()=="string"?a=m(o,`${n()} = __placeholder`):a=()=>{};let u=()=>{let p;return s(y=>p=y),wt(p)?p.get():p},c=p=>{let y;s(C=>y=C),wt(y)?y.set(p):a(()=>{},{scope:{__placeholder:p}})};typeof n=="string"&&e.type==="radio"&&v(()=>{e.hasAttribute("name")||e.setAttribute("name",n)});var l=e.tagName.toLowerCase()==="select"||["checkbox","radio"].includes(e.type)||t.includes("lazy")?"change":"input";let d=P?()=>{}:ze(e,l,t,p=>{c($i(e,t,p,u()))});if(t.includes("fill")&&([null,""].includes(u())||e.type==="checkbox"&&Array.isArray(u()))&&e.dispatchEvent(new Event(l,{})),e._x_removeModelListeners||(e._x_removeModelListeners={}),e._x_removeModelListeners.default=d,i(()=>e._x_removeModelListeners.default()),e.form){let p=ze(e.form,"reset",[],y=>{tt(()=>e._x_model&&e._x_model.set(e.value))});i(()=>p())}e._x_model={get(){return u()},set(p){c(p)}},e._x_forceModelUpdate=p=>{p===void 0&&typeof n=="string"&&n.match(/\./)&&(p=""),window.fromModel=!0,v(()=>on(e,"value",p)),delete window.fromModel},r(()=>{let p=u();t.includes("unintrusive")&&document.activeElement.isSameNode(e)||e._x_forceModelUpdate(p)})});function $i(e,t,n,r){return v(()=>{if(n instanceof CustomEvent&&n.detail!==void 0)return n.detail??n.target.value;if(e.type==="checkbox")if(Array.isArray(r)){let i=t.includes("number")?Se(n.target.value):n.target.value;return n.target.checked?r.concat([i]):r.filter(o=>!Ri(o,i))}else return n.target.checked;else{if(e.tagName.toLowerCase()==="select"&&e.multiple)return t.includes("number")?Array.from(n.target.selectedOptions).map(i=>{let o=i.value||i.text;return Se(o)}):Array.from(n.target.selectedOptions).map(i=>i.value||i.text);{let i=n.target.value;return t.includes("number")?Se(i):t.includes("trim")?i.trim():i}}})}function Se(e){let t=e?parseFloat(e):null;return ji(t)?t:e}function Ri(e,t){return e==t}function ji(e){return!Array.isArray(e)&&!isNaN(e)}function wt(e){return e!==null&&typeof e=="object"&&typeof e.get=="function"&&typeof e.set=="function"}g("cloak",e=>queueMicrotask(()=>v(()=>e.removeAttribute(q("cloak")))));It(()=>`[${q("init")}]`);g("init",ge((e,{expression:t},{evaluate:n})=>typeof t=="string"?!!t.trim()&&n(t,{},!1):n(t,{},!1)));g("text",(e,{expression:t},{effect:n,evaluateLater:r})=>{let i=r(t);n(()=>{i(o=>{v(()=>{e.textContent=o})})})});g("html",(e,{expression:t},{effect:n,evaluateLater:r})=>{let i=r(t);n(()=>{i(o=>{v(()=>{e.innerHTML=o,e._x_ignoreSelf=!0,O(e),delete e._x_ignoreSelf})})})});Ze(Yt(":",Gt(q("bind:"))));var Pn=(e,{value:t,modifiers:n,expression:r,original:i},{effect:o})=>{if(!t){let a={};Fr(a),m(e,r)(c=>{pn(e,c,i)},{scope:a});return}if(t==="key")return Ni(e,r);if(e._x_inlineBindings&&e._x_inlineBindings[t]&&e._x_inlineBindings[t].extract)return;let s=m(e,r);o(()=>s(a=>{a===void 0&&typeof r=="string"&&r.match(/\./)&&(a=""),v(()=>on(e,t,a,n))}))};Pn.inline=(e,{value:t,modifiers:n,expression:r})=>{t&&(e._x_inlineBindings||(e._x_inlineBindings={}),e._x_inlineBindings[t]={expression:r,extract:!1})};g("bind",Pn);function Ni(e,t){e._x_keyExpression=t}Tt(()=>`[${q("data")}]`);g("data",(e,{expression:t},{cleanup:n})=>{if(mr(e))return;t=t===""?"{}":t;let r={};Ie(r,e);let i={};Kr(i,r);let o=L(e,t,{scope:i});(o===void 0||o===!0)&&(o={}),Ie(o,e);let s=z(o);Dt(s);let a=ee(e,s);s.init&&L(e,s.init),n(()=>{s.destroy&&L(e,s.destroy),a()})});g("show",(e,{modifiers:t,expression:n},{effect:r})=>{let i=m(e,n);e._x_doHide||(e._x_doHide=()=>{v(()=>{e.style.setProperty("display","none",t.includes("important")?"important":void 0)})}),e._x_doShow||(e._x_doShow=()=>{v(()=>{e.style.length===1&&e.style.display==="none"?e.removeAttribute("style"):e.style.removeProperty("display")})});let o=()=>{e._x_doHide(),e._x_isShown=!1},s=()=>{e._x_doShow(),e._x_isShown=!0},a=()=>setTimeout(s),u=Le(d=>d?s():o(),d=>{typeof e._x_toggleAndCascadeWithTransitions=="function"?e._x_toggleAndCascadeWithTransitions(e,d,s,o):d?a():o()}),c,l=!0;r(()=>i(d=>{!l&&d===c||(t.includes("immediate")&&(d?a():o()),u(d),c=d,l=!1)}))});g("for",(e,{expression:t},{effect:n,cleanup:r})=>{let i=Fi(t),o=m(e,i.items),s=m(e,e._x_keyExpression||"index");e._x_prevKeys=[],e._x_lookup={},n(()=>Li(e,i,o,s)),r(()=>{Object.values(e._x_lookup).forEach(a=>a.remove()),delete e._x_prevKeys,delete e._x_lookup})});function Li(e,t,n,r){let i=s=>typeof s=="object"&&!Array.isArray(s),o=e;n(s=>{Bi(s)&&s>=0&&(s=Array.from(Array(s).keys(),f=>f+1)),s===void 0&&(s=[]);let a=e._x_lookup,u=e._x_prevKeys,c=[],l=[];if(i(s))s=Object.entries(s).map(([f,_])=>{let x=Et(t,_,f,s);r(b=>l.push(b),{scope:{index:f,...x}}),c.push(x)});else for(let f=0;f<s.length;f++){let _=Et(t,s[f],f,s);r(x=>l.push(x),{scope:{index:f,..._}}),c.push(_)}let d=[],p=[],y=[],C=[];for(let f=0;f<u.length;f++){let _=u[f];l.indexOf(_)===-1&&y.push(_)}u=u.filter(f=>!y.includes(f));let re="template";for(let f=0;f<l.length;f++){let _=l[f],x=u.indexOf(_);if(x===-1)u.splice(f,0,_),d.push([re,f]);else if(x!==f){let b=u.splice(f,1)[0],w=u.splice(x-1,1)[0];u.splice(f,0,w),u.splice(x,0,b),p.push([b,w])}else C.push(_);re=_}for(let f=0;f<y.length;f++){let _=y[f];a[_]._x_effects&&a[_]._x_effects.forEach(St),a[_].remove(),a[_]=null,delete a[_]}for(let f=0;f<p.length;f++){let[_,x]=p[f],b=a[_],w=a[x],K=document.createElement("div");v(()=>{w||I('x-for ":key" is undefined or invalid',o),w.after(K),b.after(w),w._x_currentIfEl&&w.after(w._x_currentIfEl),K.before(b),b._x_currentIfEl&&b.after(b._x_currentIfEl),K.remove()}),w._x_refreshXForScope(c[l.indexOf(x)])}for(let f=0;f<d.length;f++){let[_,x]=d[f],b=_==="template"?o:a[_];b._x_currentIfEl&&(b=b._x_currentIfEl);let w=c[x],K=l[x],W=document.importNode(o.content,!0).firstElementChild,lt=z(w);ee(W,lt,o),W._x_refreshXForScope=Rn=>{Object.entries(Rn).forEach(([jn,Nn])=>{lt[jn]=Nn})},v(()=>{b.after(W),O(W)}),typeof K=="object"&&I("x-for key cannot be an object, it must be a string or an integer",o),a[K]=W}for(let f=0;f<C.length;f++)a[C[f]]._x_refreshXForScope(c[l.indexOf(C[f])]);o._x_prevKeys=l})}function Fi(e){let t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,n=/^\s*\(|\)\s*$/g,r=/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/,i=e.match(r);if(!i)return;let o={};o.items=i[2].trim();let s=i[1].replace(n,"").trim(),a=s.match(t);return a?(o.item=s.replace(t,"").trim(),o.index=a[1].trim(),a[2]&&(o.collection=a[2].trim())):o.item=s,o}function Et(e,t,n,r){let i={};return/^\[.*\]$/.test(e.item)&&Array.isArray(t)?e.item.replace("[","").replace("]","").split(",").map(s=>s.trim()).forEach((s,a)=>{i[s]=t[a]}):/^\{.*\}$/.test(e.item)&&!Array.isArray(t)&&typeof t=="object"?e.item.replace("{","").replace("}","").split(",").map(s=>s.trim()).forEach(s=>{i[s]=t[s]}):i[e.item]=t,e.index&&(i[e.index]=n),e.collection&&(i[e.collection]=r),i}function Bi(e){return!Array.isArray(e)&&!isNaN(e)}function $n(){}$n.inline=(e,{expression:t},{cleanup:n})=>{let r=pe(e);r._x_refs||(r._x_refs={}),r._x_refs[t]=e,n(()=>delete r._x_refs[t])};g("ref",$n);g("if",(e,{expression:t},{effect:n,cleanup:r})=>{let i=m(e,t),o=()=>{if(e._x_currentIfEl)return e._x_currentIfEl;let a=e.content.cloneNode(!0).firstElementChild;return ee(a,{},e),v(()=>{e.after(a),O(a)}),e._x_currentIfEl=a,e._x_undoIf=()=>{T(a,u=>{u._x_effects&&u._x_effects.forEach(St)}),a.remove(),delete e._x_currentIfEl},a},s=()=>{e._x_undoIf&&(e._x_undoIf(),delete e._x_undoIf)};n(()=>i(a=>{a?o():s()})),r(()=>e._x_undoIf&&e._x_undoIf())});g("id",(e,{expression:t},{evaluate:n})=>{n(t).forEach(i=>Ai(e,i))});Ze(Yt("@",Gt(q("on:"))));g("on",ge((e,{value:t,modifiers:n,expression:r},{cleanup:i})=>{let o=r?m(e,r):()=>{};e.tagName.toLowerCase()==="template"&&(e._x_forwardEvents||(e._x_forwardEvents=[]),e._x_forwardEvents.includes(t)||e._x_forwardEvents.push(t));let s=ze(e,t,n,a=>{o(()=>{},{scope:{$event:a},params:[a]})});i(()=>s())}));be("Collapse","collapse","collapse");be("Intersect","intersect","intersect");be("Focus","trap","focus");be("Mask","mask","mask");function be(e,t,n){g(t,r=>I(`You can't use [x-${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${n}`,r))}ne.setEvaluator(Wt);ne.setReactivityEngine({reactive:ct,effect:Yr,release:Gr,raw:h});var Ki=ne,Di=Ki;export{Di as m};
diff --git a/theme/keywind/login/resources/dist/assets/module.esm-a81817bb.js b/theme/keywind/login/resources/dist/assets/module.esm-a81817bb.js
new file mode 100644
index 000000000..4ae33d96e
--- /dev/null
+++ b/theme/keywind/login/resources/dist/assets/module.esm-a81817bb.js
@@ -0,0 +1,5 @@
+var Ce=!1,Me=!1,L=[],Te=-1;function kn(e){zn(e)}function zn(e){L.includes(e)||L.push(e),Hn()}function Ct(e){let t=L.indexOf(e);t!==-1&&t>Te&&L.splice(t,1)}function Hn(){!Me&&!Ce&&(Ce=!0,queueMicrotask(qn))}function qn(){Ce=!1,Me=!0;for(let e=0;e<L.length;e++)L[e](),Te=e;L.length=0,Te=-1,Me=!1}var q,D,W,Mt,Ie=!0;function Wn(e){Ie=!1,e(),Ie=!0}function Un(e){q=e.reactive,W=e.release,D=t=>e.effect(t,{scheduler:n=>{Ie?kn(n):n()}}),Mt=e.raw}function _t(e){D=e}function Jn(e){let t=()=>{};return[r=>{let i=D(r);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),W(i))},i},()=>{t()}]}function Tt(e,t){let n=!0,r,i=D(()=>{let o=e();JSON.stringify(o),n?r=o:queueMicrotask(()=>{t(o,r),r=o}),n=!1});return()=>W(i)}function Z(e,t,n={}){e.dispatchEvent(new CustomEvent(t,{detail:n,bubbles:!0,composed:!0,cancelable:!0}))}function I(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>I(i,t));return}let n=!1;if(t(e,()=>n=!0),n)return;let r=e.firstElementChild;for(;r;)I(r,t),r=r.nextElementSibling}function E(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}var pt=!1;function Vn(){pt&&E("Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems."),pt=!0,document.body||E("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?"),Z(document,"alpine:init"),Z(document,"alpine:initializing"),Ge(),Xn(t=>C(t,I)),Je(t=>Ue(t)),Dt((t,n)=>{et(t,n).forEach(r=>r())});let e=t=>!ge(t.parentElement,!0);Array.from(document.querySelectorAll(Pt().join(","))).filter(e).forEach(t=>{C(t)}),Z(document,"alpine:initialized")}var We=[],It=[];function $t(){return We.map(e=>e())}function Pt(){return We.concat(It).map(e=>e())}function Rt(e){We.push(e)}function jt(e){It.push(e)}function ge(e,t=!1){return te(e,n=>{if((t?Pt():$t()).some(i=>n.matches(i)))return!0})}function te(e,t){if(e){if(t(e))return e;if(e._x_teleportBack&&(e=e._x_teleportBack),!!e.parentElement)return te(e.parentElement,t)}}function Yn(e){return $t().some(t=>e.matches(t))}var Lt=[];function Gn(e){Lt.push(e)}function C(e,t=I,n=()=>{}){fr(()=>{t(e,(r,i)=>{n(r,i),Lt.forEach(o=>o(r,i)),et(r,r.attributes).forEach(o=>o()),r._x_ignore&&i()})})}function Ue(e,t=I){t(e,n=>{kt(n),Zn(n)})}var Nt=[],Ft=[],Bt=[];function Xn(e){Bt.push(e)}function Je(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Ft.push(t))}function Dt(e){Nt.push(e)}function Kt(e,t,n){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(n)}function kt(e,t){e._x_attributeCleanups&&Object.entries(e._x_attributeCleanups).forEach(([n,r])=>{(t===void 0||t.includes(n))&&(r.forEach(i=>i()),delete e._x_attributeCleanups[n])})}function Zn(e){if(e._x_cleanups)for(;e._x_cleanups.length;)e._x_cleanups.pop()()}var Ve=new MutationObserver(Ze),Ye=!1;function Ge(){Ve.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),Ye=!0}function zt(){Qn(),Ve.disconnect(),Ye=!1}var V=[];function Qn(){let e=Ve.takeRecords();V.push(()=>e.length>0&&Ze(e));let t=V.length;queueMicrotask(()=>{if(V.length===t)for(;V.length>0;)V.shift()()})}function y(e){if(!Ye)return e();zt();let t=e();return Ge(),t}var Xe=!1,_e=[];function er(){Xe=!0}function tr(){Xe=!1,Ze(_e),_e=[]}function Ze(e){if(Xe){_e=_e.concat(e);return}let t=new Set,n=new Set,r=new Map,i=new Map;for(let o=0;o<e.length;o++)if(!e[o].target._x_ignoreMutationObserver&&(e[o].type==="childList"&&(e[o].addedNodes.forEach(s=>s.nodeType===1&&t.add(s)),e[o].removedNodes.forEach(s=>s.nodeType===1&&n.add(s))),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,u=e[o].oldValue,c=()=>{r.has(s)||r.set(s,[]),r.get(s).push({name:a,value:s.getAttribute(a)})},l=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&u===null?c():s.hasAttribute(a)?(l(),c()):l()}i.forEach((o,s)=>{kt(s,o)}),r.forEach((o,s)=>{Nt.forEach(a=>a(s,o))});for(let o of n)t.has(o)||(Ft.forEach(s=>s(o)),Ue(o));t.forEach(o=>{o._x_ignoreSelf=!0,o._x_ignore=!0});for(let o of t)n.has(o)||o.isConnected&&(delete o._x_ignoreSelf,delete o._x_ignore,Bt.forEach(s=>s(o)),o._x_ignore=!0,o._x_ignoreSelf=!0);t.forEach(o=>{delete o._x_ignoreSelf,delete o._x_ignore}),t=null,n=null,r=null,i=null}function Ht(e){return re(z(e))}function ne(e,t,n){return e._x_dataStack=[t,...z(n||e)],()=>{e._x_dataStack=e._x_dataStack.filter(r=>r!==t)}}function z(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?z(e.host):e.parentNode?z(e.parentNode):[]}function re(e){return new Proxy({objects:e},nr)}var nr={ownKeys({objects:e}){return Array.from(new Set(e.flatMap(t=>Object.keys(t))))},has({objects:e},t){return t==Symbol.unscopables?!1:e.some(n=>Object.prototype.hasOwnProperty.call(n,t)||Reflect.has(n,t))},get({objects:e},t,n){return t=="toJSON"?rr:Reflect.get(e.find(r=>Reflect.has(r,t))||{},t,n)},set({objects:e},t,n,r){const i=e.find(s=>Object.prototype.hasOwnProperty.call(s,t))||e[e.length-1],o=Object.getOwnPropertyDescriptor(i,t);return o!=null&&o.set&&(o!=null&&o.get)?Reflect.set(i,t,n,r):Reflect.set(i,t,n)}};function rr(){return Reflect.ownKeys(this).reduce((t,n)=>(t[n]=Reflect.get(this,n),t),{})}function qt(e){let t=r=>typeof r=="object"&&!Array.isArray(r)&&r!==null,n=(r,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(r)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0||typeof s=="object"&&s!==null&&s.__v_skip)return;let u=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?r[o]=s.initialize(e,u,o):t(s)&&s!==r&&!(s instanceof Element)&&n(s,u)})};return n(e)}function Wt(e,t=()=>{}){let n={initialValue:void 0,_x_interceptor:!0,initialize(r,i,o){return e(this.initialValue,()=>ir(r,i),s=>$e(r,i,s),i,o)}};return t(n),r=>{if(typeof r=="object"&&r!==null&&r._x_interceptor){let i=n.initialize.bind(n);n.initialize=(o,s,a)=>{let u=r.initialize(o,s,a);return n.initialValue=u,i(o,s,a)}}else n.initialValue=r;return n}}function ir(e,t){return t.split(".").reduce((n,r)=>n[r],e)}function $e(e,t,n){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=n;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),$e(e[t[0]],t.slice(1),n)}}var Ut={};function A(e,t){Ut[e]=t}function Pe(e,t){return Object.entries(Ut).forEach(([n,r])=>{let i=null;function o(){if(i)return i;{let[s,a]=Zt(t);return i={interceptor:Wt,...s},Je(t,a),i}}Object.defineProperty(e,`$${n}`,{get(){return r(t,o())},enumerable:!1})}),e}function or(e,t,n,...r){try{return n(...r)}catch(i){ee(i,e,t)}}function ee(e,t,n=void 0){e=Object.assign(e??{message:"No error message given."},{el:t,expression:n}),console.warn(`Alpine Expression Error: ${e.message}
+
+${n?'Expression: "'+n+`"
+
+`:""}`,t),setTimeout(()=>{throw e},0)}var fe=!0;function Jt(e){let t=fe;fe=!1;let n=e();return fe=t,n}function N(e,t,n={}){let r;return m(e,t)(i=>r=i,n),r}function m(...e){return Vt(...e)}var Vt=Yt;function sr(e){Vt=e}function Yt(e,t){let n={};Pe(n,e);let r=[n,...z(e)],i=typeof t=="function"?ar(r,t):cr(r,t,e);return or.bind(null,e,t,i)}function ar(e,t){return(n=()=>{},{scope:r={},params:i=[]}={})=>{let o=t.apply(re([r,...e]),i);pe(n,o)}}var Ee={};function ur(e,t){if(Ee[e])return Ee[e];let n=Object.getPrototypeOf(async function(){}).constructor,r=/^[\n\s]*if.*\(.*\)/.test(e.trim())||/^(let|const)\s/.test(e.trim())?`(async()=>{ ${e} })()`:e,o=(()=>{try{let s=new n(["__self","scope"],`with (scope) { __self.result = ${r} }; __self.finished = true; return __self.result;`);return Object.defineProperty(s,"name",{value:`[Alpine] ${e}`}),s}catch(s){return ee(s,t,e),Promise.resolve()}})();return Ee[e]=o,o}function cr(e,t,n){let r=ur(t,n);return(i=()=>{},{scope:o={},params:s=[]}={})=>{r.result=void 0,r.finished=!1;let a=re([o,...e]);if(typeof r=="function"){let u=r(r,a).catch(c=>ee(c,n,t));r.finished?(pe(i,r.result,a,s,n),r.result=void 0):u.then(c=>{pe(i,c,a,s,n)}).catch(c=>ee(c,n,t)).finally(()=>r.result=void 0)}}}function pe(e,t,n,r,i){if(fe&&typeof t=="function"){let o=t.apply(n,r);o instanceof Promise?o.then(s=>pe(e,s,n,r)).catch(s=>ee(s,i,t)):e(o)}else typeof t=="object"&&t instanceof Promise?t.then(o=>e(o)):e(t)}var Qe="x-";function U(e=""){return Qe+e}function lr(e){Qe=e}var Re={};function x(e,t){return Re[e]=t,{before(n){if(!Re[n]){console.warn(String.raw`Cannot find directive \`${n}\`. \`${e}\` will use the default order of execution`);return}const r=j.indexOf(n);j.splice(r>=0?r:j.indexOf("DEFAULT"),0,e)}}}function et(e,t,n){if(t=Array.from(t),e._x_virtualDirectives){let o=Object.entries(e._x_virtualDirectives).map(([a,u])=>({name:a,value:u})),s=Gt(o);o=o.map(a=>s.find(u=>u.name===a.name)?{name:`x-bind:${a.name}`,value:`"${a.value}"`}:a),t=t.concat(o)}let r={};return t.map(tn((o,s)=>r[o]=s)).filter(rn).map(_r(r,n)).sort(pr).map(o=>dr(e,o))}function Gt(e){return Array.from(e).map(tn()).filter(t=>!rn(t))}var je=!1,X=new Map,Xt=Symbol();function fr(e){je=!0;let t=Symbol();Xt=t,X.set(t,[]);let n=()=>{for(;X.get(t).length;)X.get(t).shift()();X.delete(t)},r=()=>{je=!1,n()};e(n),r()}function Zt(e){let t=[],n=a=>t.push(a),[r,i]=Jn(e);return t.push(i),[{Alpine:ie,effect:r,cleanup:n,evaluateLater:m.bind(m,e),evaluate:N.bind(N,e)},()=>t.forEach(a=>a())]}function dr(e,t){let n=()=>{},r=Re[t.type]||n,[i,o]=Zt(e);Kt(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(r.inline&&r.inline(e,t,i),r=r.bind(r,e,t,i),je?X.get(Xt).push(r):r())};return s.runCleanups=o,s}var Qt=(e,t)=>({name:n,value:r})=>(n.startsWith(e)&&(n=n.replace(e,t)),{name:n,value:r}),en=e=>e;function tn(e=()=>{}){return({name:t,value:n})=>{let{name:r,value:i}=nn.reduce((o,s)=>s(o),{name:t,value:n});return r!==t&&e(r,t),{name:r,value:i}}}var nn=[];function tt(e){nn.push(e)}function rn({name:e}){return on().test(e)}var on=()=>new RegExp(`^${Qe}([^:^.]+)\\b`);function _r(e,t){return({name:n,value:r})=>{let i=n.match(on()),o=n.match(/:([a-zA-Z0-9\-_:]+)/),s=n.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[n]||n;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(u=>u.replace(".","")),expression:r,original:a}}}var Le="DEFAULT",j=["ignore","ref","data","id","anchor","bind","init","for","model","modelable","transition","show","if",Le,"teleport"];function pr(e,t){let n=j.indexOf(e.type)===-1?Le:e.type,r=j.indexOf(t.type)===-1?Le:t.type;return j.indexOf(n)-j.indexOf(r)}var Ne=[],nt=!1;function rt(e=()=>{}){return queueMicrotask(()=>{nt||setTimeout(()=>{Fe()})}),new Promise(t=>{Ne.push(()=>{e(),t()})})}function Fe(){for(nt=!1;Ne.length;)Ne.shift()()}function hr(){nt=!0}function it(e,t){return Array.isArray(t)?ht(e,t.join(" ")):typeof t=="object"&&t!==null?gr(e,t):typeof t=="function"?it(e,t()):ht(e,t)}function ht(e,t){let n=i=>i.split(" ").filter(o=>!e.classList.contains(o)).filter(Boolean),r=i=>(e.classList.add(...i),()=>{e.classList.remove(...i)});return t=t===!0?t="":t||"",r(n(t))}function gr(e,t){let n=a=>a.split(" ").filter(Boolean),r=Object.entries(t).flatMap(([a,u])=>u?n(a):!1).filter(Boolean),i=Object.entries(t).flatMap(([a,u])=>u?!1:n(a)).filter(Boolean),o=[],s=[];return i.forEach(a=>{e.classList.contains(a)&&(e.classList.remove(a),s.push(a))}),r.forEach(a=>{e.classList.contains(a)||(e.classList.add(a),o.push(a))}),()=>{s.forEach(a=>e.classList.add(a)),o.forEach(a=>e.classList.remove(a))}}function xe(e,t){return typeof t=="object"&&t!==null?xr(e,t):yr(e,t)}function xr(e,t){let n={};return Object.entries(t).forEach(([r,i])=>{n[r]=e.style[r],r.startsWith("--")||(r=vr(r)),e.style.setProperty(r,i)}),setTimeout(()=>{e.style.length===0&&e.removeAttribute("style")}),()=>{xe(e,n)}}function yr(e,t){let n=e.getAttribute("style",t);return e.setAttribute("style",t),()=>{e.setAttribute("style",n||"")}}function vr(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}function Be(e,t=()=>{}){let n=!1;return function(){n?t.apply(this,arguments):(n=!0,e.apply(this,arguments))}}x("transition",(e,{value:t,modifiers:n,expression:r},{evaluate:i})=>{typeof r=="function"&&(r=i(r)),r!==!1&&(!r||typeof r=="boolean"?mr(e,n,t):br(e,r,t))});function br(e,t,n){sn(e,it,""),{enter:i=>{e._x_transition.enter.during=i},"enter-start":i=>{e._x_transition.enter.start=i},"enter-end":i=>{e._x_transition.enter.end=i},leave:i=>{e._x_transition.leave.during=i},"leave-start":i=>{e._x_transition.leave.start=i},"leave-end":i=>{e._x_transition.leave.end=i}}[n](t)}function mr(e,t,n){sn(e,xe);let r=!t.includes("in")&&!t.includes("out")&&!n,i=r||t.includes("in")||["enter"].includes(n),o=r||t.includes("out")||["leave"].includes(n);t.includes("in")&&!r&&(t=t.filter((p,g)=>g<t.indexOf("out"))),t.includes("out")&&!r&&(t=t.filter((p,g)=>g>t.indexOf("out")));let s=!t.includes("opacity")&&!t.includes("scale"),a=s||t.includes("opacity"),u=s||t.includes("scale"),c=a?0:1,l=u?Y(t,"scale",95)/100:1,d=Y(t,"delay",0)/1e3,_=Y(t,"origin","center"),v="opacity, transform",M=Y(t,"duration",150)/1e3,oe=Y(t,"duration",75)/1e3,f="cubic-bezier(0.4, 0.0, 0.2, 1)";i&&(e._x_transition.enter.during={transformOrigin:_,transitionDelay:`${d}s`,transitionProperty:v,transitionDuration:`${M}s`,transitionTimingFunction:f},e._x_transition.enter.start={opacity:c,transform:`scale(${l})`},e._x_transition.enter.end={opacity:1,transform:"scale(1)"}),o&&(e._x_transition.leave.during={transformOrigin:_,transitionDelay:`${d}s`,transitionProperty:v,transitionDuration:`${oe}s`,transitionTimingFunction:f},e._x_transition.leave.start={opacity:1,transform:"scale(1)"},e._x_transition.leave.end={opacity:c,transform:`scale(${l})`})}function sn(e,t,n={}){e._x_transition||(e._x_transition={enter:{during:n,start:n,end:n},leave:{during:n,start:n,end:n},in(r=()=>{},i=()=>{}){De(e,t,{during:this.enter.during,start:this.enter.start,end:this.enter.end},r,i)},out(r=()=>{},i=()=>{}){De(e,t,{during:this.leave.during,start:this.leave.start,end:this.leave.end},r,i)}})}window.Element.prototype._x_toggleAndCascadeWithTransitions=function(e,t,n,r){const i=document.visibilityState==="visible"?requestAnimationFrame:setTimeout;let o=()=>i(n);if(t){e._x_transition&&(e._x_transition.enter||e._x_transition.leave)?e._x_transition.enter&&(Object.entries(e._x_transition.enter.during).length||Object.entries(e._x_transition.enter.start).length||Object.entries(e._x_transition.enter.end).length)?e._x_transition.in(n):o():e._x_transition?e._x_transition.in(n):o();return}e._x_hidePromise=e._x_transition?new Promise((s,a)=>{e._x_transition.out(()=>{},()=>s(r)),e._x_transitioning&&e._x_transitioning.beforeCancel(()=>a({isFromCancelledTransition:!0}))}):Promise.resolve(r),queueMicrotask(()=>{let s=an(e);s?(s._x_hideChildren||(s._x_hideChildren=[]),s._x_hideChildren.push(e)):i(()=>{let a=u=>{let c=Promise.all([u._x_hidePromise,...(u._x_hideChildren||[]).map(a)]).then(([l])=>l());return delete u._x_hidePromise,delete u._x_hideChildren,c};a(e).catch(u=>{if(!u.isFromCancelledTransition)throw u})})})};function an(e){let t=e.parentNode;if(t)return t._x_hidePromise?t:an(t)}function De(e,t,{during:n,start:r,end:i}={},o=()=>{},s=()=>{}){if(e._x_transitioning&&e._x_transitioning.cancel(),Object.keys(n).length===0&&Object.keys(r).length===0&&Object.keys(i).length===0){o(),s();return}let a,u,c;wr(e,{start(){a=t(e,r)},during(){u=t(e,n)},before:o,end(){a(),c=t(e,i)},after:s,cleanup(){u(),c()}})}function wr(e,t){let n,r,i,o=Be(()=>{y(()=>{n=!0,r||t.before(),i||(t.end(),Fe()),t.after(),e.isConnected&&t.cleanup(),delete e._x_transitioning})});e._x_transitioning={beforeCancels:[],beforeCancel(s){this.beforeCancels.push(s)},cancel:Be(function(){for(;this.beforeCancels.length;)this.beforeCancels.shift()();o()}),finish:o},y(()=>{t.start(),t.during()}),hr(),requestAnimationFrame(()=>{if(n)return;let s=Number(getComputedStyle(e).transitionDuration.replace(/,.*/,"").replace("s",""))*1e3,a=Number(getComputedStyle(e).transitionDelay.replace(/,.*/,"").replace("s",""))*1e3;s===0&&(s=Number(getComputedStyle(e).animationDuration.replace("s",""))*1e3),y(()=>{t.before()}),r=!0,requestAnimationFrame(()=>{n||(y(()=>{t.end()}),Fe(),setTimeout(e._x_transitioning.finish,s+a),i=!0)})})}function Y(e,t,n){if(e.indexOf(t)===-1)return n;const r=e[e.indexOf(t)+1];if(!r||t==="scale"&&isNaN(r))return n;if(t==="duration"||t==="delay"){let i=r.match(/([0-9]+)ms/);if(i)return i[1]}return t==="origin"&&["top","right","left","center","bottom"].includes(e[e.indexOf(t)+2])?[r,e[e.indexOf(t)+2]].join(" "):r}var $=!1;function K(e,t=()=>{}){return(...n)=>$?t(...n):e(...n)}function Er(e){return(...t)=>$&&e(...t)}var un=[];function ye(e){un.push(e)}function Sr(e,t){un.forEach(n=>n(e,t)),$=!0,cn(()=>{C(t,(n,r)=>{r(n,()=>{})})}),$=!1}var Ke=!1;function Ar(e,t){t._x_dataStack||(t._x_dataStack=e._x_dataStack),$=!0,Ke=!0,cn(()=>{Or(t)}),$=!1,Ke=!1}function Or(e){let t=!1;C(e,(r,i)=>{I(r,(o,s)=>{if(t&&Yn(o))return s();t=!0,i(o,s)})})}function cn(e){let t=D;_t((n,r)=>{let i=t(n);return W(i),()=>{}}),e(),_t(t)}function ln(e,t,n,r=[]){switch(e._x_bindings||(e._x_bindings=q({})),e._x_bindings[t]=n,t=r.includes("camel")?jr(t):t,t){case"value":Cr(e,n);break;case"style":Tr(e,n);break;case"class":Mr(e,n);break;case"selected":case"checked":Ir(e,t,n);break;default:fn(e,t,n);break}}function Cr(e,t){if(e.type==="radio")e.attributes.value===void 0&&(e.value=t),window.fromModel&&(typeof t=="boolean"?e.checked=de(e.value)===t:e.checked=gt(e.value,t));else if(e.type==="checkbox")Number.isInteger(t)?e.value=t:!Array.isArray(t)&&typeof t!="boolean"&&![null,void 0].includes(t)?e.value=String(t):Array.isArray(t)?e.checked=t.some(n=>gt(n,e.value)):e.checked=!!t;else if(e.tagName==="SELECT")Rr(e,t);else{if(e.value===t)return;e.value=t===void 0?"":t}}function Mr(e,t){e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedClasses=it(e,t)}function Tr(e,t){e._x_undoAddedStyles&&e._x_undoAddedStyles(),e._x_undoAddedStyles=xe(e,t)}function Ir(e,t,n){fn(e,t,n),Pr(e,t,n)}function fn(e,t,n){[null,void 0,!1].includes(n)&&Lr(t)?e.removeAttribute(t):(dn(t)&&(n=t),$r(e,t,n))}function $r(e,t,n){e.getAttribute(t)!=n&&e.setAttribute(t,n)}function Pr(e,t,n){e[t]!==n&&(e[t]=n)}function Rr(e,t){const n=[].concat(t).map(r=>r+"");Array.from(e.options).forEach(r=>{r.selected=n.includes(r.value)})}function jr(e){return e.toLowerCase().replace(/-(\w)/g,(t,n)=>n.toUpperCase())}function gt(e,t){return e==t}function de(e){return[1,"1","true","on","yes",!0].includes(e)?!0:[0,"0","false","off","no",!1].includes(e)?!1:e?!!e:null}function dn(e){return["disabled","checked","required","readonly","hidden","open","selected","autofocus","itemscope","multiple","novalidate","allowfullscreen","allowpaymentrequest","formnovalidate","autoplay","controls","loop","muted","playsinline","default","ismap","reversed","async","defer","nomodule"].includes(e)}function Lr(e){return!["aria-pressed","aria-checked","aria-expanded","aria-selected"].includes(e)}function Nr(e,t,n){return e._x_bindings&&e._x_bindings[t]!==void 0?e._x_bindings[t]:_n(e,t,n)}function Fr(e,t,n,r=!0){if(e._x_bindings&&e._x_bindings[t]!==void 0)return e._x_bindings[t];if(e._x_inlineBindings&&e._x_inlineBindings[t]!==void 0){let i=e._x_inlineBindings[t];return i.extract=r,Jt(()=>N(e,i.expression))}return _n(e,t,n)}function _n(e,t,n){let r=e.getAttribute(t);return r===null?typeof n=="function"?n():n:r===""?!0:dn(t)?!![t,"true"].includes(r):r}function pn(e,t){var n;return function(){var r=this,i=arguments,o=function(){n=null,e.apply(r,i)};clearTimeout(n),n=setTimeout(o,t)}}function hn(e,t){let n;return function(){let r=this,i=arguments;n||(e.apply(r,i),n=!0,setTimeout(()=>n=!1,t))}}function gn({get:e,set:t},{get:n,set:r}){let i=!0,o,s=D(()=>{let a=e(),u=n();if(i)r(Se(a)),i=!1;else{let c=JSON.stringify(a),l=JSON.stringify(u);c!==o?r(Se(a)):c!==l&&t(Se(u))}o=JSON.stringify(e()),JSON.stringify(n())});return()=>{W(s)}}function Se(e){return typeof e=="object"?JSON.parse(JSON.stringify(e)):e}function Br(e){(Array.isArray(e)?e:[e]).forEach(n=>n(ie))}var R={},xt=!1;function Dr(e,t){if(xt||(R=q(R),xt=!0),t===void 0)return R[e];R[e]=t,typeof t=="object"&&t!==null&&t.hasOwnProperty("init")&&typeof t.init=="function"&&R[e].init(),qt(R[e])}function Kr(){return R}var xn={};function kr(e,t){let n=typeof t!="function"?()=>t:t;return e instanceof Element?yn(e,n()):(xn[e]=n,()=>{})}function zr(e){return Object.entries(xn).forEach(([t,n])=>{Object.defineProperty(e,t,{get(){return(...r)=>n(...r)}})}),e}function yn(e,t,n){let r=[];for(;r.length;)r.pop()();let i=Object.entries(t).map(([s,a])=>({name:s,value:a})),o=Gt(i);return i=i.map(s=>o.find(a=>a.name===s.name)?{name:`x-bind:${s.name}`,value:`"${s.value}"`}:s),et(e,i,n).map(s=>{r.push(s.runCleanups),s()}),()=>{for(;r.length;)r.pop()()}}var vn={};function Hr(e,t){vn[e]=t}function qr(e,t){return Object.entries(vn).forEach(([n,r])=>{Object.defineProperty(e,n,{get(){return(...i)=>r.bind(t)(...i)},enumerable:!1})}),e}var Wr={get reactive(){return q},get release(){return W},get effect(){return D},get raw(){return Mt},version:"3.13.7",flushAndStopDeferringMutations:tr,dontAutoEvaluateFunctions:Jt,disableEffectScheduling:Wn,startObservingMutations:Ge,stopObservingMutations:zt,setReactivityEngine:Un,onAttributeRemoved:Kt,onAttributesAdded:Dt,closestDataStack:z,skipDuringClone:K,onlyDuringClone:Er,addRootSelector:Rt,addInitSelector:jt,interceptClone:ye,addScopeToNode:ne,deferMutations:er,mapAttributes:tt,evaluateLater:m,interceptInit:Gn,setEvaluator:sr,mergeProxies:re,extractProp:Fr,findClosest:te,onElRemoved:Je,closestRoot:ge,destroyTree:Ue,interceptor:Wt,transition:De,setStyles:xe,mutateDom:y,directive:x,entangle:gn,throttle:hn,debounce:pn,evaluate:N,initTree:C,nextTick:rt,prefixed:U,prefix:lr,plugin:Br,magic:A,store:Dr,start:Vn,clone:Ar,cloneNode:Sr,bound:Nr,$data:Ht,watch:Tt,walk:I,data:Hr,bind:kr},ie=Wr;function Ur(e,t){const n=Object.create(null),r=e.split(",");for(let i=0;i<r.length;i++)n[r[i]]=!0;return t?i=>!!n[i.toLowerCase()]:i=>!!n[i]}var Jr=Object.freeze({}),Vr=Object.prototype.hasOwnProperty,ve=(e,t)=>Vr.call(e,t),F=Array.isArray,Q=e=>bn(e)==="[object Map]",Yr=e=>typeof e=="string",ot=e=>typeof e=="symbol",be=e=>e!==null&&typeof e=="object",Gr=Object.prototype.toString,bn=e=>Gr.call(e),mn=e=>bn(e).slice(8,-1),st=e=>Yr(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,Xr=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},Zr=Xr(e=>e.charAt(0).toUpperCase()+e.slice(1)),wn=(e,t)=>e!==t&&(e===e||t===t),ke=new WeakMap,G=[],O,B=Symbol("iterate"),ze=Symbol("Map key iterate");function Qr(e){return e&&e._isEffect===!0}function ei(e,t=Jr){Qr(e)&&(e=e.raw);const n=ri(e,t);return t.lazy||n(),n}function ti(e){e.active&&(En(e),e.options.onStop&&e.options.onStop(),e.active=!1)}var ni=0;function ri(e,t){const n=function(){if(!n.active)return e();if(!G.includes(n)){En(n);try{return oi(),G.push(n),O=n,e()}finally{G.pop(),Sn(),O=G[G.length-1]}}};return n.id=ni++,n.allowRecurse=!!t.allowRecurse,n._isEffect=!0,n.active=!0,n.raw=e,n.deps=[],n.options=t,n}function En(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}var H=!0,at=[];function ii(){at.push(H),H=!1}function oi(){at.push(H),H=!0}function Sn(){const e=at.pop();H=e===void 0?!0:e}function S(e,t,n){if(!H||O===void 0)return;let r=ke.get(e);r||ke.set(e,r=new Map);let i=r.get(n);i||r.set(n,i=new Set),i.has(O)||(i.add(O),O.deps.push(i),O.options.onTrack&&O.options.onTrack({effect:O,target:e,type:t,key:n}))}function P(e,t,n,r,i,o){const s=ke.get(e);if(!s)return;const a=new Set,u=l=>{l&&l.forEach(d=>{(d!==O||d.allowRecurse)&&a.add(d)})};if(t==="clear")s.forEach(u);else if(n==="length"&&F(e))s.forEach((l,d)=>{(d==="length"||d>=r)&&u(l)});else switch(n!==void 0&&u(s.get(n)),t){case"add":F(e)?st(n)&&u(s.get("length")):(u(s.get(B)),Q(e)&&u(s.get(ze)));break;case"delete":F(e)||(u(s.get(B)),Q(e)&&u(s.get(ze)));break;case"set":Q(e)&&u(s.get(B));break}const c=l=>{l.options.onTrigger&&l.options.onTrigger({effect:l,target:e,key:n,type:t,newValue:r,oldValue:i,oldTarget:o}),l.options.scheduler?l.options.scheduler(l):l()};a.forEach(c)}var si=Ur("__proto__,__v_isRef,__isVue"),An=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(ot)),ai=On(),ui=On(!0),yt=ci();function ci(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=h(this);for(let o=0,s=this.length;o<s;o++)S(r,"get",o+"");const i=r[t](...n);return i===-1||i===!1?r[t](...n.map(h)):i}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){ii();const r=h(this)[t].apply(this,n);return Sn(),r}}),e}function On(e=!1,t=!1){return function(r,i,o){if(i==="__v_isReactive")return!e;if(i==="__v_isReadonly")return e;if(i==="__v_raw"&&o===(e?t?Ai:In:t?Si:Tn).get(r))return r;const s=F(r);if(!e&&s&&ve(yt,i))return Reflect.get(yt,i,o);const a=Reflect.get(r,i,o);return(ot(i)?An.has(i):si(i))||(e||S(r,"get",i),t)?a:He(a)?!s||!st(i)?a.value:a:be(a)?e?$n(a):ft(a):a}}var li=fi();function fi(e=!1){return function(n,r,i,o){let s=n[r];if(!e&&(i=h(i),s=h(s),!F(n)&&He(s)&&!He(i)))return s.value=i,!0;const a=F(n)&&st(r)?Number(r)<n.length:ve(n,r),u=Reflect.set(n,r,i,o);return n===h(o)&&(a?wn(i,s)&&P(n,"set",r,i,s):P(n,"add",r,i)),u}}function di(e,t){const n=ve(e,t),r=e[t],i=Reflect.deleteProperty(e,t);return i&&n&&P(e,"delete",t,void 0,r),i}function _i(e,t){const n=Reflect.has(e,t);return(!ot(t)||!An.has(t))&&S(e,"has",t),n}function pi(e){return S(e,"iterate",F(e)?"length":B),Reflect.ownKeys(e)}var hi={get:ai,set:li,deleteProperty:di,has:_i,ownKeys:pi},gi={get:ui,set(e,t){return console.warn(`Set operation on key "${String(t)}" failed: target is readonly.`,e),!0},deleteProperty(e,t){return console.warn(`Delete operation on key "${String(t)}" failed: target is readonly.`,e),!0}},ut=e=>be(e)?ft(e):e,ct=e=>be(e)?$n(e):e,lt=e=>e,me=e=>Reflect.getPrototypeOf(e);function se(e,t,n=!1,r=!1){e=e.__v_raw;const i=h(e),o=h(t);t!==o&&!n&&S(i,"get",t),!n&&S(i,"get",o);const{has:s}=me(i),a=r?lt:n?ct:ut;if(s.call(i,t))return a(e.get(t));if(s.call(i,o))return a(e.get(o));e!==i&&e.get(t)}function ae(e,t=!1){const n=this.__v_raw,r=h(n),i=h(e);return e!==i&&!t&&S(r,"has",e),!t&&S(r,"has",i),e===i?n.has(e):n.has(e)||n.has(i)}function ue(e,t=!1){return e=e.__v_raw,!t&&S(h(e),"iterate",B),Reflect.get(e,"size",e)}function vt(e){e=h(e);const t=h(this);return me(t).has.call(t,e)||(t.add(e),P(t,"add",e,e)),this}function bt(e,t){t=h(t);const n=h(this),{has:r,get:i}=me(n);let o=r.call(n,e);o?Mn(n,r,e):(e=h(e),o=r.call(n,e));const s=i.call(n,e);return n.set(e,t),o?wn(t,s)&&P(n,"set",e,t,s):P(n,"add",e,t),this}function mt(e){const t=h(this),{has:n,get:r}=me(t);let i=n.call(t,e);i?Mn(t,n,e):(e=h(e),i=n.call(t,e));const o=r?r.call(t,e):void 0,s=t.delete(e);return i&&P(t,"delete",e,void 0,o),s}function wt(){const e=h(this),t=e.size!==0,n=Q(e)?new Map(e):new Set(e),r=e.clear();return t&&P(e,"clear",void 0,void 0,n),r}function ce(e,t){return function(r,i){const o=this,s=o.__v_raw,a=h(s),u=t?lt:e?ct:ut;return!e&&S(a,"iterate",B),s.forEach((c,l)=>r.call(i,u(c),u(l),o))}}function le(e,t,n){return function(...r){const i=this.__v_raw,o=h(i),s=Q(o),a=e==="entries"||e===Symbol.iterator&&s,u=e==="keys"&&s,c=i[e](...r),l=n?lt:t?ct:ut;return!t&&S(o,"iterate",u?ze:B),{next(){const{value:d,done:_}=c.next();return _?{value:d,done:_}:{value:a?[l(d[0]),l(d[1])]:l(d),done:_}},[Symbol.iterator](){return this}}}}function T(e){return function(...t){{const n=t[0]?`on key "${t[0]}" `:"";console.warn(`${Zr(e)} operation ${n}failed: target is readonly.`,h(this))}return e==="delete"?!1:this}}function xi(){const e={get(o){return se(this,o)},get size(){return ue(this)},has:ae,add:vt,set:bt,delete:mt,clear:wt,forEach:ce(!1,!1)},t={get(o){return se(this,o,!1,!0)},get size(){return ue(this)},has:ae,add:vt,set:bt,delete:mt,clear:wt,forEach:ce(!1,!0)},n={get(o){return se(this,o,!0)},get size(){return ue(this,!0)},has(o){return ae.call(this,o,!0)},add:T("add"),set:T("set"),delete:T("delete"),clear:T("clear"),forEach:ce(!0,!1)},r={get(o){return se(this,o,!0,!0)},get size(){return ue(this,!0)},has(o){return ae.call(this,o,!0)},add:T("add"),set:T("set"),delete:T("delete"),clear:T("clear"),forEach:ce(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=le(o,!1,!1),n[o]=le(o,!0,!1),t[o]=le(o,!1,!0),r[o]=le(o,!0,!0)}),[e,n,t,r]}var[yi,vi,bi,mi]=xi();function Cn(e,t){const n=t?e?mi:bi:e?vi:yi;return(r,i,o)=>i==="__v_isReactive"?!e:i==="__v_isReadonly"?e:i==="__v_raw"?r:Reflect.get(ve(n,i)&&i in r?n:r,i,o)}var wi={get:Cn(!1,!1)},Ei={get:Cn(!0,!1)};function Mn(e,t,n){const r=h(n);if(r!==n&&t.call(e,r)){const i=mn(e);console.warn(`Reactive ${i} contains both the raw and reactive versions of the same object${i==="Map"?" as keys":""}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`)}}var Tn=new WeakMap,Si=new WeakMap,In=new WeakMap,Ai=new WeakMap;function Oi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function Ci(e){return e.__v_skip||!Object.isExtensible(e)?0:Oi(mn(e))}function ft(e){return e&&e.__v_isReadonly?e:Pn(e,!1,hi,wi,Tn)}function $n(e){return Pn(e,!0,gi,Ei,In)}function Pn(e,t,n,r,i){if(!be(e))return console.warn(`value cannot be made reactive: ${String(e)}`),e;if(e.__v_raw&&!(t&&e.__v_isReactive))return e;const o=i.get(e);if(o)return o;const s=Ci(e);if(s===0)return e;const a=new Proxy(e,s===2?r:n);return i.set(e,a),a}function h(e){return e&&h(e.__v_raw)||e}function He(e){return!!(e&&e.__v_isRef===!0)}A("nextTick",()=>rt);A("dispatch",e=>Z.bind(Z,e));A("watch",(e,{evaluateLater:t,cleanup:n})=>(r,i)=>{let o=t(r),a=Tt(()=>{let u;return o(c=>u=c),u},i);n(a)});A("store",Kr);A("data",e=>Ht(e));A("root",e=>ge(e));A("refs",e=>(e._x_refs_proxy||(e._x_refs_proxy=re(Mi(e))),e._x_refs_proxy));function Mi(e){let t=[];return te(e,n=>{n._x_refs&&t.push(n._x_refs)}),t}var Ae={};function Rn(e){return Ae[e]||(Ae[e]=0),++Ae[e]}function Ti(e,t){return te(e,n=>{if(n._x_ids&&n._x_ids[t])return!0})}function Ii(e,t){e._x_ids||(e._x_ids={}),e._x_ids[t]||(e._x_ids[t]=Rn(t))}A("id",(e,{cleanup:t})=>(n,r=null)=>{let i=`${n}${r?`-${r}`:""}`;return $i(e,i,t,()=>{let o=Ti(e,n),s=o?o._x_ids[n]:Rn(n);return r?`${n}-${s}-${r}`:`${n}-${s}`})});ye((e,t)=>{e._x_id&&(t._x_id=e._x_id)});function $i(e,t,n,r){if(e._x_id||(e._x_id={}),e._x_id[t])return e._x_id[t];let i=r();return e._x_id[t]=i,n(()=>{delete e._x_id[t]}),i}A("el",e=>e);jn("Focus","focus","focus");jn("Persist","persist","persist");function jn(e,t,n){A(t,r=>E(`You can't use [$${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${n}`,r))}x("modelable",(e,{expression:t},{effect:n,evaluateLater:r,cleanup:i})=>{let o=r(t),s=()=>{let l;return o(d=>l=d),l},a=r(`${t} = __placeholder`),u=l=>a(()=>{},{scope:{__placeholder:l}}),c=s();u(c),queueMicrotask(()=>{if(!e._x_model)return;e._x_removeModelListeners.default();let l=e._x_model.get,d=e._x_model.set,_=gn({get(){return l()},set(v){d(v)}},{get(){return s()},set(v){u(v)}});i(_)})});x("teleport",(e,{modifiers:t,expression:n},{cleanup:r})=>{e.tagName.toLowerCase()!=="template"&&E("x-teleport can only be used on a <template> tag",e);let i=Et(n),o=e.content.cloneNode(!0).firstElementChild;e._x_teleport=o,o._x_teleportBack=e,e.setAttribute("data-teleport-template",!0),o.setAttribute("data-teleport-target",!0),e._x_forwardEvents&&e._x_forwardEvents.forEach(a=>{o.addEventListener(a,u=>{u.stopPropagation(),e.dispatchEvent(new u.constructor(u.type,u))})}),ne(o,{},e);let s=(a,u,c)=>{c.includes("prepend")?u.parentNode.insertBefore(a,u):c.includes("append")?u.parentNode.insertBefore(a,u.nextSibling):u.appendChild(a)};y(()=>{s(o,i,t),C(o),o._x_ignore=!0}),e._x_teleportPutBack=()=>{let a=Et(n);y(()=>{s(e._x_teleport,a,t)})},r(()=>o.remove())});var Pi=document.createElement("div");function Et(e){let t=K(()=>document.querySelector(e),()=>Pi)();return t||E(`Cannot find x-teleport element for selector: "${e}"`),t}var Ln=()=>{};Ln.inline=(e,{modifiers:t},{cleanup:n})=>{t.includes("self")?e._x_ignoreSelf=!0:e._x_ignore=!0,n(()=>{t.includes("self")?delete e._x_ignoreSelf:delete e._x_ignore})};x("ignore",Ln);x("effect",K((e,{expression:t},{effect:n})=>{n(m(e,t))}));function qe(e,t,n,r){let i=e,o=u=>r(u),s={},a=(u,c)=>l=>c(u,l);if(n.includes("dot")&&(t=Ri(t)),n.includes("camel")&&(t=ji(t)),n.includes("passive")&&(s.passive=!0),n.includes("capture")&&(s.capture=!0),n.includes("window")&&(i=window),n.includes("document")&&(i=document),n.includes("debounce")){let u=n[n.indexOf("debounce")+1]||"invalid-wait",c=he(u.split("ms")[0])?Number(u.split("ms")[0]):250;o=pn(o,c)}if(n.includes("throttle")){let u=n[n.indexOf("throttle")+1]||"invalid-wait",c=he(u.split("ms")[0])?Number(u.split("ms")[0]):250;o=hn(o,c)}return n.includes("prevent")&&(o=a(o,(u,c)=>{c.preventDefault(),u(c)})),n.includes("stop")&&(o=a(o,(u,c)=>{c.stopPropagation(),u(c)})),n.includes("self")&&(o=a(o,(u,c)=>{c.target===e&&u(c)})),(n.includes("away")||n.includes("outside"))&&(i=document,o=a(o,(u,c)=>{e.contains(c.target)||c.target.isConnected!==!1&&(e.offsetWidth<1&&e.offsetHeight<1||e._x_isShown!==!1&&u(c))})),n.includes("once")&&(o=a(o,(u,c)=>{u(c),i.removeEventListener(t,o,s)})),o=a(o,(u,c)=>{Ni(t)&&Fi(c,n)||u(c)}),i.addEventListener(t,o,s),()=>{i.removeEventListener(t,o,s)}}function Ri(e){return e.replace(/-/g,".")}function ji(e){return e.toLowerCase().replace(/-(\w)/g,(t,n)=>n.toUpperCase())}function he(e){return!Array.isArray(e)&&!isNaN(e)}function Li(e){return[" ","_"].includes(e)?e:e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}function Ni(e){return["keydown","keyup"].includes(e)}function Fi(e,t){let n=t.filter(o=>!["window","document","prevent","stop","once","capture"].includes(o));if(n.includes("debounce")){let o=n.indexOf("debounce");n.splice(o,he((n[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(n.includes("throttle")){let o=n.indexOf("throttle");n.splice(o,he((n[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(n.length===0||n.length===1&&St(e.key).includes(n[0]))return!1;const i=["ctrl","shift","alt","meta","cmd","super"].filter(o=>n.includes(o));return n=n.filter(o=>!i.includes(o)),!(i.length>0&&i.filter(s=>((s==="cmd"||s==="super")&&(s="meta"),e[`${s}Key`])).length===i.length&&St(e.key).includes(n[0]))}function St(e){if(!e)return[];e=Li(e);let t={ctrl:"control",slash:"/",space:" ",spacebar:" ",cmd:"meta",esc:"escape",up:"arrow-up",down:"arrow-down",left:"arrow-left",right:"arrow-right",period:".",equal:"=",minus:"-",underscore:"_"};return t[e]=e,Object.keys(t).map(n=>{if(t[n]===e)return n}).filter(n=>n)}x("model",(e,{modifiers:t,expression:n},{effect:r,cleanup:i})=>{let o=e;t.includes("parent")&&(o=e.parentNode);let s=m(o,n),a;typeof n=="string"?a=m(o,`${n} = __placeholder`):typeof n=="function"&&typeof n()=="string"?a=m(o,`${n()} = __placeholder`):a=()=>{};let u=()=>{let _;return s(v=>_=v),At(_)?_.get():_},c=_=>{let v;s(M=>v=M),At(v)?v.set(_):a(()=>{},{scope:{__placeholder:_}})};typeof n=="string"&&e.type==="radio"&&y(()=>{e.hasAttribute("name")||e.setAttribute("name",n)});var l=e.tagName.toLowerCase()==="select"||["checkbox","radio"].includes(e.type)||t.includes("lazy")?"change":"input";let d=$?()=>{}:qe(e,l,t,_=>{c(Bi(e,t,_,u()))});if(t.includes("fill")&&([void 0,null,""].includes(u())||e.type==="checkbox"&&Array.isArray(u()))&&e.dispatchEvent(new Event(l,{})),e._x_removeModelListeners||(e._x_removeModelListeners={}),e._x_removeModelListeners.default=d,i(()=>e._x_removeModelListeners.default()),e.form){let _=qe(e.form,"reset",[],v=>{rt(()=>e._x_model&&e._x_model.set(e.value))});i(()=>_())}e._x_model={get(){return u()},set(_){c(_)}},e._x_forceModelUpdate=_=>{_===void 0&&typeof n=="string"&&n.match(/\./)&&(_=""),window.fromModel=!0,y(()=>ln(e,"value",_)),delete window.fromModel},r(()=>{let _=u();t.includes("unintrusive")&&document.activeElement.isSameNode(e)||e._x_forceModelUpdate(_)})});function Bi(e,t,n,r){return y(()=>{if(n instanceof CustomEvent&&n.detail!==void 0)return n.detail!==null&&n.detail!==void 0?n.detail:n.target.value;if(e.type==="checkbox")if(Array.isArray(r)){let i=null;return t.includes("number")?i=Oe(n.target.value):t.includes("boolean")?i=de(n.target.value):i=n.target.value,n.target.checked?r.concat([i]):r.filter(o=>!Di(o,i))}else return n.target.checked;else return e.tagName.toLowerCase()==="select"&&e.multiple?t.includes("number")?Array.from(n.target.selectedOptions).map(i=>{let o=i.value||i.text;return Oe(o)}):t.includes("boolean")?Array.from(n.target.selectedOptions).map(i=>{let o=i.value||i.text;return de(o)}):Array.from(n.target.selectedOptions).map(i=>i.value||i.text):t.includes("number")?Oe(n.target.value):t.includes("boolean")?de(n.target.value):t.includes("trim")?n.target.value.trim():n.target.value})}function Oe(e){let t=e?parseFloat(e):null;return Ki(t)?t:e}function Di(e,t){return e==t}function Ki(e){return!Array.isArray(e)&&!isNaN(e)}function At(e){return e!==null&&typeof e=="object"&&typeof e.get=="function"&&typeof e.set=="function"}x("cloak",e=>queueMicrotask(()=>y(()=>e.removeAttribute(U("cloak")))));jt(()=>`[${U("init")}]`);x("init",K((e,{expression:t},{evaluate:n})=>typeof t=="string"?!!t.trim()&&n(t,{},!1):n(t,{},!1)));x("text",(e,{expression:t},{effect:n,evaluateLater:r})=>{let i=r(t);n(()=>{i(o=>{y(()=>{e.textContent=o})})})});x("html",(e,{expression:t},{effect:n,evaluateLater:r})=>{let i=r(t);n(()=>{i(o=>{y(()=>{e.innerHTML=o,e._x_ignoreSelf=!0,C(e),delete e._x_ignoreSelf})})})});tt(Qt(":",en(U("bind:"))));var Nn=(e,{value:t,modifiers:n,expression:r,original:i},{effect:o})=>{if(!t){let a={};zr(a),m(e,r)(c=>{yn(e,c,i)},{scope:a});return}if(t==="key")return ki(e,r);if(e._x_inlineBindings&&e._x_inlineBindings[t]&&e._x_inlineBindings[t].extract)return;let s=m(e,r);o(()=>s(a=>{a===void 0&&typeof r=="string"&&r.match(/\./)&&(a=""),y(()=>ln(e,t,a,n))}))};Nn.inline=(e,{value:t,modifiers:n,expression:r})=>{t&&(e._x_inlineBindings||(e._x_inlineBindings={}),e._x_inlineBindings[t]={expression:r,extract:!1})};x("bind",Nn);function ki(e,t){e._x_keyExpression=t}Rt(()=>`[${U("data")}]`);x("data",(e,{expression:t},{cleanup:n})=>{if(zi(e))return;t=t===""?"{}":t;let r={};Pe(r,e);let i={};qr(i,r);let o=N(e,t,{scope:i});(o===void 0||o===!0)&&(o={}),Pe(o,e);let s=q(o);qt(s);let a=ne(e,s);s.init&&N(e,s.init),n(()=>{s.destroy&&N(e,s.destroy),a()})});ye((e,t)=>{e._x_dataStack&&(t._x_dataStack=e._x_dataStack,t.setAttribute("data-has-alpine-state",!0))});function zi(e){return $?Ke?!0:e.hasAttribute("data-has-alpine-state"):!1}x("show",(e,{modifiers:t,expression:n},{effect:r})=>{let i=m(e,n);e._x_doHide||(e._x_doHide=()=>{y(()=>{e.style.setProperty("display","none",t.includes("important")?"important":void 0)})}),e._x_doShow||(e._x_doShow=()=>{y(()=>{e.style.length===1&&e.style.display==="none"?e.removeAttribute("style"):e.style.removeProperty("display")})});let o=()=>{e._x_doHide(),e._x_isShown=!1},s=()=>{e._x_doShow(),e._x_isShown=!0},a=()=>setTimeout(s),u=Be(d=>d?s():o(),d=>{typeof e._x_toggleAndCascadeWithTransitions=="function"?e._x_toggleAndCascadeWithTransitions(e,d,s,o):d?a():o()}),c,l=!0;r(()=>i(d=>{!l&&d===c||(t.includes("immediate")&&(d?a():o()),u(d),c=d,l=!1)}))});x("for",(e,{expression:t},{effect:n,cleanup:r})=>{let i=qi(t),o=m(e,i.items),s=m(e,e._x_keyExpression||"index");e._x_prevKeys=[],e._x_lookup={},n(()=>Hi(e,i,o,s)),r(()=>{Object.values(e._x_lookup).forEach(a=>a.remove()),delete e._x_prevKeys,delete e._x_lookup})});function Hi(e,t,n,r){let i=s=>typeof s=="object"&&!Array.isArray(s),o=e;n(s=>{Wi(s)&&s>=0&&(s=Array.from(Array(s).keys(),f=>f+1)),s===void 0&&(s=[]);let a=e._x_lookup,u=e._x_prevKeys,c=[],l=[];if(i(s))s=Object.entries(s).map(([f,p])=>{let g=Ot(t,p,f,s);r(b=>{l.includes(b)&&E("Duplicate key on x-for",e),l.push(b)},{scope:{index:f,...g}}),c.push(g)});else for(let f=0;f<s.length;f++){let p=Ot(t,s[f],f,s);r(g=>{l.includes(g)&&E("Duplicate key on x-for",e),l.push(g)},{scope:{index:f,...p}}),c.push(p)}let d=[],_=[],v=[],M=[];for(let f=0;f<u.length;f++){let p=u[f];l.indexOf(p)===-1&&v.push(p)}u=u.filter(f=>!v.includes(f));let oe="template";for(let f=0;f<l.length;f++){let p=l[f],g=u.indexOf(p);if(g===-1)u.splice(f,0,p),d.push([oe,f]);else if(g!==f){let b=u.splice(f,1)[0],w=u.splice(g-1,1)[0];u.splice(f,0,w),u.splice(g,0,b),_.push([b,w])}else M.push(p);oe=p}for(let f=0;f<v.length;f++){let p=v[f];a[p]._x_effects&&a[p]._x_effects.forEach(Ct),a[p].remove(),a[p]=null,delete a[p]}for(let f=0;f<_.length;f++){let[p,g]=_[f],b=a[p],w=a[g],k=document.createElement("div");y(()=>{w||E('x-for ":key" is undefined or invalid',o,g,a),w.after(k),b.after(w),w._x_currentIfEl&&w.after(w._x_currentIfEl),k.before(b),b._x_currentIfEl&&b.after(b._x_currentIfEl),k.remove()}),w._x_refreshXForScope(c[l.indexOf(g)])}for(let f=0;f<d.length;f++){let[p,g]=d[f],b=p==="template"?o:a[p];b._x_currentIfEl&&(b=b._x_currentIfEl);let w=c[g],k=l[g],J=document.importNode(o.content,!0).firstElementChild,dt=q(w);ne(J,dt,o),J._x_refreshXForScope=Bn=>{Object.entries(Bn).forEach(([Dn,Kn])=>{dt[Dn]=Kn})},y(()=>{b.after(J),K(()=>C(J))()}),typeof k=="object"&&E("x-for key cannot be an object, it must be a string or an integer",o),a[k]=J}for(let f=0;f<M.length;f++)a[M[f]]._x_refreshXForScope(c[l.indexOf(M[f])]);o._x_prevKeys=l})}function qi(e){let t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,n=/^\s*\(|\)\s*$/g,r=/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/,i=e.match(r);if(!i)return;let o={};o.items=i[2].trim();let s=i[1].replace(n,"").trim(),a=s.match(t);return a?(o.item=s.replace(t,"").trim(),o.index=a[1].trim(),a[2]&&(o.collection=a[2].trim())):o.item=s,o}function Ot(e,t,n,r){let i={};return/^\[.*\]$/.test(e.item)&&Array.isArray(t)?e.item.replace("[","").replace("]","").split(",").map(s=>s.trim()).forEach((s,a)=>{i[s]=t[a]}):/^\{.*\}$/.test(e.item)&&!Array.isArray(t)&&typeof t=="object"?e.item.replace("{","").replace("}","").split(",").map(s=>s.trim()).forEach(s=>{i[s]=t[s]}):i[e.item]=t,e.index&&(i[e.index]=n),e.collection&&(i[e.collection]=r),i}function Wi(e){return!Array.isArray(e)&&!isNaN(e)}function Fn(){}Fn.inline=(e,{expression:t},{cleanup:n})=>{let r=ge(e);r._x_refs||(r._x_refs={}),r._x_refs[t]=e,n(()=>delete r._x_refs[t])};x("ref",Fn);x("if",(e,{expression:t},{effect:n,cleanup:r})=>{e.tagName.toLowerCase()!=="template"&&E("x-if can only be used on a <template> tag",e);let i=m(e,t),o=()=>{if(e._x_currentIfEl)return e._x_currentIfEl;let a=e.content.cloneNode(!0).firstElementChild;return ne(a,{},e),y(()=>{e.after(a),K(()=>C(a))()}),e._x_currentIfEl=a,e._x_undoIf=()=>{I(a,u=>{u._x_effects&&u._x_effects.forEach(Ct)}),a.remove(),delete e._x_currentIfEl},a},s=()=>{e._x_undoIf&&(e._x_undoIf(),delete e._x_undoIf)};n(()=>i(a=>{a?o():s()})),r(()=>e._x_undoIf&&e._x_undoIf())});x("id",(e,{expression:t},{evaluate:n})=>{n(t).forEach(i=>Ii(e,i))});ye((e,t)=>{e._x_ids&&(t._x_ids=e._x_ids)});tt(Qt("@",en(U("on:"))));x("on",K((e,{value:t,modifiers:n,expression:r},{cleanup:i})=>{let o=r?m(e,r):()=>{};e.tagName.toLowerCase()==="template"&&(e._x_forwardEvents||(e._x_forwardEvents=[]),e._x_forwardEvents.includes(t)||e._x_forwardEvents.push(t));let s=qe(e,t,n,a=>{o(()=>{},{scope:{$event:a},params:[a]})});i(()=>s())}));we("Collapse","collapse","collapse");we("Intersect","intersect","intersect");we("Focus","trap","focus");we("Mask","mask","mask");function we(e,t,n){x(t,r=>E(`You can't use [x-${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${n}`,r))}ie.setEvaluator(Yt);ie.setReactivityEngine({reactive:ft,effect:ei,release:ti,raw:h});var Ui=ie,Ji=Ui;export{Ji as m};
diff --git a/theme/keywind/login/resources/dist/assets/rfc4648-b81320ce.js b/theme/keywind/login/resources/dist/assets/rfc4648-b81320ce.js
new file mode 100644
index 000000000..307c47b6e
--- /dev/null
+++ b/theme/keywind/login/resources/dist/assets/rfc4648-b81320ce.js
@@ -0,0 +1 @@
+function w(f,r,a){var l;if(a===void 0&&(a={}),!r.codes){r.codes={};for(var v=0;v<r.chars.length;++v)r.codes[r.chars[v]]=v}if(!a.loose&&f.length*r.bits&7)throw new SyntaxError("Invalid padding");for(var b=f.length;f[b-1]==="=";)if(--b,!a.loose&&!((f.length-b)*r.bits&7))throw new SyntaxError("Invalid padding");for(var i=new((l=a.out)!=null?l:Uint8Array)(b*r.bits/8|0),t=0,s=0,h=0,e=0;e<b;++e){var u=r.codes[f[e]];if(u===void 0)throw new SyntaxError("Invalid character "+f[e]);s=s<<r.bits|u,t+=r.bits,t>=8&&(t-=8,i[h++]=255&s>>t)}if(t>=r.bits||255&s<<8-t)throw new SyntaxError("Unexpected end of data");return i}function x(f,r,a){a===void 0&&(a={});for(var l=a,v=l.pad,b=v===void 0?!0:v,i=(1<<r.bits)-1,t="",s=0,h=0,e=0;e<f.length;++e)for(h=h<<8|255&f[e],s+=8;s>r.bits;)s-=r.bits,t+=r.chars[i&h>>s];if(s&&(t+=r.chars[i&h<<r.bits-s]),b)for(;t.length*r.bits&7;)t+="=";return t}var o={chars:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_",bits:6},y={parse:function(r,a){return w(r,o,a)},stringify:function(r,a){return x(r,o,a)}};export{y as b};
diff --git a/theme/keywind/login/resources/dist/index.css b/theme/keywind/login/resources/dist/index.css
index 2bce21eac..c7c4546f0 100644
--- a/theme/keywind/login/resources/dist/index.css
+++ b/theme/keywind/login/resources/dist/index.css
@@ -1 +1 @@
-*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[type=text],input:where(:not([type])),[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow: 0 0 #0000}[type=text]:focus,input:where(:not([type])):focus,[type=email]:focus,[type=url]:focus,[type=password]:focus,[type=number]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=month]:focus,[type=search]:focus,[type=tel]:focus,[type=time]:focus,[type=week]:focus,[multiple]:focus,textarea:focus,select:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:initial;background-position:initial;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow: 0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 2px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}[type=radio]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")}[type=checkbox]:checked:hover,[type=checkbox]:checked:focus,[type=radio]:checked:hover,[type=radio]:checked:focus{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:indeterminate:hover,[type=checkbox]:indeterminate:focus{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}.shadow-lg{--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000}.focus\:ring,.focus\:ring-2{--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}[x-cloak]{display:none!important}.separate{display:flex;align-items:center;text-align:center}.separate:after,.separate:before{content:"";flex:1 1 0%;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.separate:not(:empty):after{margin-left:.5rem}.separate:not(:empty):before{margin-right:.5rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.absolute{position:absolute}.relative{position:relative}.-left-4{left:-1rem}.bottom-0{bottom:0}.right-3{right:.75rem}.top-3{top:.75rem}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.ml-2{margin-left:.5rem}.mr-1{margin-right:.25rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.max-h-80{max-height:20rem}.min-h-screen{min-height:100vh}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-full{width:100%}.max-w-md{max-width:28rem}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.columns-2{-moz-columns:2;columns:2}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.gap-4{gap:1rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-y-scroll{overflow-y:scroll}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-secondary-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.bg-blue-100{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity))}.bg-green-100{--tw-bg-opacity: 1;background-color:rgb(220 252 231 / var(--tw-bg-opacity))}.bg-orange-100{--tw-bg-opacity: 1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))}.bg-primary-600{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity))}.bg-red-100{--tw-bg-opacity: 1;background-color:rgb(254 226 226 / var(--tw-bg-opacity))}.bg-secondary-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.p-4{padding:1rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.pl-4{padding-left:1rem}.pt-4{padding-top:1rem}.text-center{text-align:center}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity))}.text-orange-600{--tw-text-opacity: 1;color:rgb(234 88 12 / var(--tw-text-opacity))}.text-primary-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity))}.text-secondary-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.text-secondary-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:border-transparent:hover{border-color:transparent}.hover\:bg-primary-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity))}.hover\:bg-provider-apple\/10:hover{background-color:#0000001a}.hover\:bg-provider-bitbucket\/10:hover{background-color:#0052cc1a}.hover\:bg-provider-discord\/10:hover{background-color:#5865f21a}.hover\:bg-provider-facebook\/10:hover{background-color:#1877f21a}.hover\:bg-provider-github\/10:hover{background-color:#1817171a}.hover\:bg-provider-gitlab\/10:hover{background-color:#fc6d261a}.hover\:bg-provider-google\/10:hover{background-color:#4285f41a}.hover\:bg-provider-instagram\/10:hover{background-color:#e4405f1a}.hover\:bg-provider-linkedin\/10:hover{background-color:#0a66c21a}.hover\:bg-provider-microsoft\/10:hover{background-color:#5e5e5e1a}.hover\:bg-provider-oidc\/10:hover{background-color:#f78c401a}.hover\:bg-provider-openshift\/10:hover{background-color:#ee00001a}.hover\:bg-provider-paypal\/10:hover{background-color:#00457c1a}.hover\:bg-provider-slack\/10:hover{background-color:#4a154b1a}.hover\:bg-provider-stackoverflow\/10:hover{background-color:#f580251a}.hover\:bg-provider-twitter\/10:hover{background-color:#1da1f21a}.hover\:bg-secondary-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.hover\:bg-secondary-200:hover{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.hover\:text-primary-500:hover{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity))}.hover\:text-secondary-900:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.focus\:border-primary-300:focus{--tw-border-opacity: 1;border-color:rgb(147 197 253 / var(--tw-border-opacity))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-primary-200:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity))}.focus\:ring-primary-600:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(37 99 235 / var(--tw-ring-opacity))}.focus\:ring-secondary-600:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(75 85 99 / var(--tw-ring-opacity))}.focus\:ring-opacity-50:focus{--tw-ring-opacity: .5}.focus\:ring-offset-2:focus{--tw-ring-offset-width: 2px}@media (min-width: 640px){.sm\:top-2{top:.5rem}.sm\:py-16{padding-top:4rem;padding-bottom:4rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}}
+@import"https://fonts.googleapis.com/css2?family=Mulish:wght@300..700&display=swap";*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[type=text],input:where(:not([type])),[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow: 0 0 #0000}[type=text]:focus,input:where(:not([type])):focus,[type=email]:focus,[type=url]:focus,[type=password]:focus,[type=number]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=month]:focus,[type=search]:focus,[type=tel]:focus,[type=time]:focus,[type=week]:focus,[multiple]:focus,textarea:focus,select:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:initial;background-position:initial;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow: 0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset: var(--tw-empty, );--tw-ring-offset-width: 2px;--tw-ring-offset-color: #fff;--tw-ring-color: #2563eb;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}@media (forced-colors: active){[type=checkbox]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=radio]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")}@media (forced-colors: active){[type=radio]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:checked:hover,[type=checkbox]:checked:focus,[type=radio]:checked:hover,[type=radio]:checked:focus{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}@media (forced-colors: active){[type=checkbox]:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:indeterminate:hover,[type=checkbox]:indeterminate:focus{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}html{font-family:Mulish,sans-serif;font-optical-sizing:auto;font-style:normal}h1,h2,h3,h4,h5,h6{font-family:Nunito,sans-serif;font-optical-sizing:auto;font-style:normal}:root{--background: 0 0% 100%;--foreground: 240 10% 3.9%;--card: 0 0% 100%;--card-foreground: 240 10% 3.9%;--popover: 0 0% 100%;--popover-foreground: 240 10% 3.9%;--primary: 279 82% 48%;--primary-foreground: 0 0% 98%;--secondary: 240 4.8% 95.9%;--secondary-foreground: 240 5.9% 10%;--muted: 240 4.8% 95.9%;--muted-foreground: 240 3.8% 46.1%;--accent: 240 4.8% 95.9%;--accent-foreground: 240 5.9% 10%;--destructive: 0 84.2% 60.2%;--destructive-foreground: 0 0% 98%;--border: 240 5.9% 90%;--input: 240 5.9% 90%;--ring: 240 5.9% 10%;--radius: .5rem}.dark{--background: 240 10% 3.9%;--foreground: 0 0% 98%;--card: 240 10% 3.9%;--card-foreground: 0 0% 98%;--popover: 240 10% 3.9%;--popover-foreground: 0 0% 98%;--primary: 279 100% 80%;--primary-foreground: 0 0% 98%;--secondary: 240 3.7% 15.9%;--secondary-foreground: 0 0% 98%;--muted: 240 3.7% 15.9%;--muted-foreground: 240 5% 64.9%;--accent: 240 3.7% 15.9%;--accent-foreground: 0 0% 98%;--destructive: 0 62.8% 30.6%;--destructive-foreground: 0 0% 98%;--border: 240 3.7% 15.9%;--input: 240 3.7% 15.9%;--ring: 240 4.9% 83.9%}.shadow-lg{--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000}.focus\:ring,.focus\:ring-2{--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}[x-cloak]{display:none!important}.separate{display:flex;align-items:center;text-align:center}.separate:after,.separate:before{content:"";flex:1 1 0%;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.separate:not(:empty):after{margin-left:.5rem}.separate:not(:empty):before{margin-right:.5rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.absolute{position:absolute}.relative{position:relative}.-left-4{left:-1rem}.bottom-0{bottom:0}.right-3{right:.75rem}.top-3{top:.75rem}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.ml-2{margin-left:.5rem}.mr-1{margin-right:.25rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.max-h-80{max-height:20rem}.min-h-screen{min-height:100vh}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-full{width:100%}.max-w-md{max-width:28rem}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.columns-2{-moz-columns:2;columns:2}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.gap-4{gap:1rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-y-scroll{overflow-y:scroll}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-secondary-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.bg-blue-100{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity))}.bg-green-100{--tw-bg-opacity: 1;background-color:rgb(220 252 231 / var(--tw-bg-opacity))}.bg-orange-100{--tw-bg-opacity: 1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))}.bg-primary-600{--tw-bg-opacity: 1;background-color:rgb(152 22 223 / var(--tw-bg-opacity))}.bg-red-100{--tw-bg-opacity: 1;background-color:rgb(254 226 226 / var(--tw-bg-opacity))}.bg-secondary-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.p-4{padding:1rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.pl-4{padding-left:1rem}.pt-4{padding-top:1rem}.text-center{text-align:center}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity))}.text-orange-600{--tw-text-opacity: 1;color:rgb(234 88 12 / var(--tw-text-opacity))}.text-primary-600{--tw-text-opacity: 1;color:rgb(152 22 223 / var(--tw-text-opacity))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity))}.text-secondary-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.text-secondary-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:border-transparent:hover{border-color:transparent}.hover\:bg-primary-700:hover{--tw-bg-opacity: 1;background-color:rgb(152 22 223 / var(--tw-bg-opacity))}.hover\:bg-provider-apple\/10:hover{background-color:#0000001a}.hover\:bg-provider-bitbucket\/10:hover{background-color:#0052cc1a}.hover\:bg-provider-discord\/10:hover{background-color:#5865f21a}.hover\:bg-provider-facebook\/10:hover{background-color:#1877f21a}.hover\:bg-provider-github\/10:hover{background-color:#1817171a}.hover\:bg-provider-gitlab\/10:hover{background-color:#fc6d261a}.hover\:bg-provider-google\/10:hover{background-color:#4285f41a}.hover\:bg-provider-instagram\/10:hover{background-color:#e4405f1a}.hover\:bg-provider-linkedin\/10:hover{background-color:#0a66c21a}.hover\:bg-provider-microsoft\/10:hover{background-color:#5e5e5e1a}.hover\:bg-provider-oidc\/10:hover{background-color:#f78c401a}.hover\:bg-provider-openshift\/10:hover{background-color:#ee00001a}.hover\:bg-provider-paypal\/10:hover{background-color:#00457c1a}.hover\:bg-provider-slack\/10:hover{background-color:#4a154b1a}.hover\:bg-provider-stackoverflow\/10:hover{background-color:#f580251a}.hover\:bg-provider-twitter\/10:hover{background-color:#1da1f21a}.hover\:bg-secondary-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.hover\:bg-secondary-200:hover{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.hover\:text-primary-500:hover{--tw-text-opacity: 1;color:rgb(152 22 223 / var(--tw-text-opacity))}.hover\:text-secondary-900:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.focus\:border-primary-300:focus{--tw-border-opacity: 1;border-color:rgb(152 22 223 / var(--tw-border-opacity))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-primary-200:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(152 22 223 / var(--tw-ring-opacity))}.focus\:ring-primary-600:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(152 22 223 / var(--tw-ring-opacity))}.focus\:ring-secondary-600:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(75 85 99 / var(--tw-ring-opacity))}.focus\:ring-opacity-50:focus{--tw-ring-opacity: .5}.focus\:ring-offset-2:focus{--tw-ring-offset-width: 2px}@media (min-width: 640px){.sm\:top-2{top:.5rem}.sm\:py-16{padding-top:4rem;padding-bottom:4rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}}
diff --git a/theme/keywind/login/resources/dist/index.js b/theme/keywind/login/resources/dist/index.js
index 15763777e..f5b1ce2be 100644
--- a/theme/keywind/login/resources/dist/index.js
+++ b/theme/keywind/login/resources/dist/index.js
@@ -1 +1 @@
-import{m as o}from"./assets/module.esm-9a996e1c.js";window.Alpine=o;o.start();
+import{m as o}from"./assets/module.esm-a81817bb.js";window.Alpine=o;o.start();
diff --git a/theme/keywind/login/resources/dist/recoveryCodes.js b/theme/keywind/login/resources/dist/recoveryCodes.js
index 902b5527b..a150b6b4e 100644
--- a/theme/keywind/login/resources/dist/recoveryCodes.js
+++ b/theme/keywind/login/resources/dist/recoveryCodes.js
@@ -1,4 +1,4 @@
-import{m as p}from"./assets/module.esm-9a996e1c.js";document.addEventListener("alpine:init",()=>{p.data("recoveryCodes",function(){const{codeList:o}=this.$refs,{downloadFileDate:n,downloadFileDescription:i,downloadFileHeader:d,downloadFileName:s}=this.$store.recoveryCodes,a=new Date().toLocaleString(navigator.language),r=o.getElementsByTagName("li"),l=Array.from(r).map(t=>t.innerText).join(`
+import{m as p}from"./assets/module.esm-a81817bb.js";document.addEventListener("alpine:init",()=>{p.data("recoveryCodes",function(){const{codeList:o}=this.$refs,{downloadFileDate:n,downloadFileDescription:i,downloadFileHeader:d,downloadFileName:s}=this.$store.recoveryCodes,a=new Date().toLocaleString(navigator.language),r=o.getElementsByTagName("li"),l=Array.from(r).map(t=>t.innerText).join(`
 `);return{copy:()=>navigator.clipboard.writeText(l),download:()=>{const t=document.createElement("a"),c=`${d}
 
 ${l}
diff --git a/theme/keywind/login/resources/dist/webAuthnAuthenticate.js b/theme/keywind/login/resources/dist/webAuthnAuthenticate.js
index b2aadc3b7..550218e34 100644
--- a/theme/keywind/login/resources/dist/webAuthnAuthenticate.js
+++ b/theme/keywind/login/resources/dist/webAuthnAuthenticate.js
@@ -1 +1 @@
-import{m as g}from"./assets/module.esm-9a996e1c.js";import{b as n}from"./assets/index-a7b84447.js";document.addEventListener("alpine:init",()=>{g.data("webAuthnAuthenticate",function(){const{authenticatorDataInput:l,authnSelectForm:r,clientDataJSONInput:p,credentialIdInput:f,errorInput:s,signatureInput:d,userHandleInput:h,webAuthnForm:a}=this.$refs,{challenge:m,createTimeout:o,isUserIdentified:A,rpId:w,unsupportedBrowserText:y,userVerification:u}=this.$store.webAuthnAuthenticate,c=i=>{if(!window.PublicKeyCredential){s.value=y,a.submit();return}const t={challenge:n.parse(m,{loose:!0}),rpId:w};i.length&&(t.allowCredentials=i),parseInt(o)!==0&&(t.timeout=parseInt(o)*1e3),u!=="not specified"&&(t.userVerification=u),navigator.credentials.get({publicKey:t}).then(e=>{e instanceof PublicKeyCredential&&e.response instanceof AuthenticatorAssertionResponse&&(window.result=e,l.value=n.stringify(new Uint8Array(e.response.authenticatorData),{pad:!1}),p.value=n.stringify(new Uint8Array(e.response.clientDataJSON),{pad:!1}),d.value=n.stringify(new Uint8Array(e.response.signature),{pad:!1}),f.value=e.id,e.response.userHandle&&(h.value=n.stringify(new Uint8Array(e.response.userHandle),{pad:!1})),a.submit())}).catch(e=>{s.value=e,a.submit()})},b=()=>{const i=[];if(r){const t=Array.from(r.elements);t.length&&t.forEach(e=>{e instanceof HTMLInputElement&&i.push({id:n.parse(e.value,{loose:!0}),type:"public-key"})})}c(i)};return{webAuthnAuthenticate:()=>{if(!A){c([]);return}b()}}})});
+import{m as g}from"./assets/module.esm-a81817bb.js";import{b as n}from"./assets/rfc4648-b81320ce.js";document.addEventListener("alpine:init",()=>{g.data("webAuthnAuthenticate",function(){const{authenticatorDataInput:l,authnSelectForm:r,clientDataJSONInput:p,credentialIdInput:f,errorInput:s,signatureInput:d,userHandleInput:h,webAuthnForm:a}=this.$refs,{challenge:m,createTimeout:o,isUserIdentified:A,rpId:w,unsupportedBrowserText:y,userVerification:u}=this.$store.webAuthnAuthenticate,c=i=>{if(!window.PublicKeyCredential){s.value=y,a.submit();return}const t={challenge:n.parse(m,{loose:!0}),rpId:w};i.length&&(t.allowCredentials=i),parseInt(o)!==0&&(t.timeout=parseInt(o)*1e3),u!=="not specified"&&(t.userVerification=u),navigator.credentials.get({publicKey:t}).then(e=>{e instanceof PublicKeyCredential&&e.response instanceof AuthenticatorAssertionResponse&&(window.result=e,l.value=n.stringify(new Uint8Array(e.response.authenticatorData),{pad:!1}),p.value=n.stringify(new Uint8Array(e.response.clientDataJSON),{pad:!1}),d.value=n.stringify(new Uint8Array(e.response.signature),{pad:!1}),f.value=e.id,e.response.userHandle&&(h.value=n.stringify(new Uint8Array(e.response.userHandle),{pad:!1})),a.submit())}).catch(e=>{s.value=e,a.submit()})},b=()=>{const i=[];if(r){const t=Array.from(r.elements);t.length&&t.forEach(e=>{e instanceof HTMLInputElement&&i.push({id:n.parse(e.value,{loose:!0}),type:"public-key"})})}c(i)};return{webAuthnAuthenticate:()=>{if(!A){c([]);return}b()}}})});
diff --git a/theme/keywind/login/resources/dist/webAuthnRegister.js b/theme/keywind/login/resources/dist/webAuthnRegister.js
index 83a80fbb0..8cd042b2b 100644
--- a/theme/keywind/login/resources/dist/webAuthnRegister.js
+++ b/theme/keywind/login/resources/dist/webAuthnRegister.js
@@ -1 +1 @@
-import{m as T}from"./assets/module.esm-9a996e1c.js";import{b as a}from"./assets/index-a7b84447.js";document.addEventListener("alpine:init",()=>{T.data("webAuthnRegister",function(){const{attestationObjectInput:m,authenticatorLabelInput:g,clientDataJSONInput:A,errorInput:I,publicKeyCredentialIdInput:w,registerForm:s,transportsInput:C}=this.$refs,{attestationConveyancePreference:u,authenticatorAttachment:c,challenge:K,createTimeout:l,excludeCredentialIds:v,requireResidentKey:p,rpEntityName:S,rpId:P,signatureAlgorithms:R,unsupportedBrowserText:x,userId:E,userVerificationRequirement:d,username:f}=this.$store.webAuthnRegister,L=t=>{const e=[];return t===""?(e.push({alg:-7,type:"public-key"}),e):(t.split(",").forEach(r=>{e.push({alg:parseInt(r),type:"public-key"})}),e)},q=t=>{const e=[];return t===""||t.split(",").forEach(r=>{e.push({id:a.parse(r,{loose:!0}),type:"public-key"})}),e},N=t=>{if(t===""||t.constructor!==Array)return"";let e="";return t.forEach(i=>{e+=i+","}),e.slice(0,-1)};return{registerSecurityKey:()=>{if(!window.PublicKeyCredential){I.value=x,s.submit();return}const t={challenge:a.parse(K,{loose:!0}),pubKeyCredParams:L(R),rp:{id:P,name:S},user:{displayName:f,id:a.parse(E,{loose:!0}),name:f}};u!=="not specified"&&(t.attestation=u);const e={};let i=!1;c!=="not specified"&&(e.authenticatorAttachment=c,i=!0),p!=="not specified"&&(p==="Yes"?e.requireResidentKey=!0:e.requireResidentKey=!1,i=!0),d!=="not specified"&&(e.userVerification=d,i=!0),i&&(t.authenticatorSelection=e);const r=q(v);r.length>0&&(t.excludeCredentials=r),parseInt(l)!==0&&(t.timeout=parseInt(l)*1e3),navigator.credentials.create({publicKey:t}).then(n=>{if(n instanceof PublicKeyCredential&&n.response instanceof AuthenticatorAttestationResponse){const{getTransports:h}=n.response;window.result=n;const O=n.rawId;if(m.value=a.stringify(new Uint8Array(n.response.attestationObject),{pad:!1}),A.value=a.stringify(new Uint8Array(n.response.clientDataJSON),{pad:!1}),w.value=a.stringify(new Uint8Array(O),{pad:!1}),typeof h=="function"){const b=h();b&&(C.value=N(b))}else console.log("Your browser is not able to recognize supported transport media for the authenticator.");const y="WebAuthn Authenticator (Default Label)";let o=window.prompt("Please input your registered authenticator's label",y);o===null&&(o=y),g.value=o,s.submit()}}).catch(function(n){n.value=n,s.submit()})}}})});
+import{m as T}from"./assets/module.esm-a81817bb.js";import{b as a}from"./assets/rfc4648-b81320ce.js";document.addEventListener("alpine:init",()=>{T.data("webAuthnRegister",function(){const{attestationObjectInput:m,authenticatorLabelInput:g,clientDataJSONInput:A,errorInput:I,publicKeyCredentialIdInput:w,registerForm:s,transportsInput:C}=this.$refs,{attestationConveyancePreference:u,authenticatorAttachment:c,challenge:K,createTimeout:l,excludeCredentialIds:v,requireResidentKey:p,rpEntityName:S,rpId:P,signatureAlgorithms:R,unsupportedBrowserText:x,userId:E,userVerificationRequirement:d,username:f}=this.$store.webAuthnRegister,L=t=>{const e=[];return t===""?(e.push({alg:-7,type:"public-key"}),e):(t.split(",").forEach(r=>{e.push({alg:parseInt(r),type:"public-key"})}),e)},q=t=>{const e=[];return t===""||t.split(",").forEach(r=>{e.push({id:a.parse(r,{loose:!0}),type:"public-key"})}),e},N=t=>{if(t===""||t.constructor!==Array)return"";let e="";return t.forEach(i=>{e+=i+","}),e.slice(0,-1)};return{registerSecurityKey:()=>{if(!window.PublicKeyCredential){I.value=x,s.submit();return}const t={challenge:a.parse(K,{loose:!0}),pubKeyCredParams:L(R),rp:{id:P,name:S},user:{displayName:f,id:a.parse(E,{loose:!0}),name:f}};u!=="not specified"&&(t.attestation=u);const e={};let i=!1;c!=="not specified"&&(e.authenticatorAttachment=c,i=!0),p!=="not specified"&&(p==="Yes"?e.requireResidentKey=!0:e.requireResidentKey=!1,i=!0),d!=="not specified"&&(e.userVerification=d,i=!0),i&&(t.authenticatorSelection=e);const r=q(v);r.length>0&&(t.excludeCredentials=r),parseInt(l)!==0&&(t.timeout=parseInt(l)*1e3),navigator.credentials.create({publicKey:t}).then(n=>{if(n instanceof PublicKeyCredential&&n.response instanceof AuthenticatorAttestationResponse){const{getTransports:h}=n.response;window.result=n;const O=n.rawId;if(m.value=a.stringify(new Uint8Array(n.response.attestationObject),{pad:!1}),A.value=a.stringify(new Uint8Array(n.response.clientDataJSON),{pad:!1}),w.value=a.stringify(new Uint8Array(O),{pad:!1}),typeof h=="function"){const b=h();b&&(C.value=N(b))}else console.log("Your browser is not able to recognize supported transport media for the authenticator.");const y="WebAuthn Authenticator (Default Label)";let o=window.prompt("Please input your registered authenticator's label",y);o===null&&(o=y),g.value=o,s.submit()}}).catch(function(n){n.value=n,s.submit()})}}})});
diff --git a/theme/keywind/login/template.ftl b/theme/keywind/login/template.ftl
index ddb00354c..e4da1e240 100644
--- a/theme/keywind/login/template.ftl
+++ b/theme/keywind/login/template.ftl
@@ -65,7 +65,7 @@
     </#if>
   </#assign>
 
-  <html<#if realm.internationalizationEnabled> lang="${locale.currentLanguageTag}"</#if>>
+  <html<#if realm.internationalizationEnabled> lang="${locale.currentLanguageTag}"</#if> class="dark">
     <head>
       <@document.kw script=script />
     </head>

From 9c804c93efe3b73c41253251a45e4325aaeaf8ab Mon Sep 17 00:00:00 2001
From: David Silva <ti@mkplace.com.br>
Date: Wed, 10 Apr 2024 04:53:44 -0300
Subject: [PATCH 2/3] feat(darkmode): add function to switch darkmode by user
 preference

---
 src/index.ts | 33 ++++++++++++++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/src/index.ts b/src/index.ts
index 213348173..6e87c376e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -2,6 +2,37 @@ import './index.css';
 
 import Alpine from 'alpinejs';
 
+function setColorScheme(scheme: string) {
+    const htmlElement = document.querySelector(':root') as HTMLHtmlElement
+    if (scheme == 'dark') {
+        htmlElement.classList.add('dark');
+    } else {
+        htmlElement.classList.remove('dark')
+    }
+}
+
+function getPreferredColorScheme() {
+    if (window.matchMedia) {
+        if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+            return 'dark';
+        } else {
+            return 'light';
+        }
+    }
+    return 'light';
+}
+
+function updateColorScheme() {
+    setColorScheme(getPreferredColorScheme());
+}
+
+if (window.matchMedia) {
+    var colorSchemeQuery = window.matchMedia('(prefers-color-scheme: dark)');
+    colorSchemeQuery.addEventListener('change', updateColorScheme);
+}
+
+updateColorScheme();
+
 window.Alpine = Alpine;
 
-Alpine.start();
+Alpine.start();
\ No newline at end of file

From 0ffba0c4ff9e256cd5383087d6a63be3a9d2f445 Mon Sep 17 00:00:00 2001
From: David Silva <ti@mkplace.com.br>
Date: Wed, 10 Apr 2024 04:58:07 -0300
Subject: [PATCH 3/3] (fix): remove dark class from html files

---
 html/login/error.html                            | 2 +-
 html/login/login-config-totp.html                | 2 +-
 html/login/login-idp-link-confirm.html           | 2 +-
 html/login/login-oauth-grant.html                | 2 +-
 html/login/login-otp.html                        | 2 +-
 html/login/login-page-expired.html               | 2 +-
 html/login/login-password.html                   | 2 +-
 html/login/login-recovery-authn-code-config.html | 2 +-
 html/login/login-recovery-authn-code-input.html  | 2 +-
 html/login/login-reset-password.html             | 2 +-
 html/login/login-update-password.html            | 2 +-
 html/login/login-update-profile.html             | 2 +-
 html/login/login-username.html                   | 2 +-
 html/login/login-x509-info.html                  | 2 +-
 html/login/login.html                            | 2 +-
 html/login/logout-confirm.html                   | 2 +-
 html/login/register.html                         | 2 +-
 html/login/select-authenticator.html             | 2 +-
 html/login/webauthn-authenticate.html            | 2 +-
 html/login/webauthn-error.html                   | 2 +-
 20 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/html/login/error.html b/html/login/error.html
index 3d5f67dcc..7a984f4b7 100644
--- a/html/login/error.html
+++ b/html/login/error.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-config-totp.html b/html/login/login-config-totp.html
index 8547f77d4..be19493fd 100644
--- a/html/login/login-config-totp.html
+++ b/html/login/login-config-totp.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-idp-link-confirm.html b/html/login/login-idp-link-confirm.html
index ecf1d4604..1ce340889 100644
--- a/html/login/login-idp-link-confirm.html
+++ b/html/login/login-idp-link-confirm.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-oauth-grant.html b/html/login/login-oauth-grant.html
index 51a38fe64..961ff35e2 100644
--- a/html/login/login-oauth-grant.html
+++ b/html/login/login-oauth-grant.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-otp.html b/html/login/login-otp.html
index dfdfa0696..b6c5184e7 100644
--- a/html/login/login-otp.html
+++ b/html/login/login-otp.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-page-expired.html b/html/login/login-page-expired.html
index c4d1ab61e..9da781716 100644
--- a/html/login/login-page-expired.html
+++ b/html/login/login-page-expired.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-password.html b/html/login/login-password.html
index 71aff975f..3da0153af 100644
--- a/html/login/login-password.html
+++ b/html/login/login-password.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-recovery-authn-code-config.html b/html/login/login-recovery-authn-code-config.html
index c20ab4f11..548dbbd03 100644
--- a/html/login/login-recovery-authn-code-config.html
+++ b/html/login/login-recovery-authn-code-config.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-recovery-authn-code-input.html b/html/login/login-recovery-authn-code-input.html
index bed8464e6..006d26fe8 100644
--- a/html/login/login-recovery-authn-code-input.html
+++ b/html/login/login-recovery-authn-code-input.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-reset-password.html b/html/login/login-reset-password.html
index 4a202fdbf..935828396 100644
--- a/html/login/login-reset-password.html
+++ b/html/login/login-reset-password.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-update-password.html b/html/login/login-update-password.html
index 033db7287..bd93af7e0 100644
--- a/html/login/login-update-password.html
+++ b/html/login/login-update-password.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-update-profile.html b/html/login/login-update-profile.html
index b6cd4c966..358012a4b 100644
--- a/html/login/login-update-profile.html
+++ b/html/login/login-update-profile.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-username.html b/html/login/login-username.html
index 04d2b33e2..358d1e097 100644
--- a/html/login/login-username.html
+++ b/html/login/login-username.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login-x509-info.html b/html/login/login-x509-info.html
index b59d60d8c..f1fe18b9b 100644
--- a/html/login/login-x509-info.html
+++ b/html/login/login-x509-info.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/login.html b/html/login/login.html
index 7d75fea1d..f3cccf7a7 100644
--- a/html/login/login.html
+++ b/html/login/login.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/logout-confirm.html b/html/login/logout-confirm.html
index fbe2b5a1b..99f4f054e 100644
--- a/html/login/logout-confirm.html
+++ b/html/login/logout-confirm.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/register.html b/html/login/register.html
index fbe0c2a65..febfd9a23 100644
--- a/html/login/register.html
+++ b/html/login/register.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/select-authenticator.html b/html/login/select-authenticator.html
index a339451fa..2f4a39561 100644
--- a/html/login/select-authenticator.html
+++ b/html/login/select-authenticator.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/webauthn-authenticate.html b/html/login/webauthn-authenticate.html
index 6882b15fa..7efcc2d46 100644
--- a/html/login/webauthn-authenticate.html
+++ b/html/login/webauthn-authenticate.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
diff --git a/html/login/webauthn-error.html b/html/login/webauthn-error.html
index d48ff5423..2be4c7ab2 100644
--- a/html/login/webauthn-error.html
+++ b/html/login/webauthn-error.html
@@ -1,4 +1,4 @@
-<html lang="en" class="dark">
+<html lang="en">
   <head>
     <title>Sign in to </title>
     <meta charset="utf-8">
