/* ======================================== */
/* CSS for control sap.ui.unified/Calendar  */
/* Belize High Contrast White theme         */
/* ======================================== */

/* tablet(large) size is default */

.sapUiCal{
	border: 0.0625rem solid @sapUiContentForegroundBorderColor;
}

.sapUiCalHead > button{
	border: 0.0625rem solid @sapUiButtonBorderColor;
	border-radius: 0.375rem;
}

.sapUiCalHeadB:focus{
	border-radius: 0;
}

/*** days, months, years ***/
.sapUiCalWH,
.sapUiCalItem{
	border: 0.0625rem solid @sapUiListBackground;
}

.sapUiCalWH{
	border-bottom: 0 none;
}

.sapUiCalWH,
.sapUiCalWeekNum {
	color: @sapUiHcReducedAltForeground;
	background-color: @sapUiListBackground;
}

.sapUiCalWH{
	background-color: @sapUiListBackground;
	border-bottom-color: @sapUiListBorderColor;
	color: @sapUiHcReducedAltForeground;
}

.sapUiCalItem{
	background-color: @sapUiListBackground;
	border-color: @sapUiListBorderColor;
}

.sapUiCalItemWeekEnd{
	background-color: @sapUiHcReducedBackground;
}

.sapUiCalItemWeekEnd.sapUiCalItemDsbl{
	background-color: fade(@sapUiHcReducedBackground, 50);
}

.sapUiCalItemNow > .sapUiCalItemText{
	color: @sapUiBaseText;
	line-height: 2.5rem;
	margin: 0.0625rem;
	height: auto;
	width: 95%;
}

.sapUiCalItemOtherMonth{
	background-color: @sapUiListBackground;
	color: @sapUiBaseText;
}

.sapUiCalItemOtherMonth,
.sapUiCalItemOtherMonth > .sapUiCalItemText {
	border: 0 none;
}

.sapUiCalItemSel{
	background-color: @sapUiSelected;
}

.sapUiCalContentOver{
	background-color: fade(@sapUiListBackground, 30);
}

.sapUiCalFirstWDay > .sapUiCalWeekNum {
	margin-right: 0.125rem;
}

/* hover and focus makes only sense on desktops. On mobile devices it's not needed */

html.sap-desktop .sapUiCalHead > button:focus {
	border: 0.125rem dotted @sapUiContentFocusColor;
	background-color: transparent;
}

html.sap-desktop .sapUiCalItem:focus{
	background-color: @sapUiListBackground;
	border: 0.125rem dotted @sapUiContentFocusColor;
	line-height: 2.75rem;
	outline: none;
}

html.sap-desktop .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText {
	line-height: 2.75rem;
}

html.sap-desktop .sapUiCal .sapUiCalItem:focus{
	line-height: 2.75rem;
}

html[data-sap-ui-browser^="ed"].sap-desktop .sapUiCalItem:focus,
html[data-sap-ui-browser^="ie"].sap-desktop .sapUiCalItem:focus {
	border-style: dashed;
}

html.sap-desktop .sapUiCalMonthPicker .sapUiCalItemSel:not(:focus),
html.sap-desktop .sapUiCalYearPicker .sapUiCalItemSel:not(:focus) {
	outline: 0.125rem solid @sapUiContentForegroundBorderColor;
	outline-offset: -0.25rem;
}

html[data-sap-ui-browser^="ie"].sap-desktop {
	.sapUiCalHeadB:active {
		position: relative;
		top: -0.0625rem;
		left: -0.0625rem;
	}
	.sapUiCalHeadPrev:active > span,
	.sapUiCalHeadNext:active > span {
		position: relative;
	}
	.sapUiCalMonthPicker .sapUiCalItemSel,
	.sapUiCalYearPicker .sapUiCalItemSel{
		outline: none;
		position: relative;
	}
	.sapUiCalMonthPicker .sapUiCalItemSel:before,
	.sapUiCalYearPicker .sapUiCalItemSel:before{
		content: " ";
		box-sizing: border-box;
		width: 97.5%;
		height: 95%;
		position: absolute;
		left: 0.0625rem;
		top: 0.0625rem;
		border: 0.125rem solid @sapUiContentForegroundBorderColor;
		pointer-events: none;
	}
}

html.sap-desktop .sapUiCalItem:not(.sapUiCalItemNow):focus > .sapUiCalItemText:not(.sapUiCalWeekNum):hover,
html.sap-desktop .sapUiCalItem:not(.sapUiCalItemNow):hover > .sapUiCalItemText:not(.sapUiCalWeekNum):hover {
	border: 0 none;
}

