/* ================================== */
/* CSS for control sap.f/DynamicPage  */
/* Belize High Contrast White theme   */
/* ================================== */

/* Tablet and Desktop */
.sapFDynamicPageToggleHeaderIndicator,
.sapFDynamicPageHeaderPinButton {
	width: 2.5rem;
	height: 2.5rem;
	font-size: 1.375rem;

	.sapMBtnInner {
		height: 2rem;
		bottom: 0.5rem;

		.sapMBtnIcon {
			line-height: 2rem;
		}
	}
}

/* Compact */
.sapUiSizeCompact {
	.sapFDynamicPageToggleHeaderIndicator,
	.sapFDynamicPageHeaderPinButton {
		width: 2rem;
		height: 2rem;
		font-size: 1rem;

		.sapMBtnInner {
			height: 1.25rem;
			bottom: 0.375rem;

			.sapMBtnIcon {
				line-height: 1.25rem;
			}
		}
	}
	.sapFDynamicPageToggleHeaderIndicator {
		margin-left: -1rem;
	}
	.sapFDynamicPageHeaderPinnable .sapFDynamicPageToggleHeaderIndicator {
		margin-left: -2rem;
	}
}

.sapFDynamicPageHeaderPinButton > .sapMBtnInner {
		border: 0.0625rem solid;
		&:not(.sapMToggleBtnPressed) {
			background-color: @sapHC_StandardBackground;
		}

}

.sapFDynamicPageHeaderPinButton:hover > .sapMBtnInner.sapMBtnHoverable {
	background-color: @sapUiHighlight;

	&.sapMToggleBtnPressed {
		background-color: @sapUiToggleButtonPressedHoverBackground;
	}
}

.sapFDynamicPageHeaderPinButton > .sapMBtnInner.sapMBtnActive,
.sapFDynamicPageHeaderPinButton > .sapMBtnInner.sapMBtnActive.sapMBtnHoverable {
	background-color: @sapUiHighlight;
}

.sapFDynamicPage {
	/* DynamicPageTitle and Toggle Header Visual Indicator hover state */
	&.sapFDynamicPageTitleClickEnabled {
		&.sapFDynamicPageTitleForceHovered .sapFDynamicPageTitle {
			background: @sapUiHighlight;
			box-shadow: @sapUiShadowHeader;
		}
		&.sapFDynamicPageTitleForceHovered {
			.sapFDynamicPageToggleHeaderIndicator {
				.sapMBtnInner {
					background-color: @sapUiHighlight;
				}
			}
		}
	}

	// Footer
	.sapFDynamicPageFooter {
		opacity: 1;

		.sapFDynamicPageActualFooterControl.sapMTB {
			box-shadow: @sapUiShadowLevel2;
			border-bottom: 0 none;
		}
	}
}