Bootstrap 3 theme for chosen - less

chosen-bootstrap-theme.less

select.form-control + .chosen-container {
	&.chosen-container-single .chosen-single {
		.form-control();
		vertical-align: middle;
		div {
			top: 50%;
			margin-top: -12px;
			color: #000;
		}
		abbr {
			top: 50%;
			margin-top: -6px;
			margin-left: -6px;
		}
	}
	.chosen-drop {
		background-color: @dropdown-bg;
		border: 1px solid @dropdown-fallback-border;
		border: 1px solid @dropdown-border;
		border-radius: @border-radius-base;
		.box-shadow(0 6px 12px rgba(0,0,0,.175));
		background-clip: padding-box;
		margin: 2px 0 0;
	 
	}
	.chosen-search input[type=text] {
		.form-control();
		vertical-align: middle;
	}
	.chosen-results {
		margin: 2px 0 0;
		padding: 5px 0;
		font-size: @font-size-base;
		list-style: none;
		background-color: #fff;
		margin-bottom: 5px;
		width: 100%;
		li,
		li.active-result {
			display: block;
			padding: 3px 20px;
			clear: both;
			font-weight: normal;
			line-height: @line-height-base;
			color: @text-color;
			white-space: nowrap;
			background-image:none;
			&:hover, 
			&.highlighted {
				color: #FFF;
				text-decoration: none;
				background-color: @brand-primary;
				background-image:none;
			}
			&.disabled-result { 
				color: @input-color;
				background: @input-bg-disabled;
				&:hover {
					background: @input-bg-disabled;
				}
			}
			&.group-result {
				color: @input-color;
				font-weight: bold;
				background: @input-bg-disabled;
				&:hover {
					background: @input-bg-disabled;
				}
			}
			&.group-option { 
				padding-left: (@padding-base-horizontal*3); 
			}
		}
	}
	&.chosen-container-multi {
		.chosen-choices {
			display: block;
			width: 100%;
			min-height: @input-height-base;
			padding: 0 (@padding-base-horizontal/2);
			font-size: @font-size-base;
			line-height: @line-height-base;
			color: #fff;
			vertical-align: middle;
			background-color: @input-bg;
			background-image:none;
			border: 1px solid @input-border;
			border-radius: @input-border-radius;
			.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
			.transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
			
			li.search-field input[type="text"] {
				height: auto;
				width: auto !important;
				padding: 8px 0;
				margin: 0;
			}
			li.search-choice {
				position: relative;
				background-image: none;
				background: @brand-primary;
				border: 1px solid darken(@brand-primary, 5%);
				border-radius: @input-border-radius;
				padding: 2px 24px 2px 5px;
				margin: 4px 6px 0 0;
				font-size: @font-size-small;
				font-weight: normal;
				line-height: @line-height-base;
				text-align: center;
				white-space: nowrap;
				cursor: pointer;
				color: #fff;
				box-shadow: none;
				vertical-align: baseline;
				.search-choice-close {
					margin-top: -6px;
					top:50%;
					right:6px;
				}
			}
		}
		.chosen-results li.result-selected {
			display: list-item;
			color: @gray-light;
			cursor: default;
			background-color: #fff;
		}
	}
}

// Fix for input group
.input-group select.form-control + .chosen-container:not(:first-child):not(:last-child) .chosen-single,
.input-group select.form-control + .chosen-container:not(:first-child):not(:last-child) .chosen-choices {
	border-radius: 0;
}
.input-group select.form-control + .chosen-container:last-child .chosen-single,
.input-group select.form-control + .chosen-container:last-child .chosen-choices {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}
.input-group select.form-control + .chosen-container:first-child .chosen-single,
.input-group select.form-control + .chosen-container:first-child .chosen-choices {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

//Fix for single select input-sm
select.form-control.input-sm + .chosen-container-single .chosen-single {
	.input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
}
//Fix for single select input-lg
select.form-control.input-lg + .chosen-container-single .chosen-single {
	.input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
}