design dark mode turns & add-doctor & account & layout and components MUI

components/layoutPanel/header/MenuProfile.js

@@ -38,8 +38,8 @@ function MenuProfile({ data }) {
           width={48}
         />
         <div className="flex flex-col items-start justify-between gap-[3px]">
-          <p className="text-[#3B3B3B] dark:text-[#FAFAFA] text-[14px] font-semibold dark:text-[]">
-            {data.name}
+          <p className="text-[#3B3B3B] dark:text-[#D7D8ED] text-[14px] font-semibold">
+            دکتر {data.name}
           </p>
           <p className="text-[#7E7E7E] dark:text-[#A1A1A1] text-[12px] font-normal">
             {data.expertise}

components/layoutPanel/header/icons/Theme.js

@@ -1,4 +1,5 @@
 import MoonP from "@/components/icons/MoonP";
+import Sun from "@/components/icons/Sun";
 import { Button } from "@mui/material";
 import { useTheme } from "next-themes";
 import { useState } from "react";
@@ -22,7 +23,7 @@ function Theme() {
       onClick={() => setTheme(theme === "light" ? "dark" : "light")}
       variant="outlined"
     >
-      <MoonP />
+      {theme === "light" ? <MoonP /> : <Sun />}
     </Button>
   );
 }