@import '../default.less';
@import '../mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

::placeholder
{
	color: #6993a9;
	opacity: 1;
}

:-ms-input-placeholder
{ /* Internet Explorer 10-11 */
	color: red;
}

::-ms-input-placeholder
{ /* Microsoft Edge */
	color: red;
}

#site-main .signup-next {
	.other, .hidden {
		display: none;
	}

	.chzn-container {
		max-width: initial !important;
		margin-top: .5em;
		margin-bottom: 20px;

		.chzn-single {
			width: 430px;
			height: 50px;
			border: none;
			padding: 5px;
			background-color: #c8d7df;
			background-image: none;
			box-shadow: none;
			filter: initial;

			span {
				height: 46px;
				color: #6993a9;
				line-height: 46px;
				font-size: 18px;
				.padding-left-right(10px, 0);

				html[dir='rtl'] & {
					.padding-left-right(0, 10px);
				}
			}

			div {
				border-left: none;
				background: none;
				width: 20px;
				filter: initial;
				background-image: url("/Img/v7/shared/input-arrow.svg");
				background-repeat: no-repeat;
				background-size: 21px 10px;
				background-position-y: 26px;
				.margin-left-right(0, 14px);

				html[dir='rtl'] & {
					.margin-left-right(14px, 0);
					left: 0;
					right: auto;
				}

				b {
					display: none;
				}
			}
		}

		.chzn-drop {
			width: 440px !important;
			background: #c8d7df;
			border: none;
			box-shadow: none;

			input {
				width: 422px !important;
				height: auto !important;
				padding: 0;
				background: none;
			}
		}

		.chzn-results {
			padding: 0;
			margin: 0;

			li {
				padding: 5px 10px;
				color: #6993a9;
			}

			.highlighted {
				background: #26A0DA;
				color: white;
			}
		}
	}

	label {
		display: block;

		&[for=phone] {
			margin-bottom: .5em;
		}
	}

	input[type=button] {
		display: block;

		&[disabled] {
			cursor: default;
			background-color: #999;
		}
	}

	input[type=text],
	input[type=email] {
		font: normal 18px @title-font;
	}

	input[type=text],
	input[type=email],
	select {
		margin-top: .5em;
		margin-bottom: 20px;
		outline: none;
		color: #6993a9;
	}

	select {
		width: 440px;
		box-sizing: border-box;
		background-color: #c8d7df;
		height: 60px;
		padding: 15px;
		font: 18px @title-font;
		border: none;
		border-radius: 0;
		-moz-appearance: none;
		-webkit-appearance: none;
		background-image: url("/Img/v7/shared/input-arrow.svg");
		background-repeat: no-repeat;
		background-size: 21px 10px;
		background-position: 405px 26px;

		html[dir='rtl'] & {
			background-position: 15px 26px;
		}

		.option {
			width: 440px;
			text-overflow: ellipsis;
			overflow: hidden;
		}
	}

	select::-ms-expand {
		opacity: 0;
	}

	#phone {
		.padding-left-right(85px, 0);
		font-family: @title-font;
		font-weight: normal;
		color: #6993a9;

		html[dir='rtl'] & {
			.padding-left-right(0, 85px);
		}
	}

	#a-email,
	#c-code {
		margin-bottom: 0;
	}

	#change-email,
	#confirm-code {
		margin-top: 20px;
	}

	.intl-tel-input {
		margin-bottom: 20px;

		.flag-container {
			//default values in intlTelInput
			html[dir='rtl'] & {
				right: 0;
				left: auto;
			}

			.selected-flag {
				html[dir='rtl'] & {
					padding: 0 8px 0 0;
				}

				.iti-arrow {
					html[dir='rtl'] & {
						right: auto;
						left: 6px;
					}
				}
			}

			.country-list {
				html[dir='rtl'] & {
					text-align: right;
				}
			}
		}
	}

	.country-list {
		width: 440px;

		.country-name {
			display: inline-block;
			max-width: 330px;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}

	.prop {
		clear: both;

		&.completed {
			display: none;
		}
	}

	input[type=checkbox] {
		position: relative;
		z-index: 1;
		opacity: 0;

		& + .checkmark {
			display: inline-block;
			.hires("/img/v7/dsviewer/memberlist-member");
			background-position: -36px 0;
			background-repeat: no-repeat;
			width: 12px;
			height: 12px;
			position: relative;
			left: -12px;

			html[dir='rtl'] & {
				left: auto;
				right: -12px;
			}
		}

		&:checked + .checkmark {
			background-position: -24px 0;
		}
	}

	.submit-btn {
		display: block;
		margin: 30px 0;
		padding: 15px;
		width: 440px;
		height: 56px;
		color: white;
		font-size: 19px;
	}

	.find-university,
	.resend-code,
	.prop.education .custom a {
		text-decoration: none;
		display: block;
		font-size: 18px;
		margin: 20px 0;
	}

	.prop.education .custom a {
		margin-top: 0;
	}

	.error {
		font-family: @title-font;
		font-size: 14px;
		color: #c13a3f;
		display: block;

		&.hidden {
			display: none;
		}
	}

	.submit {
		margin: 20px 0;
	}
}