From e26e45395f27cd3481adcf1227361ed3d470554e Mon Sep 17 00:00:00 2001
From: Alex Cheung <alex.cheung@2fi-solutions.com.hk>
Date: Mon, 17 Nov 2025 02:45:33 +0800
Subject: [PATCH] update combo layout

---
 src/pages/DemandNote/Create/SearchForm.js     |  5 +++++
 src/pages/DemandNote/Export/SearchForm.js     |  5 +++++
 src/pages/DemandNote/Search/SearchForm.js     | 15 +++++++++++++
 .../DemandNote/Search_Public/SearchForm.js    | 10 +++++++++
 src/pages/GazetteIssue/ExportForm.js          |  6 ++---
 src/pages/GazetteIssue/SearchForm.js          |  6 ++---
 src/pages/Holiday/SearchForm.js               |  6 ++---
 .../SearchPage/OrganizationSearchForm.js      |  5 +++++
 src/pages/Payment/Search_GLD/SearchForm.js    |  5 +++++
 src/pages/Payment/Search_Public/SearchForm.js |  5 +++++
 src/pages/Proof/Create_FromApp/ProofForm.js   |  6 ++++-
 src/pages/Proof/Search_GLD/SearchForm.js      | 20 +++++++++++++++++
 src/pages/Proof/Search_Public/SearchForm.js   | 10 +++++++++
 .../Details_GLD/StatusChangeDialog.js         |  6 ++++-
 .../ListPanel/PendingPaymentTab.js            |  5 +++++
 .../ListPanel/SearchPublicNoticeForm.js       |  5 +++++
 .../PublicNotice/Search_GLD/SearchForm.js     | 20 +++++++++++++++++
 .../Search_Mark_As_Paid_GLD/SearchForm.js     | 15 +++++++++++++
 src/pages/Recon/SearchForm.js                 | 10 +++++++++
 .../UserSearchForm_Individual.js              |  5 +++++
 .../UserSearchForm_Organization.js            | 22 ++++++++++++++-----
 .../auth-forms/BusCustomFormWizard.js         | 15 ++++++++-----
 .../auth-forms/CustomFormWizard.js            | 19 +++++++++++-----
 .../auth-forms/IAmSmartFormWizard.js          | 17 +++++++++-----
 .../pnspsUserGroupDetailPage/UserAddCard.js   |  5 +++++
 src/utils/Combo.js                            | 10 +++------
 src/utils/SelectBase.js                       | 10 +++------
 27 files changed, 221 insertions(+), 47 deletions(-)

