diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index eea6fa0fe5..5735596751 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -302,10 +302,9 @@ select,
 }
 
 /* Radio & Checkboxes */
-input, label {
-	--color-checkbox-radio-disabled: nc-darken($color-main-background, 27%);
-	--color-checkbox-radio-border: nc-darken($color-main-background, 47%);
-}
+$color-checkbox-radio-disabled: nc-darken($color-main-background, 27%);
+$color-checkbox-radio-border: nc-darken($color-main-background, 47%);
+
 input {
 	&[type='checkbox'],
 	&[type='radio'] {
@@ -333,7 +332,7 @@ input {
 				border-radius: 50%;
 				margin: 3px;
 				margin-top: 1px;
-				border: 1px solid var(--color-checkbox-radio-border);
+				border: 1px solid $color-checkbox-radio-border;
 			}
 			&:not(:disabled):not(:checked) + label:hover:before,
 			&:focus + label:before {
@@ -348,11 +347,11 @@ input {
 				border-color: var(--color-primary-element);
 			}
 			&:disabled + label:before {
-				border: 1px solid var(--color-checkbox-radio-border);
-				background-color: var(--color-checkbox-radio-disabled) !important; /* override other status */
+				border: 1px solid $color-checkbox-radio-border;
+				background-color: $color-checkbox-radio-disabled !important; /* override other status */
 			}
 			&:checked:disabled + label:before {
-				background-color: var(--color-checkbox-radio-disabled);
+				background-color: $color-checkbox-radio-disabled;
 			}
 		}
 		&.checkbox {