feat: Integrate Material UI theme provider and enhance UI components

src/index.jsx

@@ -1,11 +1,15 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
+import { ThemeProvider } from "@mui/material";
+import theme from "./theme";
 import "./index.css";
 import App from "./App";
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
   <React.StrictMode>
-    <App />
+    <ThemeProvider theme={theme} defaultMode="system">
+      <App />
+    </ThemeProvider>
   </React.StrictMode>
 );