/* ============================================== */
/* CSS for control sap.ui.unified/CalendarLegend  */
/* Base theme                                     */
/* ============================================== */

@_sap_ui_unified_CalendarLegend_sapUiUnifiedLegendWorkingDay: lighten(@sapUiContentForegroundColor, 7);
@_sap_ui_unified_CalendarLegend_sapUiUnifiedLegendNonWorkingDay: darken(@sapUiContentForegroundColor, 3);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType01: var(--sapLegendColor1);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType02: var(--sapLegendColor2);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType03: var(--sapLegendColor3);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType04: var(--sapLegendColor4);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType05: var(--sapLegendColor5);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType06: var(--sapLegendColor6);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType07: var(--sapLegendColor7);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType08: var(--sapLegendColor8);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType09: var(--sapLegendColor9);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType10: var(--sapLegendColor10);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType11: var(--sapLegendColor11);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType12: var(--sapLegendColor12);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType13: var(--sapLegendColor13);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType14: var(--sapLegendColor14);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType15: var(--sapLegendColor15);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType16: var(--sapLegendColor16);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType17: var(--sapLegendColor17);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType18: var(--sapLegendColor18);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType19: var(--sapLegendColor19);
@_sap_ui_unified_CalendarLegend_sapUiCalLegDayType20: var(--sapLegendColor20);

.sapUiUnifiedLegend {
	color: var(--sapContent_LabelColor);
	font-family: var(--sapFontFamily);
	font-size: var(--sapFontSmallSize);
	font-weight: normal;
	padding: 0.75rem;
	background-color: var(--sapList_Background);
}

.sapUiUnifiedLegendItems {
	column-gap: 0.5rem;
}

.sapUiUnifiedLegendDescription {
	display: inline-block;
	line-height: 1rem;
	margin-top: 0.375rem;
	margin-bottom: 0.25rem;
	/* width is 100% without the width and margin of sapUiUnifiedLegendSquare
	(the square in front of the legend description) */
	width: calc(100% - 28px);
	cursor: default;
}

.sapUiUnifiedLegendSquare {
	display: inline-block;
	vertical-align: top;
	margin: 4px 8px 4px 4px;
	background: var(--sapList_Background);
}

.sapUiUnifiedLegendSquareColor {
	height: 0.875rem;
	width: 0.875rem;
	margin: 0.125rem;
	background: lighten(@sapUiContentForegroundColor, 5);
	border: 0.0625rem solid var(--sapContent_ForegroundBorderColor);
	box-sizing: content-box;
	border-radius: 0.125rem;
}

.sapUiUnifiedLegendSquareSelected {
	height: 1rem;
	width: 1rem;
	background: var(--sapList_Background);
	border: 0.125rem solid @sapUiCalendarColorToday;
}

.sapUiUnifiedLegendItem {
	position: relative;

	&:focus {
		outline: none;

		&::after {
			content: '';
			position: absolute;
			box-sizing: border-box;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			border: 0.0625rem dotted var(--sapContent_FocusColor);
			pointer-events: none;
		}
	}
}

/*** compact mode (desktop size) ***/

.sapUiSizeCompact .sapUiUnifiedLegend,
.sapUiSizeCompact.sapUiUnifiedLegend {
	padding: 0.5rem;
}

.sapUiSizeCompact .sapUiUnifiedLegendItems,
.sapUiSizeCompact.sapUiUnifiedLegendItems {
	column-gap: 0.5rem;
}

.sapUiSizeCompact .sapUiUnifiedLegendSquare {
	margin: 2px 8px 2px 2px;
}

.sapUiSizeCompact .sapUiUnifiedLegendDescription {
	line-height: 0.75rem;
}

/*** items and colors ***/

.sapUiUnifiedLegendToday > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	height: 0.75rem;
	width: 0.75rem;
	background-color: var(--sapList_Background);
	border: 0.125rem solid @sapUiCalendarColorToday;
	box-sizing: content-box;
}

.sapUiUnifiedLegendSelected > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: var(--sapSelectedColor);
}

.sapUiUnifiedLegendWorkingDay > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiUnifiedLegendWorkingDay;
}

.sapUiUnifiedLegendNonWorkingDay > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiUnifiedLegendNonWorkingDay;
}

.sapUiUnifiedLegend hr {
	margin-left: -0.5rem;
	margin-right: -0.5rem;
	border-width: 0 0 1px 0;
}

.sapMDialog-CTX,
.sapMPopup-CTX {

	.sapUiUnifiedLegend {
		padding: 1rem;
	}
}

.sapUiUnifiedLegendNonWorkingDay > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: var(--sapLegend_NonWorkingBackground);
}

.sapUiCalLegDayType01 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType01;
}

.sapUiCalLegDayType02 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType02;
}

.sapUiCalLegDayType03 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType03;
}

.sapUiCalLegDayType04 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType04;
}

.sapUiCalLegDayType05 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType05;
}

.sapUiCalLegDayType06 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType06;
}

.sapUiCalLegDayType07 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType07;
}

.sapUiCalLegDayType08 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType08;
}

.sapUiCalLegDayType09 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType09;
}

.sapUiCalLegDayType10 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType10;
}

.sapUiCalLegDayType11 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor{
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType11;
}

.sapUiCalLegDayType12 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType12;
}

.sapUiCalLegDayType13 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType13;
}

.sapUiCalLegDayType14 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType14;
}

.sapUiCalLegDayType15 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType15;
}

.sapUiCalLegDayType16 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType16;
}

.sapUiCalLegDayType17 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType17;
}

.sapUiCalLegDayType18 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType18;
}

.sapUiCalLegDayType19 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType19;
}

.sapUiCalLegDayType20 > .sapUiUnifiedLegendSquare > .sapUiUnifiedLegendSquareColor {
	background: @_sap_ui_unified_CalendarLegend_sapUiCalLegDayType20;
}