diff --git a/.env.development b/.env.development
index 9f22047..d8943b8 100644
--- a/.env.development
+++ b/.env.development
@@ -1 +1,3 @@
-NEXT_PUBLIC_NODE_ENV=development
\ No newline at end of file
+NEXT_PUBLIC_NODE_ENV=development
+NEXT_PUBLIC_ENCRYPTION_KEY=your-secure-encryption-key
+
diff --git a/.env.production b/.env.production
index 146afc7..0c493c7 100644
--- a/.env.production
+++ b/.env.production
@@ -1 +1,2 @@
-NEXT_PUBLIC_NODE_ENV=production
\ No newline at end of file
+NEXT_PUBLIC_NODE_ENV=production
+NEXT_PUBLIC_ENCRYPTION_KEY=your-secure-encryption-key
diff --git a/components/Header.jsx b/components/Header.jsx
index 46f5b16..83d1432 100644
--- a/components/Header.jsx
+++ b/components/Header.jsx
@@ -5,6 +5,7 @@ import { useRouter } from "next/router";
 import "bootstrap-icons/font/bootstrap-icons.css";
 import SettingsModal from "./modales/settingsModal/SettingsModal";
 import { useSelector } from "react-redux";
+import decodeToken from "../utils/decodeToken";
 
 function Header() {
   const isAdminLoggedIn = useSelector((state) => state.auth.isAdminLoggedIn);
@@ -25,12 +26,11 @@ function Header() {
   useEffect(() => {
     const token = localStorage.getItem("token");
     if (token) {
-      const { exp } = JSON.parse(atob(token));
-      if (Date.now() < exp) {
-        //setIsAdminLoggedIn(true);
+      const { exp } = decodeToken(token);
+      if (exp && Date.now() < exp) {
+        // Token ist gültig
       } else {
         localStorage.removeItem("token"); // Entferne abgelaufenen Token
-        //setIsAdminLoggedIn(false);
       }
     }
   }, []);
diff --git a/components/modales/kueModal/KueModal.jsx b/components/modales/kueModal/KueModal.jsx
index ffa0051..2b6b23f 100644
--- a/components/modales/kueModal/KueModal.jsx
+++ b/components/modales/kueModal/KueModal.jsx
@@ -8,18 +8,10 @@ import handleSave from "./handlers/handleSave";
 import handleDisplayEinschalten from "./handlers/handleDisplayEinschalten";
 import handleChange from "./handlers/handleChange";
 import firmwareUpdate from "./handlers/firmwareUpdate";
-
-function decodeToken(token) {
-  try {
-    const payload = JSON.parse(atob(token)); // Direkt das Token decodieren
-    return payload;
-  } catch (error) {
-    console.error("Fehler beim Dekodieren des Tokens:", error);
-    return null;
-  }
-}
+import decodeToken from "../../../utils/decodeToken";
 
 function KueModal({ showModal, onClose, slot, onModulNameChange }) {
+  const isAdminLoggedIn = useSelector((state) => state.auth.isAdminLoggedIn);
   const [isAdmin, setIsAdmin] = useState(false);
   const dispatch = useDispatch();
   const [ids, setIds] = useState(Array(32).fill(""));
@@ -100,11 +92,14 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) {
     const token = localStorage.getItem("token");
     if (token) {
       const decoded = decodeToken(token);
-      if (decoded && decoded.role === "Admin") {
+      if (decoded && decoded.role.toLowerCase() === "admin") {
         setIsAdmin(true);
+      } else {
+        setIsAdmin(false);
       }
     }
   }, [showModal]);
+
   //------------------------------------------------------------------------------------------------------------
   return (
     <ReactModal
@@ -242,7 +237,7 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) {
 
       <div className="flex justify-end bg-gray-100 p-4 rounded-b-lg">
         {/* Bedingte Anzeige der Firmware-Update-Schaltfläche */}
-        {isAdmin && (
+        {isAdminLoggedIn && (
           <button
             onClick={() => firmwareUpdate(slot)}
             className="bg-littwin-blue text-white p-2 rounded flex items-center mr-2"
diff --git a/components/modales/settingsModal/SettingsModal.jsx b/components/modales/settingsModal/SettingsModal.jsx
index a8a3953..197f0ce 100644
--- a/components/modales/settingsModal/SettingsModal.jsx
+++ b/components/modales/settingsModal/SettingsModal.jsx
@@ -1,34 +1,46 @@
-"use client";
+"use client"; //components/modales/settingsModal/SettingsModal.jsx
 import React, { useState, useEffect } from "react";
 import ReactModal from "react-modal";
 import { ClipLoader } from "react-spinners";
 import "bootstrap-icons/font/bootstrap-icons.css";
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
 import handleClearDatabase from "./handlers/handleClearDatabase";
 import handleReboot from "./handlers/handleReboot";
 import handleSetDateTime from "./handlers/handleSetDateTime";
 import handleSubmit from "./handlers/handleSubmit";
 import { useRouter } from "next/router";
 import { setAdminLoggedIn } from "../../../store/authSlice";
-import { useDispatch } from "react-redux";
+import CryptoJS from "crypto-js";
+import bcrypt from "bcryptjs";
 
 ReactModal.setAppElement("#__next");
 
-const USERS = {
-  Admin: { username: "admin", password: "admin", role: "Admin" },
-  Ismail: { username: "ismail", password: "ismail", role: "Admin" },
-};
 // Function to generate JWT token
 function generateToken(user) {
   const payload = {
     username: user.username,
     role: user.role,
-    exp: Date.now() + 5 * 60 * 1000, // Expire in 5 minutes
+    exp: Date.now() + 5 * 60 * 1000, // Ablaufzeit: 5 Minuten
   };
-  return btoa(JSON.stringify(payload));
+  const token = JSON.stringify(payload);
+  const encryptedToken = CryptoJS.AES.encrypt(
+    token,
+    process.env.NEXT_PUBLIC_ENCRYPTION_KEY
+  ).toString();
+  return encryptedToken;
+}
+function decryptToken(encryptedToken) {
+  const bytes = CryptoJS.AES.decrypt(
+    encryptedToken,
+    process.env.NEXT_PUBLIC_ENCRYPTION_KEY
+  );
+  const decryptedToken = bytes.toString(CryptoJS.enc.Utf8);
+  return JSON.parse(decryptedToken);
 }
 
 function SettingModal({ showModal, onClose }) {
+  const isAdminLoggedIn = useSelector((state) => state.auth.isAdminLoggedIn);
+  const USERS = useSelector((state) => state.auth.users);
   const dispatch = useDispatch();
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
@@ -37,18 +49,22 @@ function SettingModal({ showModal, onClose }) {
   const [showLoginForm, setShowLoginForm] = useState(false); // Zustand für Login-Formular
   const router = useRouter();
 
-  const handleAdminLogin = (e) => {
+  const handleAdminLogin = async (e) => {
     e.preventDefault();
+    const userInput = username.toLowerCase(); // Benutzername in Kleinbuchstaben
     const user = Object.values(USERS).find(
-      (u) => u.username === username && u.password === password
+      (u) => u.username.toLowerCase() === userInput
     );
 
-    if (user) {
-      const token = generateToken(user);
+    if (user && (await bcrypt.compare(password, user.password))) {
+      // Token generieren
+      const token = generateToken({ username: user.username, role: "admin" });
+
+      // Token in localStorage speichern
       localStorage.setItem("token", token);
+
       dispatch(setAdminLoggedIn(true));
-      setIsLoggedIn(true);
-      setShowLoginForm(false);
+      setError("");
       onClose();
     } else {
       setError(
@@ -56,6 +72,7 @@ function SettingModal({ showModal, onClose }) {
       );
     }
   };
+
   const deviceName_Redux = useSelector((state) => state.variables.deviceName);
   const mac1_Redux = useSelector((state) => state.variables.mac1);
   const ip_Redux = useSelector((state) => state.variables.ip);
@@ -94,6 +111,10 @@ function SettingModal({ showModal, onClose }) {
     ntpTimezone,
     active,
   };
+  const handleAdminLogout = () => {
+    localStorage.removeItem("token"); // Remove token on logout
+    dispatch(setAdminLoggedIn(false)); // Update Redux state
+  };
 
   useEffect(() => {
     if (showModal) {
@@ -135,14 +156,18 @@ function SettingModal({ showModal, onClose }) {
     active_Redux,
   ]);
   useEffect(() => {
-    // Check if a valid token exists in localStorage
     const token = localStorage.getItem("token");
     if (token) {
-      const { exp } = JSON.parse(atob(token));
-      if (Date.now() < exp) {
-        setIsLoggedIn(true);
-      } else {
-        localStorage.removeItem("token"); // Remove expired token
+      try {
+        const decrypted = decryptToken(token);
+        if (Date.now() < decrypted.exp) {
+          setIsLoggedIn(true);
+        } else {
+          localStorage.removeItem("token"); // Entfernen, wenn abgelaufen
+        }
+      } catch (error) {
+        console.error("Fehler beim Token-Entschlüsseln:", error);
+        localStorage.removeItem("token"); // Entfernen bei Fehler
       }
     }
   }, []);
@@ -378,10 +403,14 @@ function SettingModal({ showModal, onClose }) {
                   Neustart CPL
                 </button>
                 <button
-                  onClick={() => setShowLoginForm(true)}
+                  onClick={() => {
+                    isAdminLoggedIn
+                      ? handleAdminLogout()
+                      : setShowLoginForm(true);
+                  }}
                   className="bg-littwin-blue text-white px-4 py-2 rounded"
                 >
-                  Admin anmelden
+                  {isAdminLoggedIn ? "Admin abmelden" : "Admin anmelden"}
                 </button>
                 <button
                   className="bg-littwin-blue text-white px-4 py-2 rounded"
diff --git a/package-lock.json b/package-lock.json
index 29a4c7c..50be95d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,9 +14,11 @@
         "@iconify/react": "^5.0.2",
         "@reduxjs/toolkit": "^2.3.0",
         "autoprefixer": "^10.4.20",
+        "bcryptjs": "^2.4.3",
         "bootstrap-icons": "^1.11.3",
         "chart.js": "^4.4.5",
         "chartjs-plugin-zoom": "^2.0.1",
+        "crypto-js": "^4.2.0",
         "idb": "^8.0.0",
         "jsonwebtoken": "^9.0.2",
         "jwt-decode": "^4.0.0",
@@ -477,6 +479,11 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true
     },
+    "node_modules/bcryptjs": {
+      "version": "2.4.3",
+      "resolved": "https://registry.npmjs.org/bcryptjs/-/bcryptjs-2.4.3.tgz",
+      "integrity": "sha512-V/Hy/X9Vt7f3BbPJEi8BdVFMByHi+jNXrYkW3huaybV/kQ0KJg0Y6PkEMbn+zeT+i+SiKZ/HMqJGIIt4LZDqNQ=="
+    },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
@@ -712,6 +719,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    },
     "node_modules/cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
diff --git a/package.json b/package.json
index bbcb33a..90188e2 100644
--- a/package.json
+++ b/package.json
@@ -17,9 +17,11 @@
     "@iconify/react": "^5.0.2",
     "@reduxjs/toolkit": "^2.3.0",
     "autoprefixer": "^10.4.20",
+    "bcryptjs": "^2.4.3",
     "bootstrap-icons": "^1.11.3",
     "chart.js": "^4.4.5",
     "chartjs-plugin-zoom": "^2.0.1",
+    "crypto-js": "^4.2.0",
     "idb": "^8.0.0",
     "jsonwebtoken": "^9.0.2",
     "jwt-decode": "^4.0.0",
diff --git a/pages/generate-hash.js b/pages/generate-hash.js
new file mode 100644
index 0000000..03794ed
--- /dev/null
+++ b/pages/generate-hash.js
@@ -0,0 +1,23 @@
+// pages/generate-hash.js
+import bcrypt from "bcryptjs";
+
+export default function GenerateHash() {
+  const password = "admin"; // Das Passwort, das du hashen möchtest
+  const saltRounds = 10; // Die Anzahl der Salt-Runden
+
+  // Hash generieren
+  const hash = bcrypt.hashSync(password, saltRounds);
+
+  return (
+    <div style={{ padding: "20px", fontFamily: "Arial" }}>
+      <h1>Hash-Generator</h1>
+      <p>
+        <strong>Passwort:</strong> {password}
+      </p>
+      <p>
+        <strong>Generierter Hash:</strong> {hash}
+      </p>
+      <p>Kopiere den Hash und speichere ihn in deinem Projekt.</p>
+    </div>
+  );
+}
diff --git a/store/authSlice.js b/store/authSlice.js
index fc9b21f..7dfc2fe 100644
--- a/store/authSlice.js
+++ b/store/authSlice.js
@@ -5,6 +5,17 @@ const authSlice = createSlice({
   name: "auth",
   initialState: {
     isAdminLoggedIn: false,
+    users: {
+      Admin: {
+        username: "admin",
+        password:
+          "$2a$10$xpq/.tcOJN/LXfzdCcCVrenlBh2nRlM1R1ISY7dd1q2qGWC9Fyd2G", // Gehashte Version von "admin"
+      },
+      Ismail: {
+        username: "ismail",
+        password: "$2b$10$<hier-hash-von-ismail>", // Gehashte Version von "ismail"
+      },
+    },
   },
   reducers: {
     setAdminLoggedIn: (state, action) => {
diff --git a/utils/decodeToken.js b/utils/decodeToken.js
new file mode 100644
index 0000000..89d2756
--- /dev/null
+++ b/utils/decodeToken.js
@@ -0,0 +1,12 @@
+function decodeToken(token) {
+  try {
+    const base64Payload = token.split(".")[1];
+    const payload = JSON.parse(atob(base64Payload));
+    return payload;
+  } catch (error) {
+    console.error("Fehler beim Dekodieren des Tokens:", error);
+    return null;
+  }
+}
+
+export default decodeToken;