/* Prettified by Source 2 Viewer 11.1.0.0 - https://valveresourceformat.github.io */

DOTAImbueAbilityPicker
{
	flow-children: down;
	horizontal-align: center;
	vertical-align: bottom;
	padding-bottom: 180px;
	opacity: 0.0;
	transform: translateY( 28px ) scale3d( 0.96, 0.96, 1 );
	transition-property: opacity, transform;
	transition-duration: 0.1s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	transition-delay: 0s;
	z-index: 9;
}

DOTAImbueAbilityPicker.ShowPicker
{
	opacity: 1.0;
	transform: none;
	transition-timing-function: ease-in;
}

.TooltipContents
{
	width: fit-children;
	flow-children: down;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #13171a ), to( #0b0f11 ) );
	border: 2px solid black;
	box-shadow: 0px 8px 40px -2px rgba(0, 0, 0, 0.6);
}

.Body
{
	flow-children: down;
	width: fit-children;
	padding: 10px 12px 8px;
}

.BottomArrow
{
	width: 36px;
	height: width-percentage( 50% );
	background-image: url("s2r://panorama/images/tooltips/tooltip_arrow.vsvg");
	background-texture-size: 72px 36px;
	background-size: cover;
	wash-color: #12181C;
	margin-top: -2px;
	horizontal-align: center;
	z-index: 1;
	visibility: collapse;
}

.OptionContainer
{
	flow-children: down;
	width: fit-children;
}

.SubheaderLabel
{
	horizontal-align: center;
}

@define OptionHeight: 72px;
#OptionList
{
	flow-children: right;
	width: fit-children;
	height: fit-children;
}

#OptionList .UpgradeOption
{
	flow-children: down;
	width: fit-children;
	height: fit-children;
	margin-bottom: 4px;
	overflow: noclip;
	border: 1px solid #bbbbbb;
	padding: 2px;
	margin: 2px;
	width: 150px;
	tooltip-position: top;
	transition-property: transform, brightness, background-color, border;
	transition-duration: 0.05s, 0.1s;
}

#OptionList .UpgradeOption.BlessingTaken
{
	brightness: .2;
}

#OptionList .UpgradeOption:hover:not(.BlessingTaken)
{
	brightness: 2.0;
}

#OptionList .UpgradeOption:active
{
	brightness: 1.5;
	transform: scale3d( 0.99, 0.99, 1 );
}

#OptionList .UpgradeOption #OptionImage
{
	width: OptionHeight;
	height: OptionHeight;
	border: 1px solid black;
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);
	transition-property: brightness;
	transition-duration: 0.2s;
	horizontal-align: center;
}

#OptionList .UpgradeOption #HeroImage
{
	width: 32px;
	height: 32px;
	transition-property: brightness;
	transition-duration: 0.2s;
	horizontal-align: center;
	visibility: collapse;
}

#OptionList .UpgradeOption.UpgradeTake #HeroImage
{
	visibility: visible;
}

#OptionList .UpgradeOption .OptionBorder
{
	width: 100%;
	height: 100%;
	ignore-parent-flow: true;
	border: 1px solid rgba(255, 255, 255, 0.03);
	border-brush: gradient( linear, 0% 0%, 0% 100%, from( white ), to( rgba(255, 255, 255, 0.6) ) );
	transition-property: border;
	transition-duration: 0.2s;
}

#OptionList .UpgradeOption .AbilityName
{
	font-family: titleFont;
	font-size: 10px;
	line-height: 1.2;
	color: #e1e1e1;
	vertical-align: middle;
	padding: 0px 8px;
	text-overflow: shrink;
	letter-spacing: 0.5px;
	text-shadow: 0px 1px 4px #00000090;
	text-transform: uppercase;
	font-weight: semi-bold;
	vertical-align: center;
	text-overflow: shrink;
	horizontal-align: center;
}