/* =================================== */
/* CSS for control sap.ushell/Section  */
/* Base theme                          */
/* =================================== */

.sapUshellSection {

	&:focus,
	.sapUshellSectionCompactArea:focus {
		outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
		outline-offset: 0.0625rem;
	}

	.sapUshellSectionNoVisualizationsText {
		padding: 1rem;
		cursor: inherit;
		display: none;
	}

	.sapUshellSectionTitle {
		padding: 1rem 0;
		font-family: var(--sapFontFamily);
		font-size: var(--sapFontHeader4Size);
		color: var(--sapShell_GroupTitleTextColor);
	}

	.sapUshellSectionHeader {
		background-color: var(--sapGroup_TitleBackground);
		margin-bottom: 0.5rem;

		@media (min-width: 600px) {
			margin-bottom: 1rem;
		}
	}

	.sapUshellSectionDefaultArea,
	.sapUshellSectionFlatArea {
		padding-bottom: 0.5rem;

		@media (min-width: 600px) {
			padding-bottom: 1rem;
		}
	}

	&.sapUshellSectionEdit {
		background-color: fade(@sapUiGroupContentBackground, 50);

		&.sapUshellSectionHidden {
			background-color: darken(@sapUiGroupContentBackground, 5);
		}
	}

	&.sapUshellSectionNoVisualizations {

		.sapUshellSectionNoVisualizationsText {
			display: block;
		}

		.sapUshellSectionCompactArea {
			display: none;
		}
	}
}