.control--icon {

	p {
		text-align: center;
	}

	i {
		display: inline-block;
		padding: 12px 0;
		width: 10%;
		height: 50px;
		cursor: pointer;
		font-size: 24px;
		line-height: 1;
		text-decoration: inherit;
		font-weight: normal;
		font-style: normal;
		vertical-align: top;
		text-align: center;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}

.icon-control {
	max-height: 350px;
	overflow-y: auto;
}

.icon-list {
	margin: 0;
	list-style: none;

	&__icon {
		display: inline-block;
		padding: 12px 0;
		width: 10%;
		background-color: $global-white-color;
		text-align: center;
		cursor: pointer;

		input[type=radio] {
			display: none;
		}

		i {
			display: inline-block;
			font-size: 20px;
			line-height: 1;
			text-decoration: inherit;
			font-weight: normal;
			font-style: normal;
			vertical-align: top;
			text-align: center;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;

			&:hover {
				color: $global-primary-color;
			}
		}

		input[type=radio]:checked + i {
			color: $global-primary-color;
		}
	}

	@include clearfix;
}

// Contextual styles
.dialog__container {

	.search--icon {
		padding: 6px 10px;
		margin-bottom: 8px;
	}

	.select--icon {
		width: 100%;
		max-width: none;
		margin: 0 0 6px;
	}
}