diff --git a/src/index.css b/src/index.css
index 2c74a6d..1d7a798 100644
--- a/src/index.css
+++ b/src/index.css
@@ -414,3 +414,12 @@ label {
 .ant-select-selection-overflow-item {
   z-index: 999 !important;
 }
+
+/* Target selection item and arrow in the Select component (not the dropdown) */
+.order-type-select-container :where(.ant-select .ant-select-selection-item) {
+  color: #fff !important;
+}
+
+.order-type-select-container :where(.ant-select .ant-select-arrow) {
+  color: #fff !important;
+}
diff --git a/src/pages/menu/menu.module.css b/src/pages/menu/menu.module.css
index 0eec874..afbe5ba 100644
--- a/src/pages/menu/menu.module.css
+++ b/src/pages/menu/menu.module.css
@@ -693,10 +693,4 @@
   right: -10px !important;
 }
 
-:global(.ant-select-selection-item) {
-  color: #fff !important;
-}
 
-:global(.ant-select-arrow) {
-  color: #fff !important;
-}
diff --git a/src/pages/menu/page.tsx b/src/pages/menu/page.tsx
index 50ea965..c6e8bba 100644
--- a/src/pages/menu/page.tsx
+++ b/src/pages/menu/page.tsx
@@ -91,7 +91,7 @@ function MenuPage() {
               <BackButton />
             </div>
             <div
-              className={`${styles.headerFloatingBtn} ${styles.orderTypeSelectContainer}`}
+              className={`${styles.headerFloatingBtn} ${styles.orderTypeSelectContainer} order-type-select-container`}
             >
               <Select
                 value={orderType}