/* ================================ */
/* CSS for control sap.ushell/Tile  */
/* Morning Horizon theme            */
/* ================================ */

/* General Tile Colors */
@_sap_ushell_Tile_TextColor: var(--sapTile_TextColor);

/* Tile Footer (plus button in tile catalog) */
@_sap_ushell_Tile_FooterBorder: var(--sapShell_BorderColor);
@_sap_ushell_Tile_FooterIconColor: var(--sapTile_TextColor);
@_sap_ushell_Tile_SpacingXS: 0.475rem;
@_sap_ushell_Tile_SpacingS: 0.7rem;
@_sap_ushell_Tile_Spacing: 0.7rem;

.sapUshellTile {

	&.showTileActionsIcon .sapUshellTileActionsIconClass.sapUiIcon,
	.sapUshellTileActionsIconClass.sapUiIcon {
		color: var(--sapBrandColor);
	}

	background: var(--sapTile_Background);
	border: none;
	color: @_sap_ushell_Tile_TextColor;

	footer {
		text-align: @_sap_ushell_Tile_FooterTextAlignment;

		& > * {
			background: @_sap_ushell_Tile_FooterBorder;

			.sapUiIcon {
				line-height: @_sap_ushell_Tile_FooterLineHeight;
				font-size: 1rem;
				color: @_sap_ushell_Tile_FooterIconColor;
				position: @_sap_ushell_Tile_FooterPosition;
				top: @_sap_ushell_Tile_FooterPositionTop;
			}

			.sapMBtnInner {
				height: 2rem;
				border: none;
				box-shadow: inset 0 2px 0.19rem 0 rgba(0, 0, 0, 0.1);
			}

			&:first-child {
				border-bottom-left-radius: @_sap_ushell_Tile_FooterCornerRadius;
			}

			&:last-child {
				border-bottom-right-radius: @_sap_ushell_Tile_FooterCornerRadius;
			}
		}
	}

	&.sapUshellFeedTileBG {
		background-color: transparent;
	}
}

.sapUshellTileActionDivCenter {
	background: var(--sapTile_Background);
}

.sapUiMedia-Std-Tablet .sapUshellTileInner,
.sapUiMedia-Std-Phone .sapUshellTileInner {

	a.sapUshellTileInner:visited {
		color: @_sap_ushell_Tile_TextColor;
	}
}

.sapUshellTileDeleteIconOuterClass {
	background: var(--sapButton_Background);
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
	border: 1px solid var(--sapButton_BorderColor);
}

.sapUshellTileDeleteIconInnerClass {
	color: var(--sapButton_IconColor);
}

.sapUshellTileDeleteClickArea:hover {
	background: var(--sapButton_Hover_Background);
	border: 1px solid var(--sapButton_Hover_BorderColor);
}

.sapUshellTileDeleteClickArea:active {
	background: var(--sapButton_Active_Background);
	border: 1px solid var(--sapButton_Active_BorderColor);

	.sapUshellTileDeleteIconInnerClass {
		color: var(--sapButton_Active_TextColor);
	}
}

.sapUshellTileActionsIconClass.sapUiIcon {
	color: var(--sapBrandColor);
	background: var(--sapShell_Background);
}

.sapUshellTile:hover .sapUshellTileActionIconDivBottom {
	color: var(--sapBrandColor);
}

.sapUshellTile:focus::after {
	border-color: var(--sapContent_FocusColor);
	border-width: 0.125rem;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	border-radius: var(--sapTile_BorderCornerRadius);
	border-style: solid;
}

.sapUshellTile .sapUshellTileBase {
	border: 1px solid var(--sapTile_Background);
	background: var(--sapTile_Background);
}

.sapUshellTileFooterInfoNegative {
	color: var(--sapNegativeElementColor);
}

.sapUshellTileFooterInfoNeutral {
	color: var(--sapNeutralElementColor)
}

.sapUshellTileFooterInfoPositive {
	color: var(--sapPositiveElementColor)
}

.sapUshellTileFooterInfoCritical {
	color: var(--sapCriticalElementColor);
}

/* New Design */
.sapUshellTile,
.sapUshellTileWrapper,
.sapUshellTileInner,
.sapUshellTileBase,
.sapUshellInner .sapUshellTile-placeholder,
.sapUshellInner .sapUshellLinkTile-placeholder {
	border-radius: var(--sapTile_BorderCornerRadius);
}