.ui5-valuestatemessage-popover {
	border-radius: var(--_ui5_value_state_message_popover_border_radius);
	box-shadow: var(--_ui5_value_state_message_popover_box_shadow);
}

.ui5-input-value-state-message-icon {
	width: var(--_ui5_value_state_message_icon_width);
	height: var(--_ui5_value_state_message_icon_height);
	display: var(--_ui5_input_value_state_icon_display);
	position: absolute;
	padding-right: 0.375rem;
}

.ui5-valuestatemessage-root .ui5-input-value-state-message-icon {
	left: var(--_ui5_input_value_state_icon_offset);
}

.ui5-input-value-state-message-icon[name="error"] {
	color: var(--sapNegativeElementColor);
}

.ui5-input-value-state-message-icon[name="alert"] {
	color: var(--sapCriticalElementColor);
}

.ui5-input-value-state-message-icon[name="success"] {
	color: var(--sapPositiveElementColor);
}

.ui5-input-value-state-message-icon[name="information"] {
	color: var(--sapInformativeElementColor);
}

.ui5-valuestatemessage-root {
	box-sizing: border-box;
	display: inline-block;
	color: var(--sapTextColor);
	font-size: var(--sapFontSmallSize);
	font-family: var(--sapFontFamily);
	height: auto;
	padding: var(--_ui5_value_state_message_padding);
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 6.25rem;
	border: var(--_ui5_value_state_message_border);
	line-height: var(--_ui5_value_state_message_line_height);
}

[ui5-responsive-popover] .ui5-valuestatemessage-header, [ui5-popover] .ui5-valuestatemessage-header  {
	min-height: var(--_ui5_value_state_message_popover_header_min_height);
	min-width: var(--_ui5_value_state_message_popover_header_min_width);
	max-width: var(--_ui5_value_state_message_popover_header_max_width);
	width: var(--_ui5_value_state_message_popover_header_width);
}

[ui5-responsive-popover] .ui5-valuestatemessage-header {
	padding: var(--_ui5_value_state_header_padding);
	border: var(--_ui5_value_state_header_border);
	border-bottom: var(--_ui5_value_state_header_border_bottom);
	flex-grow: 1;
	position: relative;
}

.ui5-valuestatemessage--success {
	background: var(--sapSuccessBackground);
}

.ui5-valuestatemessage--warning {
	background: var(--sapWarningBackground);
}

.ui5-valuestatemessage--error {
	background: var(--sapErrorBackground);
}

.ui5-valuestatemessage--information {
	background: var(--sapInformationBackground);
}

.ui5-responsive-popover-header:focus {
	outline-offset: var(--_ui5_value_state_header_offset);
	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
}

.ui5-valuestatemessage-popover::part(header),
.ui5-valuestatemessage-popover::part(content) {
	padding: 0;
}

.ui5-valuestatemessage-popover::part(header),
.ui5-valuestatemessage-popover::part(footer) {
	min-height: 0;
}

.ui5-valuestatemessage-popover::part(header),
.ui5-popover-with-value-state-header::part(header),
.ui5-popover-with-value-state-header-phone::part(header) {
	margin-bottom: 0;
}

.ui5-popover-with-value-state-header-phone .ui5-valuestatemessage-root {
	padding: var(--_ui5_value_state_message_padding_phone);
	width: 100%;
}

.ui5-popover-with-value-state-header-phone .ui5-input-value-state-message-icon {
	left: var(--_ui5_value_state_message_icon_offset_phone);
}

.ui5-popover-with-value-state-header-phone .ui5-valuestatemessage-header {
	position: relative;
	flex: none;
	top: 0;
	left: 0;
	max-width: 100%;
}

.ui5-popover-with-value-state-header-phone::part(content) {
	padding: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.ui5-popover-with-value-state-header-phone [ui5-list] {
	overflow: auto;
}

/* ValueState Header bottom border color in Responsive Popover and Dialog */
[ui5-responsive-popover] .ui5-valuestatemessage--error {
	box-shadow: var(--_ui5_value_state_header_box_shadow_error);
}

[ui5-responsive-popover] .ui5-valuestatemessage--information {
	box-shadow: var(--_ui5_value_state_header_box_shadow_information);
}

[ui5-responsive-popover] .ui5-valuestatemessage--success {
	box-shadow: var(--_ui5_value_state_header_box_shadow_success);
}

[ui5-responsive-popover] .ui5-valuestatemessage--warning {
	box-shadow: var(--_ui5_value_state_header_box_shadow_warning);
}

/* Unset bottom border box-shadow in a specific case when the value state message is displayed on desktop in a popover and the suggestions list is empty */
[ui5-responsive-popover].ui5-popover-with-value-state-header .ui5-valuestatemessage-root:has(+[ui5-list]:empty) {
	box-shadow: none;
}