diff --git a/src/pages/DemandNote/Create/SearchForm.js b/src/pages/DemandNote/Create/SearchForm.js
index 014eee0..bd41083 100644
--- a/src/pages/DemandNote/Create/SearchForm.js
+++ b/src/pages/DemandNote/Create/SearchForm.js
@@ -173,6 +173,11 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData, _paymentCount, _p
                                     setIssueSelected(newValue);
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label="Gazette Issue"
diff --git a/src/pages/DemandNote/Export/SearchForm.js b/src/pages/DemandNote/Export/SearchForm.js
index c0a374d..7596bb7 100644
--- a/src/pages/DemandNote/Export/SearchForm.js
+++ b/src/pages/DemandNote/Export/SearchForm.js
@@ -174,6 +174,11 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData }) => {
                                     setIssueSelected(newValue);
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label="Gazette Issue"
diff --git a/src/pages/DemandNote/Search/SearchForm.js b/src/pages/DemandNote/Search/SearchForm.js
index bce5359..7bc3549 100644
--- a/src/pages/DemandNote/Search/SearchForm.js
+++ b/src/pages/DemandNote/Search/SearchForm.js
@@ -211,6 +211,11 @@ const SearchDemandNoteForm = ({ applySearch, orgComboData, searchCriteria, issue
                                 onChange={(event, newValue) => {
                                     setIssueSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Issue No."
@@ -256,6 +261,11 @@ const SearchDemandNoteForm = ({ applySearch, orgComboData, searchCriteria, issue
                                                 setOrgSelected({});
                                             }
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 label="Organisation"
@@ -421,6 +431,11 @@ const SearchDemandNoteForm = ({ applySearch, orgComboData, searchCriteria, issue
                                     }
                                 }}
                                 getOptionLabel={(option) => option.label}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField
                                         {...params}
diff --git a/src/pages/DemandNote/Search_Public/SearchForm.js b/src/pages/DemandNote/Search_Public/SearchForm.js
index fda3e5b..bbed57c 100644
--- a/src/pages/DemandNote/Search_Public/SearchForm.js
+++ b/src/pages/DemandNote/Search_Public/SearchForm.js
@@ -167,6 +167,11 @@ const SearchDemandNoteForm = ({ applySearch, searchCriteria, issueComboData, onG
                                         setIssueSelected(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label={intl.formatMessage({ id: 'gazetteCount' })}
@@ -274,6 +279,11 @@ const SearchDemandNoteForm = ({ applySearch, searchCriteria, issueComboData, onG
                                         setSelectedStatus(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField
                                         {...params}
diff --git a/src/pages/GazetteIssue/ExportForm.js b/src/pages/GazetteIssue/ExportForm.js
index 8eac79a..ae5b9b7 100644
--- a/src/pages/GazetteIssue/ExportForm.js
+++ b/src/pages/GazetteIssue/ExportForm.js
@@ -81,9 +81,9 @@ const SearchGazetteIssueForm = ({ applyExport, comboData, waitDownload}) => {
                                 setSelectedYear(newValue);
                             }}
                             sx={{
-                                "& .MuiInputBase-root": { height: "41px" },
-                                "#year-combo": { padding: "0px 0px 0px 0px" },
-                                "& .MuiAutocomplete-endAdornment": { top: "auto" },
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
                             }}
                             renderInput={(params) => <TextField {...params} placeholder={""}/>}
                         />
diff --git a/src/pages/GazetteIssue/SearchForm.js b/src/pages/GazetteIssue/SearchForm.js
index 7d53fee..37ad3d4 100644
--- a/src/pages/GazetteIssue/SearchForm.js
+++ b/src/pages/GazetteIssue/SearchForm.js
@@ -79,9 +79,9 @@ const SearchGazetteIssueForm = ({ applySearch, comboData, onGridReady}) => {
                                 setSelectedYear(newValue);
                             }}
                             sx={{
-                                "& .MuiInputBase-root": { height: "41px" },
-                                "#year-combo": { padding: "0px 0px 0px 0px" },
-                                "& .MuiAutocomplete-endAdornment": { top: "auto" },
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
                             }}
                             renderInput={(params) => <TextField {...params} placeholder={""}/>}
                         />
diff --git a/src/pages/Holiday/SearchForm.js b/src/pages/Holiday/SearchForm.js
index 372d65d..3a49ec1 100644
--- a/src/pages/Holiday/SearchForm.js
+++ b/src/pages/Holiday/SearchForm.js
@@ -79,9 +79,9 @@ const SearchHolidayForm = ({ applySearch, comboData, onGridReady}) => {
                                 setSelectedYear(newValue);
                             }}
                             sx={{
-                                "& .MuiInputBase-root": { height: "41px" },
-                                "#year-combo": { padding: "0px 0px 0px 0px" },
-                                "& .MuiAutocomplete-endAdornment": { top: "auto" },
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
                             }}
                             renderInput={(params) => <TextField {...params} placeholder={""}/>}
                         />
diff --git a/src/pages/Organization/SearchPage/OrganizationSearchForm.js b/src/pages/Organization/SearchPage/OrganizationSearchForm.js
index 5e3f609..b8d1134 100644
--- a/src/pages/Organization/SearchPage/OrganizationSearchForm.js
+++ b/src/pages/Organization/SearchPage/OrganizationSearchForm.js
@@ -150,6 +150,11 @@ const OrganizationSearchForm = ({ applySearch, onGridReady, searchCriteria }) =>
                                         
                                     }}
                                     getOptionLabel={(option) => option.label}
+                                    sx={{
+                                        '& .MuiInputBase-root': { alignItems: 'center' },
+                                        '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                        '& .MuiOutlinedInput-root': { height: 40 }
+                                    }}
                                     renderInput={(params) => (
                                         <TextField
                                             {...params}
diff --git a/src/pages/Payment/Search_GLD/SearchForm.js b/src/pages/Payment/Search_GLD/SearchForm.js
index 10184f3..ebd3316 100644
--- a/src/pages/Payment/Search_GLD/SearchForm.js
+++ b/src/pages/Payment/Search_GLD/SearchForm.js
@@ -202,6 +202,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) =>
                                         setStatus(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Status"
diff --git a/src/pages/Payment/Search_Public/SearchForm.js b/src/pages/Payment/Search_Public/SearchForm.js
index 17324ca..b5cd0f9 100644
--- a/src/pages/Payment/Search_Public/SearchForm.js
+++ b/src/pages/Payment/Search_Public/SearchForm.js
@@ -200,6 +200,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) =>
                                     setStatus(ComboData.paymentStatus[0]);
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label={intl.formatMessage({id: 'status'})}
diff --git a/src/pages/Proof/Create_FromApp/ProofForm.js b/src/pages/Proof/Create_FromApp/ProofForm.js
index 0624763..e90b1ba 100644
--- a/src/pages/Proof/Create_FromApp/ProofForm.js
+++ b/src/pages/Proof/Create_FromApp/ProofForm.js
@@ -397,7 +397,10 @@ const FormPanel = ({ formData }) => {
 
                                     <Autocomplete
                                         sx={{
-                                            width: "15%"
+                                            width: "15%",
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
                                         }}
                                         disablePortal
                                         id="price"
@@ -409,6 +412,7 @@ const FormPanel = ({ formData }) => {
                                             setColumnPrice(newValue)
                                             formik.values["fee"] = newValue.value * formik.values.length;
                                         }}
+                                        
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 InputLabelProps={{
diff --git a/src/pages/Proof/Search_GLD/SearchForm.js b/src/pages/Proof/Search_GLD/SearchForm.js
index ede12d2..1a31c80 100644
--- a/src/pages/Proof/Search_GLD/SearchForm.js
+++ b/src/pages/Proof/Search_GLD/SearchForm.js
@@ -232,6 +232,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 onChange={(event, newValue) => {
                                     setIssueSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Issue No."
@@ -256,6 +261,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 onChange={(event, newValue) => {
                                     setGroupSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Group"
@@ -355,6 +365,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                         setStatus(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Status"
@@ -387,6 +402,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                                 setOrgSelected({});
                                             }
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 label="Organisation"
diff --git a/src/pages/Proof/Search_Public/SearchForm.js b/src/pages/Proof/Search_Public/SearchForm.js
index 40a3f00..d2c39ad 100644
--- a/src/pages/Proof/Search_Public/SearchForm.js
+++ b/src/pages/Proof/Search_Public/SearchForm.js
@@ -210,6 +210,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o
                             onChange={(event, newValue) => {
                                 setIssueSelected(newValue);
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label={intl.formatMessage({id: 'gazetteCount'})}
@@ -335,6 +340,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o
                                     setStatus(ComboData.proofStatus[0]);
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label={intl.formatMessage({id: 'status'})}
diff --git a/src/pages/PublicNotice/Details_GLD/StatusChangeDialog.js b/src/pages/PublicNotice/Details_GLD/StatusChangeDialog.js
index c4fdcb3..0f7ddff 100644
--- a/src/pages/PublicNotice/Details_GLD/StatusChangeDialog.js
+++ b/src/pages/PublicNotice/Details_GLD/StatusChangeDialog.js
@@ -160,7 +160,11 @@ const StatusChangeDialog = (props) => {
                   props.setSelectedGazetteGroupInputType("");
                 }
               }}
-              // sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
+              sx={{
+                  '& .MuiInputBase-root': { alignItems: 'center' },
+                  '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                  '& .MuiOutlinedInput-root': { height: 40 }
+              }}
               renderInput={(params) => <TextField {...params} placeholder="" />}
             />
           </Grid>
diff --git a/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js b/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
index 831a2c2..1ece40b 100644
--- a/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
+++ b/src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
@@ -393,6 +393,11 @@ export default function SubmittedTab({ setCount, url }) {
                                     // console.log(newValue)
                                     setSelectedCareOf(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => <TextField {...params} />}
                             />
                         </Grid>
diff --git a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js
index a568f4c..6721000 100644
--- a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js
+++ b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js
@@ -242,6 +242,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) =>
                                     setStatus(newValue);
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label={intl.formatMessage({id: 'status'})}
diff --git a/src/pages/PublicNotice/Search_GLD/SearchForm.js b/src/pages/PublicNotice/Search_GLD/SearchForm.js
index 1c1bc0f..833c851 100644
--- a/src/pages/PublicNotice/Search_GLD/SearchForm.js
+++ b/src/pages/PublicNotice/Search_GLD/SearchForm.js
@@ -272,6 +272,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                     }
                                 }}
                                 getOptionLabel={(option) => option.label}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField
                                         {...params}
@@ -337,6 +342,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                                 setOrgSelected({});
                                             }
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 label="Organisation"
@@ -371,6 +381,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 onChange={(event, newValue) => {
                                         setIssueSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Issue No."
@@ -395,6 +410,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 onChange={(event, newValue) => {
                                     setGroupSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Group"
diff --git a/src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js b/src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js
index 4c1c35b..324c2c2 100644
--- a/src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js
+++ b/src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js
@@ -267,6 +267,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                     }
                                 }}
                                 getOptionLabel={(option) => option.label}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField
                                         {...params}
@@ -333,6 +338,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                                 setOrgSelected({});
                                             }
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 label="Organisation"
@@ -367,6 +377,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 onChange={(event, newValue) => {
                                         setIssueSelected(newValue);
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Gazette Issue No."
diff --git a/src/pages/Recon/SearchForm.js b/src/pages/Recon/SearchForm.js
index c236000..475f4e7 100644
--- a/src/pages/Recon/SearchForm.js
+++ b/src/pages/Recon/SearchForm.js
@@ -192,6 +192,11 @@ const SearchPublicNoticeForm = ({ applySearch, generateReport, onLoad }) => {
                                         setMethod(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Payment Method"
@@ -219,6 +224,11 @@ const SearchPublicNoticeForm = ({ applySearch, generateReport, onLoad }) => {
                                         setStatus(newValue);
                                     }
                                 }}
+                                sx={{
+                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                }}
                                 renderInput={(params) => (
                                     <TextField {...params}
                                         label="Payment Status"
diff --git a/src/pages/User/SearchPage_Individual/UserSearchForm_Individual.js b/src/pages/User/SearchPage_Individual/UserSearchForm_Individual.js
index 1b27b25..991aaf6 100644
--- a/src/pages/User/SearchPage_Individual/UserSearchForm_Individual.js
+++ b/src/pages/User/SearchPage_Individual/UserSearchForm_Individual.js
@@ -146,6 +146,11 @@ const UserSearchForm_Individual = ({ applySearch, onGridReady, searchCriteria })
                                     setAccountFilter("All");
                                 }
                             }}
+                            sx={{
+                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                '& .MuiOutlinedInput-root': { height: 40 }
+                            }}
                             renderInput={(params) => (
                                 <TextField {...params}
                                     label="Status"
diff --git a/src/pages/User/SearchPage_Organization/UserSearchForm_Organization.js b/src/pages/User/SearchPage_Organization/UserSearchForm_Organization.js
index ece3286..8137a9e 100644
--- a/src/pages/User/SearchPage_Organization/UserSearchForm_Organization.js
+++ b/src/pages/User/SearchPage_Organization/UserSearchForm_Organization.js
@@ -119,6 +119,11 @@ const UserSearchForm_Organization = ({applySearch, orgComboData, onGridReady, se
                                                 setOrgSelected({});
                                             }
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                             <TextField {...params}
                                                 label="Organisation"
@@ -214,12 +219,17 @@ const UserSearchForm_Organization = ({applySearch, orgComboData, onGridReady, se
                                         options={["All", "Active","Locked","Not Verified"]}
                                         value={accountFilter}
                                         onChange={(event, newValue) => {
-                                        if (newValue !== null){
-                                            setAccountFilter(newValue);
-                                        }else{
-                                            setAccountFilter("All");
-                                        }
-                                    }}
+                                            if (newValue !== null){
+                                                setAccountFilter(newValue);
+                                            }else{
+                                                setAccountFilter("All");
+                                            }
+                                        }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => (
                                         <TextField {...params}
                                             label="Status"
diff --git a/src/pages/authentication/auth-forms/BusCustomFormWizard.js b/src/pages/authentication/auth-forms/BusCustomFormWizard.js
index 5721793..1363321 100644
--- a/src/pages/authentication/auth-forms/BusCustomFormWizard.js
+++ b/src/pages/authentication/auth-forms/BusCustomFormWizard.js
@@ -1035,9 +1035,11 @@ const BusCustomFormWizard = (props) => {
                                             onChange={(event, newValue) => {
                                                 setSelectedAddress4(newValue);
                                             }}
-                                            sx={{ "& .MuiInputBase-root": { height: "41px" },
-                                                "#address4-combo": { padding: "0px 0px 0px 3px" },
-                                                "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
+                                            sx={{
+                                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                '& .MuiOutlinedInput-root': { height: 40 }
+                                            }}
                                             renderInput={(params) => <TextField error={checkDistrict} {...params} placeholder={intl.formatMessage({id: 'region'})}
                                             />}
                                         />
@@ -1083,8 +1085,11 @@ const BusCustomFormWizard = (props) => {
                                                     setCheckCountry(true)
                                                 }
                                             }}
-
-                                            sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address5-combo": { padding: "0px 0px 0px 3px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
+                                             sx={{
+                                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                '& .MuiOutlinedInput-root': { height: 40 }
+                                            }}
                                             renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({id: 'regionOrCountry'})} />}
                                         />
                                         {formik.touched.address1 && formik.errors.address1 && (
diff --git a/src/pages/authentication/auth-forms/CustomFormWizard.js b/src/pages/authentication/auth-forms/CustomFormWizard.js
index 5e0127a..666a4b9 100644
--- a/src/pages/authentication/auth-forms/CustomFormWizard.js
+++ b/src/pages/authentication/auth-forms/CustomFormWizard.js
@@ -1101,7 +1101,11 @@ const CustomFormWizard = (props) => {
                                                             setSelectedIdDocType({});
                                                         }
                                                     }}
-                                                    sx={{ "#address4-combo": { padding: "0px 0px 0px 0px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
+                                                    sx={{
+                                                        '& .MuiInputBase-root': { alignItems: 'center' },
+                                                        '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                        '& .MuiOutlinedInput-root': { height: 40 }
+                                                    }}
                                                     renderInput={(params) => <TextField
                                                         {...params}
                                                         error={formik.touched.idDocType && (selectedIdDocType === null || selectedIdDocType?.type == null)}
@@ -1402,9 +1406,9 @@ const CustomFormWizard = (props) => {
                                                 setSelectedAddress4(newValue);
                                             }}
                                             sx={{
-                                                "& .MuiInputBase-root": { height: "41px" },
-                                                "#address4-combo": { padding: "0px 0px 0px 3px" },
-                                                "& .MuiAutocomplete-endAdornment": { top: "auto" },
+                                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                '& .MuiOutlinedInput-root': { height: 40 }
                                             }}
                                             renderInput={(params) => <TextField error={checkDistrict} {...params} placeholder={intl.formatMessage({ id: 'region' })}
                                             />}
@@ -1452,8 +1456,11 @@ const CustomFormWizard = (props) => {
                                                     setCheckCountry(true)
                                                 }
                                             }}
-
-                                            sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address5-combo": { padding: "0px 0px 0px 3px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
+                                            sx={{
+                                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                '& .MuiOutlinedInput-root': { height: 40 }
+                                            }}
                                             renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({ id: 'regionOrCountry' })} />}
                                         />
                                         {formik.touched.address1 && formik.errors.address1 && (
diff --git a/src/pages/authentication/auth-forms/IAmSmartFormWizard.js b/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
index 358f71b..3c08cb3 100644
--- a/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
+++ b/src/pages/authentication/auth-forms/IAmSmartFormWizard.js
@@ -615,8 +615,12 @@ const CustomFormWizard = (props) => {
                                                 onChange={(event, newValue) => {
                                                     setSelectedAddress4(newValue);
                                                 }}
-                                                sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address4-combo": { padding: "0px 0px 0px 0px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
-                                                renderInput={(params) => <TextField error={checkDistrict} {...params} placeholder={intl.formatMessage({ id: 'region' })}
+                                                sx={{
+                                                    '& .MuiInputBase-root': { alignItems: 'center' },
+                                                    '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                    '& .MuiOutlinedInput-root': { height: 40 }
+                                                }}
+                                            renderInput={(params) => <TextField error={checkDistrict} {...params} placeholder={intl.formatMessage({ id: 'region' })}
                                                 />}
                                             />
                                             <Autocomplete
@@ -640,9 +644,12 @@ const CustomFormWizard = (props) => {
                                                         setCheckCountry(true)
                                                     }
                                                 }}
-    
-                                                sx={{ "& .MuiInputBase-root": { height: "41px" }, "#address5-combo": { padding: "0px 0px 0px 0px" }, "& .MuiAutocomplete-endAdornment": { top: "auto" }, }}
-                                                renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({ id: 'regionOrCountry' })} />}
+                                            sx={{
+                                                '& .MuiInputBase-root': { alignItems: 'center' },
+                                                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                                '& .MuiOutlinedInput-root': { height: 40 }
+                                            }}
+                                            renderInput={(params) => <TextField {...params} placeholder={intl.formatMessage({ id: 'regionOrCountry' })} />}
                                             />
                                             {formik.touched.address1 && formik.errors.address1 && (
                                                 <FormHelperText error id="helper-text-address1-signup">
diff --git a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js
index 2b1af31..4a6a289 100644
--- a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js
+++ b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js
@@ -128,6 +128,11 @@ const UserAddCard = ({ isCollectData, updateGroupMember, userGroupData, isNewRec
                                             // console.log(newValue)
                                             setSelectedUser(newValue);
                                         }}
+                                        sx={{
+                                            '& .MuiInputBase-root': { alignItems: 'center' },
+                                            '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                                            '& .MuiOutlinedInput-root': { height: 40 }
+                                        }}
                                         renderInput={(params) => <TextField {...params} />}
                                     />
                                 </Grid>
diff --git a/src/utils/Combo.js b/src/utils/Combo.js
index e426802..6a0b761 100644
--- a/src/utils/Combo.js
+++ b/src/utils/Combo.js
@@ -41,13 +41,9 @@ export default function Combo ({valueName, disabled, form, dataList, filterOptio
                 }
             }}
             sx={{
-                "& .MuiInputBase-root": { 
-                    height: "41px", 
-                    padding: "0px 0px 0px 8px" 
-                },
-                "& .MuiAutocomplete-endAdornment": { 
-                    top: "auto" 
-                },
+                '& .MuiInputBase-root': { alignItems: 'center' },
+                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                '& .MuiOutlinedInput-root': { height: 40 },
                 "& .MuiInputBase-input.Mui-disabled": {
                     WebkitTextFillColor: "#000000",
                     background: "#f8f8f8",
diff --git a/src/utils/SelectBase.js b/src/utils/SelectBase.js
index 385e058..806ff0d 100644
--- a/src/utils/SelectBase.js
+++ b/src/utils/SelectBase.js
@@ -40,13 +40,9 @@ export default function Combo ({valueName, disabled, form, dataList, filterOptio
                 }
             }}
             sx={{
-                "& .MuiInputBase-root": { 
-                    height: "41px", 
-                    padding: "0px 0px 0px 8px" 
-                },
-                "& .MuiAutocomplete-endAdornment": { 
-                    top: "auto" 
-                },
+                '& .MuiInputBase-root': { alignItems: 'center' },
+                '& .MuiAutocomplete-endAdornment': { top: '50%', transform: 'translateY(-50%)' },
+                '& .MuiOutlinedInput-root': { height: 40 },
                 "& .MuiInputBase-input.Mui-disabled": {
                     WebkitTextFillColor: "#000000",
                     background: "#f8f8f8",