////
/// @group components/popup
////

/// Popup overlay that contains a perspective selector (at the point of styling...).
@mixin os-popup-perspective {
	.v-window-header {
		@include os-typeface-view-h2;
		.v-icon {
			padding-right: $v-unit-size * 0.3;
			}
		text-align: center;
		}
	.v-window-closebox {
		@include os-icon-font ( //$font-family: 'Arial', 
								$size: $v-font-size,
								$float: right,
								$content: '\2715');
		}
	.v-window-maximizebox {
		width: $v-unit-size * 1.2 !important;
		@include os-icon-font ( $size: $v-font-size,
								$float: right,
								$content: '\f096');					 
		border-bottom-left-radius: $v-unit-size *0.5;
		}
	.v-window-restorebox {
		width: $v-unit-size * 1.6 !important;
		@include os-icon-font ($float: right,
							   $size: $v-font-size,
							   $content: '\f24d',
							   $mirror: true);
		border-bottom-right-radius: $v-unit-size *0.5;							   						   
		}
	.v-window-closebox, .v-window-maximizebox, .v-window-restorebox {
		background-color: $os-light-contrast;
		height: $v-unit-size;
		color: valo-font-color($os-light-contrast);
		}
		
	.v-window-closebox-disabled {
		display: block;
		cursor: auto;
		color: get_color_mix(valo-font-color($os-light-contrast), #fff, 50);
		}
		
	.v-table-cell-content {
		height: floor($v-unit-size * 1.3);
		}
	}

/// Notification overlay.
@mixin os-popup-notification {
	h1[class^="v-Notification"] {
		font-size: $v-font-size * $v-scaling-factor--large;
		background: none;
		border: none;
		}
	}