@component OpalSelect {
	position: relative;
	display: inline-block;
	vertical-align: middle;

	@el button {
		display: block;
		min-width: 100%;
		text-align: left;

		@mod size=s {
			@el buttonIcon {
				margin-left: 8px;
				width: 12px;
				height: 12px;
			}
		}

		@mod checked {
			@el buttonIcon {
				transform: scaleY(-1);
			}
		}
	}
		@el buttonIcon {
			position: relative;
			top: -1px;
			margin-left: 10px;
			width: 14px;
			height: 14px;
			transition: transform .1s linear;
		}

	&:not([view_type=clean]) {
		@el button {
			padding-right: 47px; /* 23 + 14 + 10 */

			@mod size=s {
				padding-right: 34px; /* 14 + 12 + 8 */

				@el buttonIcon {
					right: 14px;
					margin-left: 0;
				}
			}
		}
			@el buttonIcon {
				position: absolute;
				top: 0;
				right: 23px;
				bottom: 0;
				margin: auto;
			}
	}

	@el menu {
	}
		@el menuContent {
		}
			@el newItemInputSlot {
			}
				@el newItemInput {
					display: block;
					margin: 6px 10px 4px;
					width: auto;
				}

	/* Combinations */

	& .OpalPopover {
		padding: 6px 0;
		min-width: 140px;
	}

	& .OpalPopover .OpalPopover__contentSlot {
		overflow: auto;
		max-height: 380px;
	}

	& .OpalFilteredList .OpalFilteredList__queryInput {
		margin: 4px 10px 6px;
	}

	& .OpalModal__contentSlot > .OpalFilteredList .OpalFilteredList__queryInput {
		margin: 0 0 10px;
	}

	& .OpalLoadedList {
		height: 304px; /* 38 * 8 */
	}

	& .OpalLoader[align_center] {
		border-top-width: 100px;
		border-bottom-width: 100px;
	}
}