/* ============================= */
/* CSS for control sap.m/Avatar  */
/* Horizon theme                 */
/* ============================= */

@_sap_m_Avatar_Font_Size_XL: 3rem;
@_sap_m_Avatar_Font_Size_L: 2.25rem;
@_sap_m_Avatar_Font_Size_M: 1.5rem;
@_sap_m_Avatar_Font_Size_S: 1.125rem;
@_sap_m_Avatar_Font_Size_XS: 1rem;

.sapFAvatarSquare {
	border-radius: var(--sapElement_BorderCornerRadius);

	.sapFAvatarImageHolder {
		border-radius: var(--sapElement_BorderCornerRadius);
	}
}

.sapFAvatar.sapFAvatarInitials > .sapFAvatarInitialsHolder {
	font-size: inherit;
}

.sapFAvatarFocusable.sapMAvatarPressed {
	box-shadow: 0 0 0 var(--sapButton_BorderWidth) var(--sapButton_Selected_BorderColor);

	&:hover {
		box-shadow: 0 0 0 var(--sapButton_BorderWidth) var(--sapButton_Selected_Hover_BorderColor);
	}
}

.sapFAvatarFocusable:focus {
	outline-offset: 0.125rem;

	&.sapFAvatarSquare {
		outline-offset: 0.125rem;
	}
}

.sapFAvatarColorTileIcon {
	background-color: var(--sapTile_Background);
	color: var(--sapTile_IconColor);
	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);

	.sapFAvatarInitialsHolder {
		color: currentColor;
	}
}

.sapFAvatarColorPlaceholder {
	background-color: var(--sapContent_ImagePlaceholderBackground);
	color: var(--sapContent_ImagePlaceholderForegroundColor);
	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);

	.sapFAvatarInitialsHolder {
		color: currentColor;
	}
}

.sapFAvatarColorTransparent {
	background-color: var(--sapAvatar_Lite_Background);
	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
}

.generateColor (@accentIndex) {
	@css-selector: ~"sapFAvatarColorAccent@{accentIndex}"; // Create the css selector string
	@background-param: ~"sapUiAvatar@{accentIndex}Background"; // Build the color param which is a sapUiAccent
	@color-param: ~"sapUiAvatar@{accentIndex}TextColor";
	@hover-color: ~"sapUiAvatar@{accentIndex}HoverBackground";

	// Build the real CSS selector.
	// The output would be something like this: .sapFAvatar.sapFAvatarColorAccent6 {background-color: #0092d1;}
	.@{css-selector} {
		background-color: @@background-param;
		&.sapFAvatarImage.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover,
		&.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover {
			background-color: @@hover-color;
			box-shadow: @_sap_m_Avatar_Hover_Box_Shadow_Offset var(--sapAvatar_Hover_BorderColor);
		}
	}

	.@{css-selector}.sapFAvatarIcon,
	.@{css-selector} .sapFAvatarInitialsHolder {
		color: contrast(@@background-param, @@color-param, @sapContent_ContrastTextColor, @sapContent_ContrastTextThreshold);
	}
}