/* ============================= */
/* CSS for control sap.m/Button  */
/* Quartz Dark theme             */
/* ============================= */

@_sap_m_Button_EmphasizedFocusColor: var(--sapContent_FocusColor);

.sapMBtn {
	height: 2.75rem;
}

.sapMBtnEmphasized {
	font-weight: var(--sapButton_Emphasized_FontWeight);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnEmphasized:not(.sapMBtnActive),
span.sapMBtnInner.sapMBtnEmphasized {
	text-shadow: none;
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnEmphasized:not(.sapMBtnActive) {
	color: var(--sapButton_Emphasized_Hover_TextColor);
	font-weight: var(--sapButton_Emphasized_FontWeight);

	.sapMBtnIcon {
		color: var(--sapButton_Emphasized_Hover_TextColor);
	}
}

/* --------------------- */
/* Inner area            */
/* --------------------- */
.sapMBtnInner {
	font-size: @sapMFontMediumSize;
	height: var(--sapElement_Height);
	min-width: 2.25rem;
	margin: 0;
	padding: 0;
	text-align: center;
	position: relative;
	border-radius: var(--sapButton_BorderCornerRadius);
	text-shadow: none;

	&.sapMBtnCritical,
	&.sapMBtnNegative,
	&.sapMBtnSuccess,
	&.sapMBtnNeutral {
		font-weight: bold;
	}
}

/* ------------------- */
/* Button Icon         */
/* ------------------- */
.sapMBtnIcon.sapUiIcon {
	width: 2.125rem;
	font-size: 1rem;
	line-height: 2.125rem;
}

.sapMBtnInner.sapMBtnText .sapMBtnIcon::before {
	width: 1rem;
	text-align: center;
	display: inline-block;
}

.sapMBtnInner.sapMBtnText .sapMBtnIcon {
	width: 1rem;
	padding-right: 0.375rem;
	text-align: center;
}

.sapMBtnInner.sapMBtnText .sapMBtnIcon.sapMBtnIconRight {
	padding-right: 0;
	padding-left: 0.375rem;
}

.sapMBtnInner.sapMBtnText .sapMBtnIcon.sapMImg {
	height: 2.25rem;
	width: auto;
}

.sapMBtnInner .sapMBtnIcon.sapMImg {
	max-height: 2.125rem;
}

.sapUiSizeCompact .sapMBtnInner .sapMBtnIcon.sapMImg {
	max-height: 1.5rem;
}

/* ------------------- */
/* Content area        */
/* ------------------- */
.sapMBtnContent {
	line-height: 2.125rem;
}

.sapMBtnInner.sapMBtnText {
	padding-left: 0.5625rem;
	padding-right: 0.5625rem;
}

.sapMBtnIconLeft + .sapMBtnIconRight,
.sapMBtnIconLeft + .sapMBtnIconLeft {
	padding-right: 0.5625rem;
}

.sapMBtnInner.sapMBtnGhost {
	color: var(--sapButton_TextColor);
	border: 0.0625rem solid var(--sapButton_BorderColor);
	background: var(--sapButton_Lite_Background);
	text-shadow: none;
}

.sapMBtnGhost.sapMBtnHoverable.sapMBtnActive {
	color: var(--sapButton_Active_TextColor);
	border-color: var(--sapButton_Active_BorderColor);
	background: var(--sapButton_Active_Background);
}

.sapUiSizeCompact {

	.sapMBtnIcon {
		margin-left: 0;
		margin-right: 0;
	}

	.sapMBtnInner.sapMBtnText {
		padding-left: 0.4375rem;
		padding-right: 0.4375rem;
	}

	.sapMBtnBack.sapMBtnIconFirst:not(.sapMBtnText) > .sapMBtnIconLeft:not(:last-child),
	.sapMBtnIconLeft + .sapMBtnIconRight,
	.sapMBtnIconLeft + .sapMBtnIconLeft,
	.sapMBtnInner .sapMBtnIcon :not(img) {
		padding-right: 0.4375rem;
	}

	.sapMBtnInner > img {
		margin: 0;
		padding: 0;
	}
}

/* ---------------------------------------------------------------------*/
/* Custom focus outline:                                                */
/* ---------------------------------------------------------------------*/

html.sap-desktop .sapMBtn:focus > .sapMFocusable {
	outline: 0.0625rem dotted var(--sapContent_FocusColor);
	outline-offset: -0.1875rem;
}

html.sap-desktop .sapMBtn:focus > .sapMBtnActive.sapMFocusable {
	outline-color: var(--sapContent_ContrastFocusColor);
}

html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable {
	outline: .0625rem solid var(--sapContent_FocusColor);
}

html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable :not(.sapMBadgeIndicator) ::after {
	content: "";
	position: absolute;
	box-sizing: border-box;
	left: 0.0625rem;
	top: 0.0625rem;
	right: 0.0625rem;
	bottom: 0.0625rem;
	border: .0625rem dotted var(--sapContent_ContrastFocusColor);
	pointer-events: none
}

.sapMTB-Transparent-CTX .sapMBtnInner:not(.sapMToggleBtnPressed):not(.sapMBtnEmphasized):not(.sapMBtnAccept):not(.sapMBtnAttention):not(.sapMBtnReject):not(.sapMBtnActive):not(.sapMBtnGhost) {
	border-color: var(--sapButton_Lite_BorderColor);
}

/* ---------------------------------------------------------------------*/
/* Disabled, hover and active states:                                   */
/* ---------------------------------------------------------------------*/

.sapMBtnDisabled {
	opacity: var(--sapContent_DisabledOpacity);
}

/* ------------------------------------------------ */
/* Buttons in a Bar                                 */
/* (add separators, remove top/bottom border)       */
/* ------------------------------------------------ */

.sapMIBar.sapMTB-Info-CTX {
	.sapMBtn .sapMBtnInner.sapMBtnTransparent {
		& > .sapMBtnContent,
		& > .sapMBtnIcon {
			color: var(--sapButton_Active_TextColor);
		}
	}
}

.sapMIBar.sapMTB-Info-CTX.sapMTBInactive {
	.sapMBtn .sapMBtnInner.sapMBtnTransparent {
		& > .sapMBtnContent,
		& > .sapMBtnIcon {
			color: var(--sapButton_Lite_Hover_TextColor);
		}
	}
}

.sapMIBar-CTX .sapMBtnInner,
.sapMBar .sapMBtnInner,
.sapMHeader-CTX .sapMBtnInner,
.sapMFooter-CTX .sapMBtnInner {
	background: var(--sapButton_Lite_Background);
	border-color: var(--sapButton_Lite_BorderColor);
}

.sapMIBar-CTX .sapMBtnInner,
.sapMBar .sapMBtnInner {

	&.sapMBtnCritical {
		background: var(--sapCriticalElementColor);
		border-color: var(--sapCriticalElementColor);
	}

	&.sapMBtnNegative {
		background: var(--sapNegativeElementColor);
		border-color: var(--sapNegativeElementColor);
	}

	&.sapMBtnNeutral {
		background: var(--sapButton_Neutral_Background);
		border-color: var(--@sapButton_Neutral_BorderColor);
	}

	&.sapMBtnSuccess {
		background: var(--sapPositiveElementColor);
		border-color: var(--sapPositiveElementColor);
	}
}

.sapMIBar-CTX .sapMBtnInner.sapMBtnGhost,
.sapMBar .sapMBtnInner.sapMBtnGhost,
.sapMHeader-CTX .sapMBtnInner.sapMBtnGhost,
.sapMFooter-CTX .sapMBtnInner.sapMBtnGhost {
	background: var(--sapButton_Lite_Background);
	border-color: fade(@sapUiButtonLiteTextColor, 50);
}

.sapMSubHeader-CTX .sapMBtnInner {
	background: var(--sapButton_Lite_Background);
}

.sapMBar-CTX :not(.sapMBtnDisabled) > .sapMBtnInner.sapMBtnActive,
.sapMBar-CTX :not(.sapMBtnDisabled) > .sapMBtnInner.sapMBtnTransparent.sapMBtnHoverable.sapMBtnActive,
.sapMBar-CTX :not(.sapMBtnDisabled) > .sapMBtnInner.sapMBtnGhost.sapMBtnHoverable.sapMBtnActive {
	background-color: var(--sapButton_Active_Background);
}

.sapMBtn:hover > .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed),
.sapMIBar-CTX .sapMBtn:hover > .sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed) {
	background-color: var(--sapButton_Lite_Hover_Background);
	border-color: var(--sapButton_Lite_Hover_BorderColor);
	color: var(--sapButton_Lite_Hover_TextColor);

	bdi {
		color: var(--sapButton_Lite_Hover_TextColor);
	}
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnGhost.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed) {
	background: var(--sapButton_Hover_Background);
	border-color: var(--sapButton_Hover_BorderColor);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable:not(.sapMBtnActive) {
	border-color: transparent;
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnAccept:not(.sapMBtnActive) {
	background-color: var(--sapButton_Accept_Hover_Background);
	border-color: var(--sapButton_Accept_Hover_BorderColor);
	color: var(--sapButton_Accept_TextColor);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnAttention:not(.sapMBtnActive) {
	background-color: var(--sapButton_Attention_Hover_Background);
	border-color: var(--sapButton_Attention_Hover_BorderColor);
	color: var(--sapButton_Attention_Hover_TextColor);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnReject:not(.sapMBtnActive) {
	background-color: var(--sapButton_Reject_Hover_Background);
	border-color: var(--sapButton_Reject_Hover_BorderColor);
	color: var(--sapButton_Reject_TextColor);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnEmphasized:not(.sapMBtnActive) {
	background-color: var(--sapButton_Emphasized_Hover_Background);
	border-color: var(--sapButton_Emphasized_Hover_BorderColor);
	color: var(--sapButton_Emphasized_TextColor);
	text-shadow: 0 0 0.125rem var(--sapButton_Emphasized_TextShadow);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnCritical:not(.sapMBtnActive) {
	background-color: darken(@sapUiCriticalElement, 7);
	border-color: darken(@sapUiCriticalElement, 7);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnNegative:not(.sapMBtnActive) {
	background-color: darken(@sapUiNegativeElement, 7);
	border-color: darken(@sapUiNegativeElement, 7);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnSuccess:not(.sapMBtnActive) {
	background-color: darken(@sapUiPositiveElement, 7);
	border-color: darken(@sapUiPositiveElement, 7);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnNeutral:not(.sapMBtnActive) {
	background-color: var(--sapButton_Neutral_Hover_Background);
	border-color: var(--sapButton_Neutral_Hover_BorderColor);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnCritical.sapMBtnActive {
	background-color: darken(@sapUiCriticalElement, 10);
	border-color: darken(@sapUiCriticalElement, 10);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnNegative.sapMBtnActive {
	background-color: darken(@sapUiNegativeElement, 10);
	border-color: darken(@sapUiNegativeElement, 10);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnSuccess.sapMBtnActive {
	background-color: darken(@sapUiPositiveElement, 10);
	border-color: darken(@sapUiPositiveElement, 10);
}

.sapMIBar-CTX .sapMBtn:hover > .sapMBtnHoverable.sapMBtnNeutral.sapMBtnActive {
	background-color: var(--sapButton_Neutral_Active_Background);
	border-color: var(--sapButton_Neutral_Active_BorderColor);
}

/* Separators between buttons in a footer */
.sapMFooter-CTX .sapMBtnInner :not(.sapMBtnDisabled),
html.sap-desktop .sapMFooter-CTX .sapMBtnInner :not(.sapMBtnDisabled) {
	border-color: var(--sapButton_Lite_BorderColor);
}

.sapMIBar-CTX .sapMBtnTransparent:not(.sapMBtnDisabled):not(.sapMToggleBtnPressed) {
	text-shadow: none;
	border-color: var(--sapButton_Lite_BorderColor);
}

/* active transparent button in a footer */
.sapMIBar-CTX.sapMFooter-CTX :not(.sapMBtnDisabled) {

	.sapMBtnTransparent.sapMBtnActive {
		background-color: var(--sapButton_Lite_Active_Background);
		color: var(--sapButton_Active_TextColor);
		border-color: var(--sapButton_Lite_Active_BorderColor);
	}
}

.sapMIBar-CTX .sapMBtnDisabled,
.sapMIBar-CTX .sapMBtnDisabled .sapMBtnContent > .sapMBtnIcon {
	color: @sapUiButtonHeaderDisabledTextColor;
	text-shadow: none;
}

.sapMIBar-CTX.sapMHeader-CTX :not(.sapMBtnDisabled) > .sapMBtnActive,
.sapMIBar-CTX.sapMFooter-CTX :not(.sapMBtnDisabled) > .sapMBtnActive {
	background-color: var(--sapButton_Active_Background);
	color: var(--sapButton_Active_TextColor);
	text-shadow: none;
}

.sapUiSizeCompact .sapMBar-CTX .sapMBtnInner.sapMBtnGhost:not(.sapMBtnDisabled) {
	background: var(--sapButton_Lite_Background);
	border: 0.0625rem solid var(--sapButton_BorderColor);
}

html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnAccept {
	border-color: var(--sapButton_Accept_BorderColor);
}

html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnAttention {
	border-color: var(--sapButton_Attention_BorderColor);
}

html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnReject {
	border-color: var(--sapButton_Reject_BorderColor);
}

.sapMBar-CTX,
.sapMTB-Transparent-CTX {

	& :not(.sapMBtnDisabled) > span.sapMBtnInner.sapMBtnTransparent.sapMBtnActive {

		& > .sapMBtnContent,
		& > .sapMBtnIcon {
			color: var(--sapButton_Active_TextColor);
		}
	}
}

.sap-desktop .sapMIBar-CTX, .sap-desktop .sapMTB-Transparent-CTX {

	.sapMBtn:not(.sapMBtnDisabled):hover > .sapMBtnInner:not(.sapMToggleBtnPressed):not(.sapMBtnEmphasized):not(.sapMBtnAccept):not(.sapMBtnAttention):not(.sapMBtnReject):not(.sapMBtnActive):not(.sapMBtnGhost) {
		border-color: var(--sapButton_Hover_BorderColor);
	}
}

.sapMTB-Transparent-CTX .sapMBtn:not(.sapMBtnDisabled) > .sapMBtnDefault.sapMBtnActive {
	background-color: var(--sapButton_Active_Background);
}

:not(.sapMBtnDisabled) > span.sapMBtnInner.sapMBtnIconFirst.sapMBtnTransparent.sapMBtnActive,
:not(.sapMBtnDisabled) > span.sapMBtnInner.sapMBtnIconLast.sapMBtnTransparent.sapMBtnActive {
	background-color: var(--sapButton_Lite_Active_Background);
	border-color: var(--sapButton_Lite_Active_BorderColor);
}