html.sap-desktop .sapUiCalItemNow:focus > .sapUiCalItemText {
	line-height: 2.375rem;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalItem:focus {
	line-height: 1.75rem;
}

html.sap-desktop .sapUiCalItem:focus > .sapUiCalWeekNum {
	margin-right: 0.25rem;
	line-height: 2.75rem;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalItem:focus > .sapUiCalWeekNum {
	margin-right: 0.25rem;
	line-height: 1.75rem;
}

html.sap-desktop .sapUiCalItemWeekEnd:focus {
	background-color: @sapUiHcReducedBackground;
}

html.sap-desktop .sapUiCalItemSel:focus{
	background-color: @sapUiSelected;
}

html.sap-desktop .sapUiCalItemSel:hover{
	background-color: @sapUiHighlight;
}

/* define after weekend and selection focus to overrule it*/
html.sap-desktop .sapUiCalDatesRow .sapUiCalItem:not(.sapUiCalItemSel):hover,
html.sap-desktop .sapUiCalMonthPicker .sapUiCalItem:not(.sapUiCalItemSel):not(.sapUiCalItemSelBetween):hover,
html.sap-desktop .sapUiCalYearPicker .sapUiCalItem:not(.sapUiCalItemSel):not(.sapUiCalItemSelBetween):hover,
html.sap-desktop .sapUiCal:not(.sapUiCalDateInt) .sapUiCalItem:not(.sapUiCalItemSel) :not(.sapUiCalWeekNum):hover{
	background-color: @sapUiHighlight;
}

html.sap-desktop .sapUiCalItemOtherMonth:hover > .sapUiCalItemText:not(.sapUiCalWeekNum):hover {
	margin-left: -0.125rem;
}

/* Day names inside day */
html.sap-desktop .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText{
	line-height: 1.95rem;
}

html.sap-desktop .sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemNow:focus > .sapUiCalItemText{
	line-height: 1.85rem;
}

html.sap-desktop .sapUiSizeCompact .sapMSinglePCGrid .sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemNow,
html.sap-desktop .sapUiSizeCompact .sapMSinglePCGrid .sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemNow {
	&:focus > .sapUiCalItemText,
	&:hover > .sapUiCalItemText {
		line-height: 1.65rem;
	}
}

html[data-sap-ui-browser^="ie"].sap-desktop .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText,
html[data-sap-ui-browser^="ff"].sap-desktop .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText{
	line-height: 1.85rem;
}

html.sap-desktop .sapMPlanCal .sapUiCalNoNameLine .sapUiCalItem:not(.sapUiCalItemNow):focus > .sapUiCalDayName{
	line-height: 0.95rem;
	padding-top: 0.375rem;
}

html.sap-desktop .sapUiSizeCompact .sapMPlanCal .sapUiCalNoNameLine .sapUiCalItem:not(.sapUiCalItemNow):focus > .sapUiCalDayName{
	padding-top: 0.45rem;
}

html[data-sap-ui-browser^="ff"].sap-desktop .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalDayName{
	line-height: 0.85rem;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalDayName{
	line-height: 1.25rem;
}

html.sap-desktop .sapUiSizeCompact .sapMPlanCal .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalDayName{
	padding-top: 0.25rem;
}

.sapUiCalItemNow > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 2.4rem;
}

.sapUiCalItem:focus > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 2.65rem;
}

.sapUiCalItem.sapUiCalItemNow:focus > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 2.25rem;
}

.sapUiCalNoNameLine .sapUiCalItem > .sapUiCalDayName {
	color: @sapUiBaseText;
}

.sapMSinglePCGrid .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalDayName,
.sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemNow:focus > .sapUiCalDayName {
	color: @sapUiBaseText;
}

.sapMPlanCal .sapUiCalNoNameLine .sapUiCalItem.sapUiCalItemNow:focus > .sapUiCalDayName {
	padding-top: 0.325rem;
}

.sapMSinglePCGrid .sapUiCalNoNameLine .sapUiCalItem:focus {
	&.sapUiCalItemNow > .sapUiCalDayName {
		padding-top: 0.375rem;
	}
	&:not(.sapUiCalItemNow) > .sapUiCalDayName {
		padding-top: 0.325rem;
	}
}

.sapUiSizeCompact .sapMSinglePCGrid .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalDayName {
	padding-top: 0;
}

/* 2 calendar types */
html.sap-desktop .sapUiCalMonthSecType .sapUiCalItem:focus  > .sapUiCalItemText{
	line-height: 2rem;
}

.sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow  > .sapUiCalItemText{
	line-height: 1.75rem;
	height: 2.75rem;
}

html.sap-desktop .sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow:focus  > .sapUiCalItemText{
	line-height: 1.7rem;
	height: 2.7rem;
}

.sapUiCalMonthSecType .sapUiCalItem > .sapUiCalItemSecText{
	color: @sapUiContentContrastTextColor;
}

html.sap-desktop .sapUiCalMonthSecType .sapUiCalItem:focus  > .sapUiCalItemSecText{
	line-height: 1.1rem;
}

