%toolbar-shadow {
	box-shadow: 1px 1px 3px 0px map-get($gray-shades, 200);
}

.dmz-toolbar {
	display: inline-block;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    border: 1px solid transparent;
	height: 30px;
	padding: 5px 10px;
	line-height: 24px;
	@extend .no-select;
	@include border-radius(6px);

	> .dicon {
		font-size: 16px;
		font-weight: 500;
		color: map-get($gray-shades, 600);
		padding: 0 0.25rem;
		cursor: pointer;

		&:hover {
			color: map-get($gray-shades, 700);
		}
	}

	> .red {
		color: map-get($red-shades, 500);

		&:hover {
			color: map-get($red-shades, 600);
		}
	}

	> .yellow {
		color: map-get($yellow-shades, 600);

		&:hover {
			color: map-get($yellow-shades, 700);
		}
	}

	> .green {
		color: map-get($green-shades, 500);

		&:hover {
			color: map-get($green-shades, 600);
		}
	}
}

.dmz-toolbar-large {
	height: 40px;
	padding: 7px 10px;
	line-height: 33px;

	> .dicon {
		font-size: 20px;
		font-weight: 500;
		padding: 0 0.5rem;
	}
}

.dmz-toolbar-dark {
	background-color: map-get($gray-shades, 200);
}

.dmz-toolbar-light {
	background-color: map-get($gray-shades, 100);
}

.dmz-toolbar-raised {
	@extend %toolbar-shadow;
}

.dmz-toolbar-bordered {
	border: 1px solid map-get($gray-shades, 300);
}


// .dmz-toolbar-dark-small {
// 	@extend .dmz-toolbar;
// 	background-color: map-get($gray-shades, 200);
// 	border: 1px solid map-get($gray-shades, 300);
// 	@extend %toolbar-shadow;
// }

// .dmz-toolbar-dark-large {
// 	@extend .dmz-toolbar;
// 	background-color: map-get($gray-shades, 200);
// 	border: 1px solid map-get($gray-shades, 300);
// 	height: 40px;
// 	padding: 7px 10px;
// 	line-height: 33px;
// 	@extend %toolbar-shadow;

// 	> .dicon {
// 		font-size: 20px;
// 		font-weight: 500;
// 		padding: 0 0.5rem;
// 	}
// }

// .dmz-toolbar-small {
// 	@extend .dmz-toolbar;
// 	background-color: transparent;
// }

// .dmz-toolbar-large {
// 	@extend .dmz-toolbar-dark-large;
// 	background-color: transparent;
// 	border: none;
// 	box-shadow: none;
// }

// .dmz-toolbar-raised-small {
// 	@extend .dmz-toolbar;
// 	@extend %toolbar-shadow;
// 	background-color: map-get($gray-shades, 100);
// 	border: 1px solid map-get($gray-shades, 200);
// }

// .dmz-toolbar-raised-large {
// 	@extend .dmz-toolbar-dark-large;
// 	@extend %toolbar-shadow;
// 	background-color: map-get($gray-shades, 100);
// 	border: 1px solid map-get($gray-shades, 200);
// }