@import '../../../scss/index.scss';

// Поле ввода
@mixin input () {
	@include fix();
	@include reset-input();
	@include font-family();
	@include placeholder($color-placeholder);
	height: 32px;
	padding: 0 9px;
	line-height: 18px;
	font-size: 14px;
	border-radius: 3px;
	border: 1px solid $color-border;
	background-color: $color-bg;
	color: $color;
	transition:
		background 200ms ease,
		color 200ms ease,
		border 200ms ease;

	&:hover {
		border: 1px solid $color-border-hover;
	}
	&:focus {
		border: 1px solid $color-border-focus;
	}

	// Поле с ошибкой
	&[has-error="true"] {
		border: solid 1px $color-border-error;
	}

	// Поле отключено / только для чтения
	&[disabled],
	&[readonly] {
		&,
		&:hover,
		&:focus {
			@include placeholder(rgba($color-disabled, 0.5));
			background: $color-bg-disabled;
			border: 1px solid $color-border-disabled;
			color: $color-disabled;
		}
	}
}