@mixin input {
	background-color: $wcfInputBackground;
	border: 1px solid $wcfInputBorder;
	border-radius: 0;
	color: $wcfInputText;
	font-weight: 400;
	outline: none;
	padding: 4px 8px;
	
	// input elements do not inherit font family, size and line-height from body
	font-family: $wcfFontFamily;
	@include wcfFontDefault;
	@include wcfLineHeight;
	
	&:focus,
	&:hover {
		background-color: $wcfInputBackgroundActive;
		border-color: $wcfInputBorderActive;
		color: $wcfInputTextActive;
	}
	
	&[disabled],
	&.disabled {
		background-color: $wcfInputDisabledBackground !important;
		border-color: $wcfInputDisabledBorder !important;
		color: $wcfInputDisabledText !important;
	}
	
	&[readonly] {
		color: $wcfInputDisabledText !important;
	}
}