html[data-sap-ui-browser^="ie"].sap-desktop .sapUiCalMonthSecType .sapUiCalItem:focus  > .sapUiCalItemSecText{
	line-height: 1.2rem;
	padding-right: 0.25rem;
}

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

.sapUiSizeCompact .sapUiCalItemNow > .sapUiCalItemText{
	width: 94%;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalItem:hover > .sapUiCalItemText,
html.sap-desktop .sapUiSizeCompact .sapUiCalItem:focus > .sapUiCalItemText{
	line-height: inherit;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalItemNow > .sapUiCalItemText,
html.sap-desktop .sapUiSizeCompact .sapUiCalItemNow:hover > .sapUiCalItemText,
html.sap-desktop .sapUiSizeCompact .sapUiCalItemNow:focus > .sapUiCalItemText{
	height: 1.65rem;
	line-height: 1.375rem;
	& .sapUiCalItemTextAmPm {
		line-height: 1.25rem;
	}

}

/* Day names inside day */
html.sap-desktop .sapUiSizeCompact .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText,
html[data-sap-ui-browser^="ff"].sap-desktop .sapUiSizeCompact .sapUiCalNoNameLine .sapUiCalItem:focus > .sapUiCalItemText{
	line-height: inherit;
}

.sapUiSizeCompact .sapUiCalItemNow:hover > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 1.4rem;
}

.sapUiSizeCompact .sapUiCalItem:hover > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 1.75rem;
}

.sapUiSizeCompact .sapUiCalItem:not(.sapUiCalItemNow):focus > .sapUiCalItemText > .sapUiCalItemTextAmPm{
	line-height: 1.65rem;
}

/* 2 calendar types */
html.sap-desktop .sapUiSizeCompact .sapUiCalMonthSecType .sapUiCalItem:focus  > .sapUiCalItemText{
	line-height: 1.375rem;
}

