diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index e23fc1e0e25..03df210e1ea 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -26,6 +26,7 @@ input, textarea, select, button, div[contenteditable=true], div[contenteditable=
 }
 
 $default-height: 36px;
+$opacity-disabled: .7;
 
 /* Simple selector to allow easy overriding */
 select,
@@ -49,6 +50,17 @@ div[contenteditable=false] {
  * color-text-maxcontrast	disabled state
  */
 
+button:not(.button-vue),
+input:not([type='range']),
+textarea {
+	&:disabled {
+		cursor: default;
+		color: var(--color-text-maxcontrast);
+		border-color: var(--color-border-dark);
+		opacity: $opacity-disabled;
+	}
+}
+
 input:not([type="range"]) {
 	outline: none;
 }
diff --git a/core/css/variables.scss b/core/css/variables.scss
index 625ba011322..ae41f194bd2 100644
--- a/core/css/variables.scss
+++ b/core/css/variables.scss
@@ -115,4 +115,3 @@ $header-menu-profile-item-height: 66px;
 
 // mobile. Keep in sync with core/js/js.js
 $breakpoint-mobile: 1024px;
-