change function and design page doctors & signin & signup & home & specialties & helper

app/component/element/AutoCompleteSelect.js

@@ -7,7 +7,6 @@ function AutoCompleteSelect({
   value,
   isError,
   updateData,
-  name,
   label,
   disabled = false,
   listboxProps,
@@ -20,14 +19,17 @@ function AutoCompleteSelect({
       disabled={disabled}
       ListboxProps={listboxProps}
       value={value || null}
+      getOptionLabel={(option) => {
+        if (typeof option === "string") return option;
+        return option?.name || option?.label || "";
+      }}
       className="!w-full !rounded-lg auto-complete-selector"
       onChange={(e, newValue) => {
         updateData &&
           updateData(
             newValue && sendAll
               ? newValue
-              : (newValue && !sendAll && newValue.label) || "",
-            name,
+              : (newValue && !sendAll && newValue.label) || ""
           );
       }}
       sx={{
@@ -73,7 +75,7 @@ function AutoCompleteSelect({
           key={option.id || props.id}
           className="!flex !justify-start !p-[8px] !text-start !text-[#A1A1A1] hover:dark:!bg-[#35343D] !bg-[#FFF] dark:!bg-[#1F1D2B]"
         >
-          {option.label}
+          {option.name || option.label}
         </Button>
       )}
       renderInput={(params) => (

app/globals.css

@@ -295,7 +295,7 @@ html {
   }
 
   .MuiModal-root div:nth-child(3) {
-    border-radius: 0 !important;
+    /* border-radius: 0 !important; */
   }
 }
 
@@ -850,3 +850,11 @@ html {
 .text-item-head-white:hover .item-head {
   color: #d7d8ed;
 }
+
+.bg-poster {
+  background-image: url(/public/assets/images/poster.png);
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-size: cover;
+}