.docs--layout-sidebar {
	@include background-color($gray-lighter);
}

.docs--sidebar,
.docs--sidebar__subnav,
.docs--sidebar__collapse {
	margin: 0;
	padding: 0;
	list-style: none;
}

.docs--sidebar {

	li, a {
		color: $gray-darker;
	}

	li.docs--collapser,
	li a {
		@include whitespace($type: padding, $side: vertical, $size: sm);
		display: flex;
		align-items: center;
	}

	a {
		&:hover {
			text-decoration: none;
		}
	}

	li {
		&:hover {
			color: $link-hover-color;
		}
	}

	li.active {
		background-color: $gray;
		color: $gray-lighter;
	}

	> ul {
		background-color: $gray-light;
	}

	/*
		Indentation of list-items
	*/
	// >
	> li.docs--collapser,
	> li a {
		@include whitespace($type: padding, $side: horizontal, $size: sm);
	}
	// >>
	> ul > li.docs--collapser,
	> ul > li a {
		@include whitespace($type: padding, $side: horizontal);
	}
	// >>>
	> ul > ul > li.docs--collapser,
	> ul > ul > li a {
		@include whitespace($type: padding, $side: horizontal, $size: lg);
	}
}