diff --git a/app/src/main/java/info/nightscout/androidaps/plugins/general/food/FoodFragment.kt b/app/src/main/java/info/nightscout/androidaps/plugins/general/food/FoodFragment.kt
index 7aa8aad9f3..3cba103783 100644
--- a/app/src/main/java/info/nightscout/androidaps/plugins/general/food/FoodFragment.kt
+++ b/app/src/main/java/info/nightscout/androidaps/plugins/general/food/FoodFragment.kt
@@ -93,7 +93,7 @@ class FoodFragment : DaggerFragment() {
             }
         }
 
-        binding.clearfilter.setOnClickListener {
+        binding.filterinputLayout.setEndIconOnClickListener {
             binding.filter.setText("")
             binding.categoryList.setText(rh.gs(R.string.none), false)
             binding.subcategoryList.setText(rh.gs(R.string.none), false)
diff --git a/app/src/main/res/layout/food_fragment.xml b/app/src/main/res/layout/food_fragment.xml
index 4ff1de70d9..b27b57f88d 100644
--- a/app/src/main/res/layout/food_fragment.xml
+++ b/app/src/main/res/layout/food_fragment.xml
@@ -16,38 +16,32 @@
         android:text="@string/refresheventsfromnightscout"
         tools:visibility="visible" />
 
-    <LinearLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:orientation="horizontal">
-
-        <ImageView
-            android:layout_width="wrap_content"
+        <com.google.android.material.textfield.TextInputLayout
+            android:id="@+id/filterinputLayout"
+            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+            android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:contentDescription="@string/filter"
-            android:paddingLeft="5dp"
-            android:paddingRight="5dp"
-            app:srcCompat="@android:drawable/ic_menu_search" />
+            app:boxStrokeColor="@color/mtrl_textinput_default_box_stroke_color"
+            android:hint="@string/filter"
+            android:textColorHint="?attr/colorOnPrimary"
+            app:hintTextColor="?attr/colorOnPrimary"
+            app:startIconDrawable="@android:drawable/ic_menu_search"
+            app:endIconMode="clear_text">
 
-        <EditText
-            android:id="@+id/filter"
-            android:layout_width="0dp"
-            android:layout_height="wrap_content"
-            android:layout_weight="1"
-            android:autofillHints="@string/filter"
-            android:ems="10"
-            android:inputType="text"
-            android:text="" />
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/filter"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginStart="5dp"
+                android:layout_marginEnd="5dp"
+                android:layout_gravity="center_vertical"
+                android:layout_weight="1"
+                android:autofillHints="@string/notes_label"
+                android:gravity="start"
+                android:textStyle="bold"
+                android:inputType="text|textCapSentences" />
 
-        <ImageView
-            android:id="@+id/clearfilter"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:contentDescription="@string/clear_filter"
-            android:paddingLeft="5dp"
-            android:paddingRight="5dp"
-            app:srcCompat="@android:drawable/ic_menu_close_clear_cancel" />
-    </LinearLayout>
+        </com.google.android.material.textfield.TextInputLayout>
 
     <com.google.android.material.textfield.TextInputLayout
         style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
diff --git a/core/src/main/res/values/colors.xml b/core/src/main/res/values/colors.xml
index 3f633cc56a..f6fa73a66e 100644
--- a/core/src/main/res/values/colors.xml
+++ b/core/src/main/res/values/colors.xml
@@ -307,7 +307,7 @@
     <color name="aaps_theme_light_onError">#FFFFFF</color>
     <color name="aaps_theme_light_background">#FFFBFE</color>
     <color name="aaps_theme_light_onBackground">#1C1B1F</color>
-    <color name="aaps_theme_light_surface">#FFFBFE</color>
+    <color name="aaps_theme_light_surface">#FAF9F8</color>
     <color name="aaps_theme_light_onSurface">#1C1B1F</color>
     <color name="aaps_theme_light_surfaceVariant">#E7E0EC</color>
 
diff --git a/core/src/main/res/values/styles.xml b/core/src/main/res/values/styles.xml
index 2da4b24680..a31aa056d1 100644
--- a/core/src/main/res/values/styles.xml
+++ b/core/src/main/res/values/styles.xml
@@ -23,7 +23,7 @@
         <!-- New MaterialComponents attributes. -->
         <item name="colorPrimaryVariant">@color/primaryLightColorDefault</item>
         <item name="colorSecondaryVariant">@color/secondaryLightColorDefault</item>
-        <item name="scrimBackground">@color/white</item>
+        <item name="scrimBackground">@color/aaps_theme_light_background</item>
         <item name="popupMenuStyle">@style/Widget.MaterialComponents.PopupMenu</item>
         <item name="actionOverflowMenuStyle">@style/Widget.MaterialComponents.PopupMenu.Overflow</item>
         <!---Text Colors -->