@define MessageBoxAnimationDuration: 0.15s;

//
// Styles for tenfoot msg box
//

@define detailsdatalabel: gradient( linear, 0% 0%, 0% 100%, from( #f2f2f2ef ), to( #cbcbcbce ) );
@define detailsdatalabelfocus: gradient( linear, 0% 0%, 0% 100%, from( #f2f2f2ff ), to( #cbcbcbde ) );

//
// Animations
//
@keyframes 'msg-box-appear'
{
	from
	{
		opacity: 0.0;

		pre-transform-scale2d: 0.4;
	}

	to
	{
		opacity: 1.0;

		pre-transform-scale2d: 1.0;
	}
}

@keyframes 'msg-box-disappear'
{
	from
	{
		opacity: 1.0;

		pre-transform-scale2d: 1.0;
	}
	
	to
	{
		opacity: 0.0;
		pre-transform-scale2d: 0.4;
	}
}

@keyframes 'msgbox-button-focus'
{
	from
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdee ), to( #adafafe0 ) ); 
	}

	50%
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdff ), to( #bdbfbfff ) ); 
	}

	to
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdee ), to( #adafafe0 ) ); 
	}
}

//
// Styles
//
TenfootMsgBox, .TenfootMsgBox
{
	width: 100%;
	height: 100%;

	z-index: msgbox_zindex;

	transition-property: opacity, blur, saturation, transform, pre-transform-scale2d;
	transition-duration: 0.1s !immediate;
	transition-timing-function: bigpicture-ease-in-out;

	animation-name: msg-box-appear;
	animation-duration: MessageBoxAnimationDuration;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: 1;
}

#AddContentMenu .ContextMenuBodyCentered

{
	width: 550px;
	margin-top: 120px;
}


TenfootMsgBox.Destructing, .TenfootMsgBox.Destructing,
TenfootMsgBox.BehindAnotherMsgBox, .TenfootMsgBox.BehindAnotherMsgBox
{
	opacity: 0.0;
	pre-transform-scale2d: 0.4;
}

#MsgBoxBodyRegion, .MsgBoxBodyRegion
{
	width: 860px;
	max-height: 860px;
	padding: 40px 40px 40px 40px;
	background-color: message_box_bg;
	box-shadow: fill #00000044 -4px -4px 8px 8px;
	transform: translateX( 0px );
	transition-property: transform;
	transition-duration: 0.3s;

	vertical-align: center;
	horizontal-align: center;
	flow-children: down;
	border-radius: 3px;


}

.MsgBoxBodyRegion .StdTitle
 {
	 margin-bottom: 20px;
	font-weight: light;
	color: white;
 }

.MsgBoxBodyRegion .SubTitle
{
	font-size: 26px;
	font-family: platformfont;
	color: #c6d4df;
	margin-bottom: 20px;
	margin-top: -20px;
}

.BehindTextInputHandler .MsgBoxBodyRegion
{
	transform: translateX( 470px );
}


.HTMLVisible #MsgBoxBodyRegion
{
	width: 90%;
}

.MsgBoxBodyRegionWider
{ 
    width: 65%;
}

EditAppLaunchOptions.BehindTextInputHandler .MsgBoxBodyRegion
{
	transform: translateX( 460px );	
}

#MsgBoxHeader
{
	height: 65px;

	font-size: 44px;
	color: detailsdatalabel;
	font-family: platformfont;
	font-weight: light;
}

#MsgBoxButtonArea
{
	width: 100%;
	flow-children: down;
}

#MsgBoxDescriptionArea
{
	font-size: 32px;
	font-family: platformfont;
	color: #ffffff99;
	margin-top: 10px;
	width: 100%;
}

.DescriptionEmpty #MsgBoxDescriptionArea
{
	margin-top: 0px;
}

#MsgBoxButtons
{
	horizontal-align: left;
	vertical-align: bottom;
	margin-left: 0px;
	font-size: 42px;
	font-family: platformfont;
	color: #ffffffff;
	margin-top: 13px;
	margin-left: -7px;
	padding-left: 7px;
	padding-top: 7px;
	padding-bottom: 7px;

	flow-children: right;
}

#MsgBoxButtonsVertical
{
	horizontal-align: center;
	width: 100%;
	font-size: 42px;
	font-family: platformfont;
	color: #ffffffff;
	margin-top: 40px;

	flow-children: down;
}


#MsgBoxButtons Button, #MsgBoxButtonsVertical Button
{
	flow-children: right;
	margin-right: 10px;

	padding-top: 7px;

	width: fit-children;
}

#MsgBoxButtonsVertical Button
{
	margin-left: 0px;
	width: 100%;
}

#MsgBoxButtons Button Label, #MsgBoxButtonsVertical Button Label
{
	horizontal-align: left;
	font-size: 28px;
	text-overflow: clip;

	padding-right: 5px;
	transition-property: color, transform;
	transition-duration: 0.25s !immediate;
	transition-timing-function: bigpicture-ease-in-out;
}

#MsgBoxButtons Button:focus Label
{
	transform: translatex( 0px );
}

#MsgBoxButtonsVertical Button Label
{
	horizontal-align: left;
}

#MsgBoxButtons Button:hover, #MsgBoxButtonsVertical Button:hover
{
	pre-transform-scale2d: 1.03;
}

#MsgBoxButtons Button:focus Label,
#MsgBoxButtonsVertical Button:focus Label
{
	color: #161718f5;
}

#MsgBoxButtons Button:disabled
{
	opacity: 0.6;
	pre-transform-scale2d: 1.0;
	box-shadow: #00000000 -5px -5px 6px 10px;
	animation-name: none;
	blur: gaussian( 1.0 );
}

#MsgBoxButtons Button:disabled Label
{
	opacity: 0.4;
}

#OKButtonKey, #CancelButtonKey
{
	width: 60px;
	height: 60px;
	border-radius: 50%;
	border: 3px solid #ffffffff;
	margin-right: 10px;
}

#OKButtonKey Label, #CancelButtonKey Label
{
	horizontal-align: center;
	vertical-align: center;
	margin-top: -8px;
	font-size: 46px;
}

#MsgBoxHTML
{
	visibility: collapse;
	width: 100%;
	height: 500px;
	overflow: scroll;
}

.HTMLVisible #MsgBoxHTML
{
	visibility: visible;
}

#MsgBoxHTML:descendantfocus
{
	animation-name: main-button-glow-movement;
	animation-duration: 1.7s;
	animation-delay: 0.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;	
}

#MsgBoxHTML:hover
{
	box-shadow: box_shadow_on_color -4.5px -4.5px 16px 9px;
}

.TenfootMsgBox.ScreenSaverMode, TenfootMsgBox.ScreenSaverMode
{
	transition-property: opacity;
	transition-duration: 1.4s, 0.3s !immediate;
	transition-timing-function: linear;

	opacity: 0.0;
}

#MsgBoxHTMLContainer
{
	width: 100%;
}

.GameLaunchWarningColor
{
	color: #808000ff;
}