/*********************************
Select2 XTFW Theme
*********************************/

.select2-container--xtfw{

	@media screen and (max-width: 782px) {
		width:100%!important;
		height:40px;

		.select2-selection{
			height:40px!important;
			> * {
				line-height: 40px !important;
				height: 32px!important;
			}
		}
	}

	.select2-results__option{
		margin: 0 0 1px;
		&:last-child{
			margin:0;
		}
	}
	.select2-container--focus .select2-selection--multiple{
		border: 1px solid $input-border-color;
	}
	.select2-results__option--highlighted[aria-selected]:not([aria-selected=true]){
		background: $input-border-color!important;
	}
	.select2-results__option[aria-selected=true]{
		background: $input-primary-color;
		color: #fff;
		opacity: 0.8;
	}
	.select2-selection--single{
		border-radius:$input-radius;
	}

	.select2-dropdown{
		border-color: $input-border-color;
	}


	.select2-search{

		input {
			height: 30px !important;
			border:0;
			border-bottom:1px solid $input-border-color;
			border-radius: 0;
			outline: none;

			&:focus{
				box-shadow: none;
				outline: none;
			}
		}
	}

	&.select2-container--open{
		.select2-selection {
			border: 1px solid $input-primary-color;
			box-shadow: 0 0 0 1px $input-primary-color;
			outline: 1px solid transparent;
		}

		&.select2-container--below .select2-selection{
			border-bottom-left-radius: 0;
			border-bottom-right-radius: 0;
		}
		&.select2-container--above .select2-selection{
			border-top-left-radius: 0;
			border-top-right-radius: 0;
		}

		.select2-selection__arrow{
			b{
				transform: rotate(180deg);
				-webkit-transform: rotate(180deg);
				-moz-transform: rotate(180deg);
			}
		}

		.select2-dropdown{
			border-color: $input-primary-color;
			box-shadow: 0 0 0 1px $input-primary-color;
			outline: 1px solid transparent;
		}

	}

}

.select2-container--xtfw {
	.select2-choice {
		border: 1px solid #dce4ec;
		height: 36px;
		border-radius: $input-radius;
		font-family: "Lato", sans-serif;
		font-size: 14px;
		text-indent: 1px;
		box-shadow: none;
		background-image: none;
		div {
			border-left: 1px solid #dce4ec;
			border-radius: 0 4px 4px 0;
			background-clip: padding-box;
		}
		.select2-arrow{
			border: 0px;
			border-radius: 0px;
			background: transparent;
			background-image: none;
		}
	}
	*:focus{
		outline:0px;
	}

	.select2-container-active .select2-choice,
	.select2-container-active .select2-choices {
		border: 1px solid #dce4ec;
		outline: none;
		box-shadow: none;
	}

	.select2-dropdown-open .select2-choice {
		box-shadow: none;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
		.select2-choice div {
			background: transparent;
			border-left: none;
			filter: none;
		}
	}

	.select2-results{
		padding: 0 0 0 0px;
		margin: 4px 0px 0px 0;
		max-height: 250px;
		overflow: auto;
		.select2-highlighted {
			background: $input-primary-color;
			color: #fff;
			border-radius: $input-radius;
		}
	}

	.select2-container-multi{
		.select2-choices {
			height: auto !important;
			height: 1%;
			border: 1px solid #dce4ec;
		}
		&.select2-container-active .select2-choices {
			border: 1px solid #dce4ec;
			border-radius: $input-radius;
			box-shadow: none;
		}
	}

}

/****** Single SCSS *******/
.select2-container--xtfw{
	.select2-selection--single{
		background: $input-bg-color;
		border: 1px solid $input-border-color;
		height:34px;
		.select2-selection__rendered{
			color: $input-color;
			line-height:34px;
		}
		.select2-selection__arrow{
			height: 26px;
			position: absolute;
			top: 1px;
			right: 1px;
			width: 20px;
			b {
				border-color: $input-border-color transparent transparent transparent;
				top: 60%;
				border-style: solid;
				border-width: 5px 4px 0 4px;
				height: 0;
				left: 50%;
				margin-left: -4px;
				margin-top: -2px;
				position: absolute;
				width: 0;
			}
		}
		.select2-selection__placeholder {
			color: #fff;
		}

		.select2-selection__clear {
			cursor: pointer;
			float: right;
			font-weight: bold;
		}
	}
}

/****** Multiple SCSS *******/
.select2-container--xtfw{
	.select2-selection--multiple{
		border: 1px solid $input-border-color;
		border-radius: $input-radius;

		.select2-selection__choice__remove:hover{
			cursor: pointer;
		}
		.select2-selection__rendered {
			box-sizing: border-box;
			list-style: none;
			margin: 0;
			padding: 0 5px;
			width: 100%;
		}
		.select2-selection__choice{
			background-color: $input-primary-color;
			color: #fff;
			border-radius: $input-radius;
			padding: 0 10px;
			font-size: 12px;
			line-height: 30px;
			text-align: center;
			cursor: default;
			float: left;
			margin-right: 5px;
			margin-top: 5px;
		}
		.select2-selection__choice__remove{
			color: #fff;
			margin-right: 6px;
			margin-left: 6px;
			float: right;
		}
	}
}