diff --git a/res/css/_common.scss b/res/css/_common.scss
index 1f973c28d2..4399fb224e 100644
--- a/res/css/_common.scss
+++ b/res/css/_common.scss
@@ -50,6 +50,51 @@ a:visited {
     color: $accent-color-alt;
 }
 
+input[type=text],
+input[type=search],
+input[type=password] {
+    padding: 9px;
+    font-family: $font-family;
+    font-size: 14px;
+    font-weight: 600;
+    min-width: 0;
+}
+
+input[type=text].mx_textinput_icon,
+input[type=search].mx_textinput_icon {
+    padding-left: 36px;
+    background-repeat: no-repeat;
+    background-position: 10px center;
+}
+
+// FIXME THEME - Tint by CSS rather than referencing a duplicate asset
+input[type=text].mx_textinput_icon.mx_textinput_search,
+input[type=search].mx_textinput_icon.mx_textinput_search {
+    background-image: url('$(res)/img/feather-icons/search-input.svg');
+}
+
+// dont search UI as not all browsers support it,
+// we implement it ourselves where needed instead
+input[type=search]::-webkit-search-decoration,
+input[type=search]::-webkit-search-cancel-button,
+input[type=search]::-webkit-search-results-button,
+input[type=search]::-webkit-search-results-decoration {
+    display: none;
+}
+
+.input[type=text]::-webkit-input-placeholder,
+.input[type=text]::-moz-placeholder,
+.input[type=search]::-webkit-input-placeholder,
+.input[type=search]::-moz-placeholder {
+    color: #a5aab2;
+}
+
+// Override Firefox's UA style so we get a consistent look across browsers
+input::placeholder,
+textarea::placeholder {
+    opacity: initial;
+}
+
 input[type=text], input[type=password], textarea {
     background-color: transparent;
     color: $primary-fg-color;
diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss
index 63aff91806..8a4e25d689 100644
--- a/res/themes/dark/css/_dark.scss
+++ b/res/themes/dark/css/_dark.scss
@@ -173,13 +173,6 @@ $room-warning-bg-color: $header-panel-bg-color;
     }
 }
 
-.input[type=text]::-webkit-input-placeholder,
-.input[type=text]::-moz-placeholder,
-.input[type=search]::-webkit-input-placeholder,
-.input[type=search]::-moz-placeholder {
-    color: #a5aab2;
-}
-
 // ***** Mixins! *****
 
 @define-mixin mx_DialogButton {
diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss
index b4626eb7c3..9911f30d7b 100644
--- a/res/themes/light/css/_light.scss
+++ b/res/themes/light/css/_light.scss
@@ -287,16 +287,6 @@ $authpage-body-color: #61708b;
     }
 }
 
-input[type=text],
-input[type=search],
-input[type=password] {
-    padding: 9px;
-    font-family: $font-family;
-    font-size: 14px;
-    font-weight: 600;
-    min-width: 0;
-}
-
 /*** panels ***/
 .dark-panel {
     background-color: $secondary-accent-color;
@@ -329,7 +319,6 @@ input[type=search].mx_textinput_icon {
     background-position: 10px center;
 }
 
-
 // FIXME THEME - Tint by CSS rather than referencing a duplicate asset
 input[type=text].mx_textinput_icon.mx_textinput_search,
 input[type=search].mx_textinput_icon.mx_textinput_search {
@@ -342,7 +331,7 @@ input[type=search]::-webkit-search-decoration,
 input[type=search]::-webkit-search-cancel-button,
 input[type=search]::-webkit-search-results-button,
 input[type=search]::-webkit-search-results-decoration {
-  display: none;
+    display: none;
 }
 
 .input[type=text]::-webkit-input-placeholder,