design theme dark in general information page

components/panel/addDoctor/index.js

@@ -46,7 +46,7 @@ function AddDoctorPage() {
         <ArrowRightPH />
         <p className="text-[#525252] text-[14px] font-bold">{listTab[value]}</p>
       </Button>
-      <div className="rounded-[8px] mt-0 md:mt-[24px] bg-transparent md:bg-[#FFF] shadow-none md:shadow-[0px_1px_24.8px_0px_rgba(204,204,204,0.18)] pt-0 md:pt-[12px] pb-0 md:pb-[12px] lg:pb-[24px] px-0 md:px-[14px] lg:px-[26px] xl:px-[56px]">
+      <div className="rounded-[8px] mt-0 md:mt-[24px] bg-transparent md:bg-[#FFF] md:dark:bg-[#222433] shadow-none md:shadow-[0px_1px_24.8px_0px_rgba(204,204,204,0.18)] dark:shadow-none pt-0 md:pt-[12px] pb-0 md:pb-[12px] lg:pb-[24px] px-0 md:px-[14px] lg:px-[26px] xl:px-[56px]">
         <ListMenu
           open={open}
           value={value}

components/panel/addDoctor/listMenu/generalInformation/form/RadioGender.js

@@ -4,7 +4,7 @@ function RadioGender() {
   return (
     <RadioGroup
       dir="ltr"
-      className="!flex !flex-row !gap-[36px] !items-center !justify-start"
+      className="!flex radio-mui !flex-row !gap-[36px] !items-center !justify-start"
       defaultValue="female"
       sx={{
         "& .muirtl-j204z7-MuiFormControlLabel-root": {
@@ -12,8 +12,18 @@ function RadioGender() {
         },
       }}
     >
-      <FormControlLabel value="male" control={<Radio />} label="مرد" />
-      <FormControlLabel value="female" control={<Radio />} label="زن" />
+      <FormControlLabel
+        label="مرد"
+        value="male"
+        control={<Radio />}
+        className="!text-[#A1A1A1]"
+      />
+      <FormControlLabel
+        label="زن"
+        value="female"
+        control={<Radio />}
+        className="!text-[#A1A1A1]"
+      />
     </RadioGroup>
   );
 }