/*! Forms */
fieldset {
	margin-top: 5rem;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"] {
	appearance: none;
	background-color: var(--go-input--color--background, var(--go--color--white));
	border: var(--go-input--border);
	border-radius: var(--go-input--border-radius, var(--go-button--border-radius));
	box-shadow: var(--go-input--box-shadow, none);
	color: var(--go-input--color--text);
	font-size: var(--go-input--font-size);
	font-weight: var(--go-input--font-weight, 400);
	line-height: 1;
	margin-bottom: var(--go-input--margin-bottom);
	padding: var(--go-input--padding--y) var(--go-input--padding--x);
	width: 100%;

	&:focus {
		background: var(--go-input-interactive--color--background, var(--go--color--white));
		border-color: var(--go-input-interactive--color--border-color, var(--go--color--primary));
		box-shadow: var(--go-input-interactive--box-shadow, none);
		color: var(--go-input-interactive--color--text, var(--go--color--text));
		outline: none;
	}
}

input[type="radio"],
input[type="checkbox"] {
	height: 19px;
	opacity: 0;
	width: 20px;
}

.coblocks-field {

	& input[type="radio"],
	& input[type="checkbox"],
	& input[type="hidden"] {
		display: none;
	}

	& .coblocks--inline {

		& .coblocks-checkbox-label,
		& .coblocks-radio-label {
			margin-right: 20px;
			padding-left: 2rem;

			&::before {
				top: 3px;
			}
		}
	}
}

input[type="radio"]:checked + label::before,
input[type="radio"]:checked + br + label::before {
	background-color: var(--go--color--primary) !important;
}

.coblocks-radio-label {
	@include checkbox-radio-label;
	position: relative;

	&:hover {
		cursor: pointer;
	}

	&::before {
		@include checkbox-radio-label-before;
		@include radio-label-before;
		top: 5px;
	}
}

.coblocks-checkbox-label {
	@include checkbox-radio-label;
	position: relative;

	&:hover {
		cursor: pointer;
	}

	&::before {
		@include checkbox-radio-label-before;
		@include checkbox-label-before;
		top: 5px;
	}
}

input[type="checkbox"]:checked + label,
input[type="checkbox"]:checked + br + label {

	&::before {
		@include checkbox-label-checked-before;
	}
}

textarea {
	background-color: var(--go-input--color--background, var(--go--color--white));
	border: var(--go-input--border);
	border-radius: var(--go-input--border-radius, var(--go-button--border-radius));
	color: var(--go-input--color--text);
	display: block;
	font-size: var(--go-input--font-size);
	font-weight: var(--go-input--font-weight, 400);
	margin-bottom: var(--go-input--margin-bottom);
	min-height: calc(0.5rem * 10);
	padding: var(--go-input--padding--x) var(--go-input--padding--x);
	width: 100%;

	&:focus {
		background: var(--go-input-interactive--color--background, var(--go--color--white));
		border-color: var(--go-input-interactive--color--border-color, var(--go--color--primary));
		box-shadow: var(--go-input-interactive--box-shadow, none);
		color: var(--go-input-interactive--color--text, var(--go--color--text));
		outline: none;
	}
}

select {
	@include select-menu;
	-webkit-appearance: none;
	-moz-appearance: none;
	margin-bottom: var(--go-input--margin-bottom);
	padding: var(--go-input--padding--y) var(--go-input--padding--x) !important;

	/* CAUTION: IE hackery ahead */
	&::-ms-expand {
		display: none; /* remove default arrow on ie10 and ie11 */
	}

	&:focus {
		@include select-menu-focus;
	}

	/* Target Internet Explorer 9 to undo the custom arrow */
	@media screen and (min-width: 0) {
		background: none;
		padding: 5px;
	}
}

option {
	font-weight: var(--go-input--font-weight, 400);
}

::placeholder {
	color: var(--go-input-placeholder--color--text, hsl(0, 0%, 47%));
	line-height: 1.5;
	opacity: 1;
}

::-ms-input-placeholder {
	color: var(--go-input-placeholder--color--text, hsl(0, 0%, 47%));
}

:-ms-input-placeholder {
	color: var(--go-input-placeholder--color--text, hsl(0, 0%, 47%));
}
