diff --git a/Client/src/Pages/Maintenance/CreateMaintenance/index.jsx b/Client/src/Pages/Maintenance/CreateMaintenance/index.jsx
index 724643f59..1787375c2 100644
--- a/Client/src/Pages/Maintenance/CreateMaintenance/index.jsx
+++ b/Client/src/Pages/Maintenance/CreateMaintenance/index.jsx
@@ -1,11 +1,15 @@
 import { Box, Button, Stack, Typography } from "@mui/material";
 import { useTheme } from "@emotion/react";
 import { useState } from "react";
+import { ConfigBox } from "./styled";
+import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
+import { LocalizationProvider } from "@mui/x-date-pickers";
+import { DatePicker } from "@mui/x-date-pickers/DatePicker";
 import Select from "../../../Components/Inputs/Select";
 import Field from "../../../Components/Inputs/Field";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
+import CalendarIcon from "../../../assets/icons/calendar.svg?react";
 import "./index.css";
-import { ConfigBox } from "./styled";
 
 const repeatConfig = [
   { _id: 0, name: "Don't repeat" },
@@ -69,8 +73,7 @@ const CreateMaintenance = () => {
             General Settings
           </Typography>
           <Box
-            pl={theme.spacing(18)}
-            pr={theme.spacing(8)}
+            px={theme.spacing(14)}
             borderLeft={1}
             borderLeftColor={theme.palette.border.light}
           >
@@ -80,9 +83,54 @@ const CreateMaintenance = () => {
               value={0}
               items={repeatConfig}
             />
-            <Box mt={theme.spacing(16)}>
-              <Typography component="h3">Days</Typography>
-            </Box>
+            <Stack gap={theme.spacing(2)} mt={theme.spacing(16)}>
+              <Typography component="h3">Date</Typography>
+              <LocalizationProvider dateAdapter={AdapterDayjs}>
+                <DatePicker
+                  disablePast
+                  disableHighlightToday
+                  slots={{ openPickerIcon: CalendarIcon }}
+                  slotProps={{
+                    switchViewButton: { sx: { display: "none" } },
+                    nextIconButton: { sx: { ml: theme.spacing(2) } },
+                    field: {
+                      sx: {
+                        width: "fit-content",
+                        "& > .MuiOutlinedInput-root": {
+                          flexDirection: "row-reverse",
+                        },
+                        "& input": {
+                          height: 34,
+                          p: 0,
+                          pr: theme.spacing(5),
+                        },
+                        "& fieldset": {
+                          borderColor: theme.palette.border.dark,
+                          borderRadius: theme.shape.borderRadius,
+                        },
+                        "&:not(:has(.Mui-disabled)):not(:has(.Mui-error)) .MuiOutlinedInput-root:not(:has(input:focus)):hover fieldset":
+                          {
+                            borderColor: theme.palette.border.dark,
+                          },
+                      },
+                    },
+                    inputAdornment: { sx: { ml: 0, px: 3 } },
+                    openPickerButton: {
+                      sx: {
+                        py: 0,
+                        mr: 0,
+                        "& path": {
+                          stroke: theme.palette.other.icon,
+                          strokeWidth: 1.1,
+                        },
+                        "&:hover": { backgroundColor: "transparent" },
+                      },
+                    },
+                  }}
+                  sx={{}}
+                />
+              </LocalizationProvider>
+            </Stack>
           </Box>
         </ConfigBox>
         <ConfigBox>
@@ -156,7 +204,7 @@ const CreateMaintenance = () => {
             onClick={() => console.log("disabled")}
             disabled={false}
           >
-            Create window
+            Create maintenance
           </Button>
         </Box>
       </Stack>
diff --git a/Client/src/Pages/Maintenance/CreateMaintenance/styled.jsx b/Client/src/Pages/Maintenance/CreateMaintenance/styled.jsx
index 76897815d..7718d2bcc 100644
--- a/Client/src/Pages/Maintenance/CreateMaintenance/styled.jsx
+++ b/Client/src/Pages/Maintenance/CreateMaintenance/styled.jsx
@@ -13,8 +13,13 @@ export const ConfigBox = styled(Stack)(({ theme }) => ({
   "& > div:last-of-type, & > .MuiStack-root > div:last-of-type": {
     flex: 1,
   },
+  "& > .MuiStack-root > div:first-of-type": { paddingRight: theme.spacing(14) },
+  "& > .MuiStack-root > div:last-of-type": {
+    paddingLeft: theme.spacing(14),
+  },
   "& h2": { fontSize: 13.5, fontWeight: 500 },
   "& h3, & p": {
     color: theme.palette.text.tertiary,
   },
+  "& h3": { fontWeight: 500 },
 }));
diff --git a/Client/src/assets/icons/calendar.svg b/Client/src/assets/icons/calendar.svg
new file mode 100644
index 000000000..be023a4de
--- /dev/null
+++ b/Client/src/assets/icons/calendar.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="20" viewBox="0 0 18 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.5 8.33342H1.5M12.3333 1.66675V5.00008M5.66667 1.66675V5.00008M5.5 18.3334H12.5C13.9001 18.3334 14.6002 18.3334 15.135 18.0609C15.6054 17.8212 15.9878 17.4388 16.2275 16.9684C16.5 16.4336 16.5 15.7335 16.5 14.3334V7.33342C16.5 5.93328 16.5 5.23322 16.2275 4.69844C15.9878 4.22803 15.6054 3.84558 15.135 3.6059C14.6002 3.33341 13.9001 3.33341 12.5 3.33341H5.5C4.09987 3.33341 3.3998 3.33341 2.86502 3.6059C2.39462 3.84558 2.01217 4.22803 1.77248 4.69844C1.5 5.23322 1.5 5.93328 1.5 7.33341V14.3334C1.5 15.7335 1.5 16.4336 1.77248 16.9684C2.01217 17.4388 2.39462 17.8212 2.86502 18.0609C3.3998 18.3334 4.09987 18.3334 5.5 18.3334Z" stroke="#344054" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>