/* Requires msgbox.css.. so add that first */

//
// Animations
//
@keyframes 'links-and-more-button-focus'
{
	from
	{
		background-color: gradient( linear, 0% 0%, 100% 100%, from( #66c0f4ff ), to( #b6e1faff ) );
	}

	50%
	{
		background-color: gradient( linear, 0% 0%, 100% 100%, from( #66c0f4ff ), to( #1483baff ) );
	}

	to
	{
		background-color: gradient( linear, 0% 0%, 100% 100%, from( #66c0f4ff ), to( #b6e1faff ) );
	}
}


//
// Button styles
//
SearchStoreResult
{
	width: 100%;
	padding: 4px 0px 4px 3px;
	margin: 0px 14px 6px 0px;

	flow-children: right;

	color: applabelselected;
	background-color: transparent_module;

	transition-property: background-color, color, box-shadow;
	transition-timing-function: bigpicture-ease-in-out;
}

SearchStoreResult Label
{
	font-family: platformfont;
	font-size: 20px;
	font-weight: bold;
	color: applabel;
	text-overflow: clip;
	width: 100%;
}

SearchStoreResult:focus Label
{
	color: #072e47;
	text-overflow: clip;
	width: 100%;
}	

SearchStoreResult:hover
{
	box-shadow: #eeeeee60 -3px -3px 6px 6px;
}

SearchStoreResult:focus
{
	transition-duration: 0.4s !immediate;

	color: #161718f5;
	background-color: button_focus_color;

	animation-name: button-focus;
	animation-duration: 1.7s;
	animation-delay: 0.4s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

TextEntry {
	font-size: 38px;
}

#PlatformWindows,
#PlatformMac,
#PlatformLinux,
#PlatformStreamingVideo
{
	visibility: collapse;
}

.AvailableWindows #PlatformWindows,
.AvailableMac #PlatformMac,
.AvailableLinux #PlatformLinux,
.AvailableStreamingVideo #PlatformStreamingVideo
{
	visibility: visible;
}


//
// Search dialog
//
SearchDialog
{
	width: 100%;
	height: 100%;
	z-index: 1001;

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

SearchDialog.Destructing
{
	opacity: 0.0;

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

.DialogRegion
{
	width: 800px;
	height: 804px;
	align: center center;
	padding: 40px;
	background-color: message_box_bg;
	flow-children: down;

	transition-property: transform;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;


	box-shadow: fill #00000044 -4px -4px 8px 8px;


}

.BehindTextInputHandler .DialogRegion
{
//	transform: translatex( 470px );
	opacity: 0.0;
	animation-name: none;
}

.InputRow
{
	width: 100%;
}

.Header {
	font-size: 54px;
	font-family: platformfont;
	color: detailsdatalabel;
	margin-bottom: 8px;
}

LoadingThrobber
{
	opacity: 0.0;
	width: 40px;
	height: 40px;
	align: right center;
	margin-right: 30px;
}

.Searching LoadingThrobber
{
	opacity: 1.0;
}

#Input
{
	height: 70px;
	width: 100%;
}

#Input:descendantfocus
{

}


.SearchDivider
{
	visibility: collapse;
}

.ShowSearchDivider .SearchDivider
{
	background-color: rule_color;
	width: 100%;
	height: 6px;
	visibility: visible;
}

#SearchResults
{
	flow-children: down;
	overflow: squish scroll;
	background-color: #0f283d;
	opacity: 1.0;
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	opacity-mask-scroll-up: url( "file://{images}/friends/friends_list_mask_fade_top.png" );
	opacity-mask-scroll-down: url( "file://{images}/friends/friends_list_mask_fade_bottom.png" );
	opacity-mask-scroll-up-down: url( "file://{images}/friends/friends_list_mask_fade_both.png" );

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

.ShowSearchDivider #SearchResults
{
	padding: 8px 0px 8px 8px;
}

.SearchResultsArea
{
	width: 100%;
	height: 100%;
	padding: 10px;
	margin: -10px;
}

#SearchResultsMessageWrapper
{
	opacity: 0.0;
	align: center top;
	margin: 40px 12px 0px 12px;
	flow-children: down;
	height: fit-children;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

#UnfilterSearchWrapper
{
	opacity: 0.0;
	vertical-align: center;
	horizontal-align: center;
	flow-children: down;
	height: fit-children;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

.ShowSearchResultsMessage #SearchResultsMessageWrapper
{
	opacity: 1.0;
}

.ShowUnfilterSearchMessage #UnfilterSearchWrapper
{
	opacity: 1.0;
}

.SearchResultsLabel
{
	font-size: 24px;
	font-family: platformfont;
	text-align: center;
	color: white;
	margin: 0px 30px;
}

#UnfilterSearchWrapper .SearchResultsLabel
{
	font-style: italics;
	color: #707c8b;
}

.SearchResultsIconWrapper
{
	flow-children: right;
	horizontal-align: center;
}

.SearchResultsIcon
{
	visibility: collapse;
	width: 50px;
	height: 50px;
	color: applabelsolid;
	horizontal-align: left;
	vertical-align: center;
}

#UnfilterSearchWrapper .SearchResultsIcon
{
	wash-color: #707c8b;
}

.ShowWindowsIcon #OSIcon
{
	background-image: url( "file://{images}/store/icon_windows_storefront.png" );
	visibility: visible;
}

.ShowOSXIcon #OSIcon
{
	background-image: url( "file://{images}/store/icon_mac_storefront.png" );
	visibility: visible;
}

.ShowLinuxIcon #OSIcon
{
	background-image: url( "file://{images}/store/icon_steamos_storefront.png" );
	visibility: visible;
}

.ShowStreamingVideoIcon #OSIcon
{
	background-image: url( "file://{images}/store/icon_streamingvideo_storefront.png" );
	visibility: visible;
}

.ShowWindowsIcon #OSIconWindows
{
	background-image: url( "file://{images}/store/icon_windows_storefront.png" );
	visibility: visible;
}

.ShowOSXIcon #OSIconOSX
{
	background-image: url( "file://{images}/store/icon_mac_storefront.png" );
	visibility: visible;
}

.ShowLinuxIcon #OSIconLinux
{
	background-image: url( "file://{images}/store/icon_steamos_storefront.png" );
	visibility: visible;
}

.ShowStreamingVideoIcon #OSIconStreamingVideo
{
	background-image: url( "file://{images}/store/icon_streamingvideo_storefront.png" );
	visibility: visible;
}

.ShowKeyboardIcon #ControllerIcon
{
	background-image: url( "file://{images}/store/icon_keyboard_storefront.png" );
	visibility: visible;
	margin: 0px 5px 0px 5px;
}

.ShowGamepadIcon #ControllerIcon
{
	background-image: url( "file://{images}/store/icon_fullcontroller_storefront.png" );
	visibility: visible;
	margin: 0px 5px 0px 5px;
}

.ShowSteampadIcon #ControllerIcon
{
	background-image: url( "file://{images}/store/icon_steamcontroller_storefront.png" );
	visibility: visible;
	margin: 0px 5px 0px 5px;
}

.CapsuleControllerSupport
{
	visibility: collapse;
}

#IconController
{
	visibility: visible;
	background-image: url( "file://{images}/store/icon_keyboard.png" );
	background-size: contain;
	background-repeat: no-repeat;

	width: 45px;
	height: 45px;
	vertical-align: center;
	margin-left: 6px;
}

.SteamPad #IconController
{
	visibility: visible;
	background-image: url( "file://{images}/store/icon_legacycontroller.png" );
	background-size: contain;
	background-repeat: no-repeat;

	width: 45px;
	height: 45px;
	vertical-align: center;
	margin-left: 4px;
}


.FullController #IconController
{
	visibility: visible;

	background-image: url( "file://{images}/controller_support_full.png" );
	background-size: contain;
	background-repeat: no-repeat;

	width: 40px;
	height: 40px;
	margin-left: 0px;
}

.SteamPad.FullController #IconController
{
	visibility: visible;

	background-image: url( "file://{images}/controller_support_native.png" );
	background-size: contain;
	background-repeat: no-repeat;

	width: 40px;
	height: 40px;
	margin-left: 4px;
	margin-top: 2px;
}


//
// Store Result
//
#StoreHeader
{
	width: 184px;
	height: 69px;
	margin: 8px;
	//box-shadow: #00000033 -2px -2px 8px 4px;
}

.StoreRightColumn
{
	flow-children: down;
	width: fill-parent-flow( 1.0 );
}
.details_ctn
{
	flow-children: down;
	width: 100%;
}
.bottomrow
{
	width: 100%;
	flow-children: right;
}
.bottomrow #StoreResultPrice
{
	width: 200px;
	margin-top: 10px;
}

#StoreResultName
{
	margin-top: 4px;
	font-size: 28px;
	white-space: nowrap;
	font-weight: light;
	color: #67c1f5ff;
}
SearchStoreResult:focus #StoreResultName
{
color: #072e47;
}

.DetailsIconRow
{
	flow-children: right;
	horizontal-align: right;
	margin: 0px 10px;
	vertical-align: top;
	wash-color: #171717f5;
	visibility: collapse;
	transition-property: opacity;
	transition-delay: 0.0s;
	transition-duration: 0.0s;
}

SearchStoreResult:focus .DetailsIconRow
{
	visibility: visible;
}

SearchStoreSection
{
	width: 100%;
	height: 52px;
	padding: 0px 18px;
	margin: 5px 0px;
	background-color: rule_color;
}

SearchStoreSection Label
{
	font-family: platformfont;
	font-size: 26px;
	color: applabelsolid;
	vertical-align: center;
}


SearchStoreSection #IconWrapper
{
	visibility: collapse;
}

SearchStoreSection #IconWrapper
{
	visibility: visible;
	flow-children: right;
	horizontal-align: right;
	vertical-align: center;
	margin-right: 14px;
}

SearchStoreSection #IconWrapper .ItemIcon
{
	horizontal-align: center;
	vertical-align: center;
	background-repeat: no-repeat;
	width: 42px;
	height: 42px;
	//margin-top: -6px;
	margin-right: -4px;
}

SearchStoreSection .ItemIcon
{
	visibility: collapse;
}

SearchStoreSection .ItemIcon
{
	wash-color: #a6afb9;
	
	transition-property: wash-color;
	transition-timing-function: bigpicture-ease-in-out;
	transition-duration: 0.15s;
}

SearchStoreSection.WindowsIcon #WindowsIcon
{
	background-image: url( "file://{images}/store/icon_platform_win.png" );
	visibility: visible;
}

SearchStoreSection.OSXIcon #OSXIcon
{
	background-image: url( "file://{images}/store/icon_platform_mac.png" );
	visibility: visible;
}

SearchStoreSection.LinuxIcon #LinuxIcon
{
	background-image: url( "file://{images}/store/icon_platform_linux.png" );
	visibility: visible;
}

SearchStoreSection.StreamingVideo #StreamingVideoIcon
{
	background-image: url( "file://{images}/store/icon_platform_streamingvideo.png" );
	visibility: visible;
}

SearchStoreSection.FullController #ControllerIcon
{
	background-image: url( "file://{images}/store/icon_fullcontroller.png" );
	margin-left: 4px;
	visibility: visible;
}

SearchStoreSection.SteamPad #ControllerIcon
{
	background-image: url( "file://{images}/store/icon_steamcontroller.png" );
	margin-left: 4px;
	margin-top: -4px;
	visibility: visible;
}