.sapUiSizeCompact .sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow  > .sapUiCalItemText{
	height: 1.75rem;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow:focus  > .sapUiCalItemText{
	line-height: 1rem;
	height: 1.65rem;
}

html.sap-desktop .sapUiSizeCompact .sapUiCalMonthSecType .sapUiCalItem:focus > .sapUiCalItemSecText{
	line-height: 0.85rem;
}


html[data-sap-ui-browser^="ie"].sap-desktop .sapUiSizeCompact .sapUiCalMonthSecType .sapUiCalItem:focus  > .sapUiCalItemSecText{
	line-height: 0.95rem;
	padding-right: 0.15rem;
}

/*** Phone ***/
/* make calendar full-screen if on popup (DatePicker), but not if stand alone */

html.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalCancel{
	border: 0.0625rem solid @sapUiButtonBorderColor;
	border-radius: 0.375rem;
}

html.sap-phone .sapUiCalItem {
	outline: 0 none;
}

html.sap-phone .sapUiCalMonthPicker .sapUiCalItemSel,
html.sap-phone .sapUiCalYearPicker .sapUiCalItemSel {
	border: 0 none;
	outline: 0.125rem solid @sapUiContentForegroundBorderColor;
	outline-offset: -0.25rem;
}

@media only screen
and (orientation: portrait) {
	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalCancel{
		bottom: 1rem;
		left: 25%;
		width: 50%;
		padding-left: 1rem;
		padding-right: 1rem;
		height: 2.5rem;
	}

}

@media only screen
and (min-width : 320px)
and (orientation: landscape) {
	.sap-phone .sapUiCal[data-sap-ui-popup] {
		overflow: auto;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalHead{
		height: 1.875rem;
		padding-right: 5rem;
		padding-left: 0.5rem;
		box-sizing: border-box;
		bottom: 0.25rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalContent{
		position: absolute;
		top:2.875rem;
		left: 0.5rem;
		right: 0.5rem;
		bottom: 1rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalContent{
		.sapUiCalDatesRow,
		.sapUiCalMonthView{
			padding-top: 0.25rem;
		}
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalWH{
		height: 1.25rem;
		line-height: 1.25rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalHead > button{
		height: 1.875rem;
		position: relative;
		float: left;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadPrev,
	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadNext{
		box-sizing: border-box;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadPrev{
		left: 0;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadNext{
		right: 0;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalContent{
		.sapUiCalDatesRow,
		.sapUiCalMonthView{
			position: absolute;
			top: 0.5rem;
			left: 0;
			right: 0;
			bottom: 0;
			width: auto;
			margin: 1rem;
			min-height: 11.25rem;
		}
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalContent > .sapUiCalMonthPicker,
	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalContent > .sapUiCalYearPicker{
		padding: 1.25rem 0.5rem 0 0.5rem;
		min-height: 11.25rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] {
		.sapUiCalDatesRow > div,
		.sapUiCalMonthView > div{
			height: 16.66%;
			min-height: 1.875rem;
		}
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalItem{
		height: 100%;
	}
	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalItem,
	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalWeekNum{
		line-height: 2.1875rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalItemNow > .sapUiCalItemText {
		line-height: 1.9375rem;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalMonthSecType .sapUiCalItem.sapUiCalItemNow  > .sapUiCalItemText{
		line-height: 1.75rem;
		height: 100%;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalWeekNum{
		height: 100%;
		top: 0;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] > .sapUiCalCancel{
		top: 1rem;
		right: 1rem;
		width: 4rem;
		height: 1.875rem;
		padding-top: 0.25rem;
		padding-bottom: 0.25rem;
		box-sizing: border-box;
	}

	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadNext,
	.sap-phone .sapUiCal[data-sap-ui-popup] .sapUiCalHeadBFirst {
		margin-left: 0.5rem;
	}

}

/*** Tablet ***/

html.sap-tablet .sapUiCalItem{
	outline: 0 none;
}

html.sap-tablet .sapUiCalMonthPicker .sapUiCalItemSel:not(:focus),
html.sap-tablet .sapUiCalYearPicker .sapUiCalItemSel:not(:focus) {
	border: 0 none;
	outline: 0.125rem solid @sapUiContentForegroundBorderColor;
	outline-offset: -0.25rem;
}

/* Special days */
.dayColorMixIn(@class, @color) {
	.@{class}.sapUiCalItemSel:not(.sapUiCalItemNow) > .sapUiCalItemText {
		box-shadow: inset 0 -0.25rem 0 @color;
	}

	.@{class}:not(.sapUiCalItemSel):not(.sapUiCalItemNow) > .sapUiCalItemText {
		box-shadow: inset 0 -0.25rem 0 @color;
	}

	.sapMSinglePCColumnHeader .@{class}.sapUiCalItemSel:not(.sapUiCalItemNow) > .sapUiCalItemText,
	.sapMSinglePCColumnHeader .@{class}:not(.sapUiCalItemSel):not(.sapUiCalItemNow) > .sapUiCalItemText {
		box-shadow: none;
	}

	.@{class}.sapUiCalItemSel:not(.sapUiCalItemNow):hover  > .sapUiCalItemText {
		box-shadow: none;
	}
}

.dayColorMixIn(sapUiCalItemType01, @_sap_ui_unified_Calendar_sapUiCalItemType01);
.dayColorMixIn(sapUiCalItemType02, @_sap_ui_unified_Calendar_sapUiCalItemType02);
.dayColorMixIn(sapUiCalItemType03, @_sap_ui_unified_Calendar_sapUiCalItemType03);
.dayColorMixIn(sapUiCalItemType04, @_sap_ui_unified_Calendar_sapUiCalItemType04);
.dayColorMixIn(sapUiCalItemType05, @_sap_ui_unified_Calendar_sapUiCalItemType05);
.dayColorMixIn(sapUiCalItemType06, @_sap_ui_unified_Calendar_sapUiCalItemType06);
.dayColorMixIn(sapUiCalItemType07, @_sap_ui_unified_Calendar_sapUiCalItemType07);
.dayColorMixIn(sapUiCalItemType08, @_sap_ui_unified_Calendar_sapUiCalItemType08);
.dayColorMixIn(sapUiCalItemType09, @_sap_ui_unified_Calendar_sapUiCalItemType09);
.dayColorMixIn(sapUiCalItemType10, @_sap_ui_unified_Calendar_sapUiCalItemType10);
.dayColorMixIn(sapUiCalItemType11, @_sap_ui_unified_Calendar_sapUiCalItemType11);
.dayColorMixIn(sapUiCalItemType12, @_sap_ui_unified_Calendar_sapUiCalItemType12);
.dayColorMixIn(sapUiCalItemType13, @_sap_ui_unified_Calendar_sapUiCalItemType13);
.dayColorMixIn(sapUiCalItemType14, @_sap_ui_unified_Calendar_sapUiCalItemType14);
.dayColorMixIn(sapUiCalItemType15, @_sap_ui_unified_Calendar_sapUiCalItemType15);
.dayColorMixIn(sapUiCalItemType16, @_sap_ui_unified_Calendar_sapUiCalItemType16);
.dayColorMixIn(sapUiCalItemType17, @_sap_ui_unified_Calendar_sapUiCalItemType17);
.dayColorMixIn(sapUiCalItemType18, @_sap_ui_unified_Calendar_sapUiCalItemType18);
.dayColorMixIn(sapUiCalItemType19, @_sap_ui_unified_Calendar_sapUiCalItemType19);
.dayColorMixIn(sapUiCalItemType20, @_sap_ui_unified_Calendar_sapUiCalItemType20);