change modal mui design and text

components/layout/header/index.js

@@ -14,7 +14,7 @@ function Header({ name }) {
   const [isActive, setIsActive] = useState(false);
 
   return (
-    <div className="bg-[#FFF] rounded-lg shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] w-full mx-auto">
+    <div className="bg-[#FFF] rounded-lg w-full mx-auto">
       <div
         className={`
                 px-[8px] sm:px-[16px] md:px-[24px] lg:px-[32px] py-[4px] sm:py-[8px] md:py-[12px] lg:py-[16px] flex transition-all duration-500 overflow-hidden justify-between items-center flex-nowrap

components/layout/index.js

@@ -37,7 +37,7 @@ function Layout({
                 }`}
       >
         <header className="w-full fixed bg-[#FFF] top-0 right-1/2 translate-x-1/2 z-[10]">
-          <div className="w-full padding-responsive">
+          <div className="w-full padding-responsive shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]">
             <Header name={name} />
           </div>
         </header>