feat: improve usability and ui minor changes

src/components/AppHeader.jsx

@@ -8,8 +8,8 @@ export default function AppHeader({ zone = 'public' }) {
 
   const bgColor = {
     public: '#40120EFF',
-    restricted: '#e0e0ff',
-    private: '#d0f0e0',
+    restricted: '#40120EFF',
+    private: '#40120EFF',
   };
 
   const [menuOpen, setMenuOpen] = useState(false);
@@ -22,7 +22,7 @@ export default function AppHeader({ zone = 'public' }) {
     <AppBar position="static"
       sx={{
         textAlign: 'center',
-        bgcolor: bgColor[zone],
+        backgroundColor: bgColor[zone],
         mt: 'auto',
         fontSize: { xs: '0.75rem', md: '1rem' },
       }} >
@@ -44,7 +44,6 @@ export default function AppHeader({ zone = 'public' }) {
                 pr: 2,
                 py: 0.5,
                 borderRadius: 1,
-                bgcolor: '#000000a0',
                 color: '#A68A72FF',
                 width: { md: '300px', lg: '400px' }
               }}