fix main dropdown styles

src/pages/menu/menu.module.css

@@ -844,3 +844,21 @@
   white-space: nowrap;
   width: fit-content;
 }
+
+.frameSelect {
+  align-items: flex-start;
+  background-color: #aaa7a733;
+  border-radius: 60px;
+  flex-direction: column;
+  gap: 10px;
+  position: relative;
+}
+
+.divSelect {
+  align-items: center;
+  align-self: stretch;
+  display: flex;
+  flex: 0 0 auto;
+  gap: 4px;
+  position: relative;
+}

src/pages/menu/page.tsx

@@ -97,6 +97,8 @@ function MenuPage() {
               className={`${styles.headerFloatingBtn} ${styles.orderTypeSelectContainer} order-type-select-container`}
             >
               {orderType !== OrderType.Redeem && (
+                <div className={styles.frameSelect}>
+                  <div className={styles.divSelect}>
                     <Select
                       value={orderType}
                       options={orderTypeOptions}
@@ -109,9 +111,13 @@ function MenuPage() {
                       variant="borderless"
                       size="small"
                       className={styles.orderTypeSelect}
-                  classNames={{ popup: { root: "order-type-select-dropdown" } }}
+                      classNames={{
+                        popup: { root: "order-type-select-dropdown" },
+                      }}
                       listHeight={150}
                     />
+                  </div>
+                </div>
               )}
               {orderType === OrderType.Redeem && (
                 <div className={styles.frame}>