/* ============================================================= */
/* CSS for control sap.suite.ui.microcharts/StackedBarMicroChart */
/* Base Theme                                                    */
/* ============================================================= */

.sapSuiteStackedMC {
	font-size: @sapMFontSmallSize;
	outline: none;
	display: flex;
	align-items: center;

  	.sapSuiteStackedMCContainer {
	  display: flex;
	  align-items: center;
	  position: relative;
	  height: 100%;
	  width: 100%;
	  min-width: 2rem;
	  max-width: 20rem;
	  height:fit-content;
	  max-height: 3.5rem;
	  border: 1px solid @sapGroup_ContentBackground;
	  outline: 1px solid @sapContent_ForegroundBorderColor;
	}

	.sapSuiteStackedMCBar {
	  position: relative;
	  height: 1rem;
	  -moz-box-sizing: border-box;
	  min-width: 0.25rem;

		&:not(:last-child) {
			border-right: 1px solid @sapUiChartDataPointBGBorderColor;
		}
	}
}

html.sap-desktop .sapSuiteStackedMC:focus:not([tabindex]),
.sapSuiteStackedMC:focus:not([tabindex]) {
	outline: none;
}

.sapSuiteStackedMCBarLabel {
	text-align: center;
	vertical-align: middle;
	margin-left: 3px;
	margin-right: 3px;
	overflow: hidden;
	white-space: nowrap;
	line-height: 1rem;
	color: @sapContent_ContrastTextColor;
	text-shadow: @sapContent_ContrastTextShadow;

	&.sapSuiteStackedMCBarLabelHidden {
		display: none;
	}
}

.sapSuiteStackedMC.sapSuiteStackedMCSizeL {
	width: 12rem;
	height: 5.875rem;
}

html.sapUiMedia-Std-Desktop .sapSuiteStackedMC.sapSuiteStackedMCSizeAuto,
html.sapUiMedia-Std-Tablet .sapSuiteStackedMC.sapSuiteStackedMCSizeAuto,
.sapSuiteStackedMC.sapSuiteStackedMCSizeM {
  width: 10.5rem;
  height: 3.5rem;
}

html.sapUiMedia-Std-Phone .sapSuiteStackedMC.sapSuiteStackedMCSizeAuto,
.sapSuiteStackedMC.sapSuiteStackedMCSizeS{
  width: 8.25rem;
  height: 3.5rem;
}

.sapSuiteStackedMC.sapSuiteStackedMCSizeXS {
  width: 6rem;
  height: 1.125rem;
}

.sapSuiteStackedMC.sapSuiteStackedMCSizeResponsive {
	width: 100%;
	height: 100%;
}

.sapSuiteStackedMCSmallLook {
  .sapSuiteStackedMCBar {
	height: 0.75rem;
  }

  .sapSuiteStackedMCBarLabel {
	display: none;
  }
}

html.sap-desktop .sapSuiteStackedMC:focus {
    outline: 1px dotted @sapUiContentFocusColor;
  	outline-offset: 1px;
}

.sapSuiteStackedMCBarSemanticColorNeutral {
	background-color: @sapUiChartPaletteSemanticNeutral;
}

.sapSuiteStackedMCBarSemanticColorGood {
	background-color: @sapUiChartPaletteSemanticGood;
}

.sapSuiteStackedMCBarSemanticColorCritical {
	background-color: @sapUiChartPaletteSemanticCritical;
}

.sapSuiteStackedMCBarSemanticColorError {
	background-color: @sapUiChartPaletteSemanticBad;
}