/* ============================ */
/* CSS for control sap.m/Input  */
/* Base theme                   */
/* ============================ */

:root {
	--sPopoverMaxWidth: 640;
}

.sapMListFocus .sapMLIBFocused {
	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
	outline-offset: -0.125rem;
}

.sapMInputDescriptionText {
	padding-left: 0.5rem;
	font-size: @sapFontSize;
	line-height: normal;
	color: @sapUiFieldTextColor;
	font-family: @sapUiFontFamily;
	font-style: normal;
	font-weight: normal;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.sapMInputWithDescription {
	white-space: nowrap;
}

.sapMInputDescriptionWrapper {
	display: inline-flex;
}

/* Input with description */
.sapMInputBaseHasEndIcons, .sapMInputBaseHasBeginIcons {
	.sapMInputDescriptionWrapper {
		max-width: ~"calc(100% - (@{_InputBase_Control_OneIcon_MinWidth}))";
		.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
			max-width: ~"calc(100% - (@{_InputBase_Control_OneIcon_State_MinWidth}))";
		}
	}
}

.sapMInputBaseHasEndIcons.sapMInputBaseHasBeginIcons {
	.sapMInputDescriptionWrapper {
		max-width: ~"calc(100% - (@{_InputBase_Control_TwoIcons_MinWidth}))";
		.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
			max-width: ~"calc(100% - (@{_InputBase_Control_TwoIcons_State_MinWidth}))";
		}
	}
}

.sapMInputBase:not(.sapMInputBaseHasEndIcons):not(.sapMInputBaseHasBeginIcons) {
	.sapMInputDescriptionWrapper {
		max-width: ~"calc(100% - (@{_InputBase_Control_MinWidth}))";
		.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
			max-width: ~"calc(100% - (@{_InputBase_Control_State_MinWidth}*2))";
		}
	}
}

.sapUiSizeCompact {
	.sapMInputBaseHasEndIcons, .sapMInputBaseHasBeginIcons {
		.sapMInputDescriptionWrapper {
			max-width: ~"calc(100% - (@{_InputBase_Control_OneIcon_MinWidth_Compact}))";
			.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
				max-width: ~"calc(100% - (@{_InputBase_Control_OneIcon_State_MinWidth_Compact}))";
			}
		}
	}

	.sapMInputBaseHasEndIcons.sapMInputBaseHasBeginIcons {
		.sapMInputDescriptionWrapper {
			max-width: ~"calc(100% - (@{_InputBase_Control_TwoIcons_MinWidth_Compact}))";
			.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
				max-width: ~"calc(100% - (@{_InputBase_Control_TwoIcons_State_MinWidth_Compact}))";
			}
		}
	}

	.sapMInputBase:not(.sapMInputBaseHasEndIcons):not(.sapMInputBaseHasBeginIcons) {
		.sapMInputDescriptionWrapper {
			max-width: ~"calc(100% - (@{_InputBase_Control_MinWidth_Compact}))";
			.sapMInputBaseState:not(.sapMInputBaseContentWrapperSuccess) & {
				max-width: ~"calc(100% - (@{_InputBase_Control_State_MinWidth_Compact}*2))";
			}
		}
	}
}

.sapMInputHighlight {
	font-weight: bold;
}

/* Overrides due to experimental flex layouting after IE drop */

.sapMInput.sapMInputBaseHasEndIcons .sapMInputBaseInner,
.sapMInput.sapMInputBaseHasBeginIcons .sapMInputBaseInner {
	width: auto;
	flex: 1
}

.sapMInput .sapMInputBaseContentWrapper {
	display: inline-flex;
}