.sidebar {
	.font-s2;

	.topcap {
		.std-xpadding;
		padding-top: 1rem;
		padding-bottom: 1rem;

		.title-sidebar {
			.font-s3;
			.type-bold;
		}

		.version-sidebar {
			.type-semibold;
			float: right;
			margin-right: -.75rem;
			margin-top: -.5rem;
		}
	}

	.wrapper-search {
		display: block;
		margin-bottom: .75rem;

		.input-area {

			.std-xpadding;

			.input-symbol {
				width: 100%;

				input {
					box-shadow: @color-light 0 0 0 1px inset;
				}
			}
		}
	}

	.heading-toc {
		.subheading-caps;
		color: @color-darker;
		padding: 1.5em 1.6em .25em;
	}

	.toc > li:first-child > .heading-toc {
		padding-top: 0;
	}

	ul.toc {
		//reset
		list-style: none;
		padding-left: 0;
		margin: 0;

		padding-bottom: 1.5rem;

		ul {
			list-style: none;
			padding-left: 0;
		}

		li { vertical-align: top; }

	}

	ul.list-toc {
		@indent: 15px;

		/*
			This ensures that each tier of the headings is properly offset,
			but ensures that the background color can still go all the way to
			the left margin of the viewport.
		*/
		li {
			a { padding-left: (@indent + 7); }
			li {
				a { padding-left: (@indent * 2); }
				li {
					a { padding-left: (@indent * 3); }
					li {
						a { padding-left: (@indent * 4); }
						li {
							a { padding-left: (@indent * 5); }
						}
					}
				}
			}
		}

		a {
			.link(@color-darkest);
			.type-normal;
			.type-secondary;
			cursor: pointer;
			display: block;
			line-height: 1rem;
			position: relative;
			font-weight: 600;
			padding-left: 1.5rem;

			&.current {
				&:extend(.link.primary all);
				.type-bold;
				color: @color-primary;
			}

			&:before {
				.font-s1;
				.position(absolute, 50%, auto, auto, -1rem);
				.transition( all 250ms ease-out );
				color: @color-primary;
				margin-top: -.5em;
				opacity: 0;

				// Taken from package percolate:icons/edited-style.less
				font-family: 'percolate';
				speak: none;
				font-style: normal;
				font-weight: normal;
				font-variant: normal;
				text-transform: none;
				line-height: 1;
				-webkit-font-smoothing: antialiased;
				-moz-osx-font-smoothing: grayscale;

				// Show right arrow icon
				//&:extend(.icon-arrow-right-alt:before);
			}

			&.active,
			&:hover {
				&:before { opacity: 1; }
			}

			&.active {
				color: @color-primary;
			}

			&.h3 { .link(@color-dark); }

			em {
				// For code styling in tandem with .api-box
				// Used on Meteor Docs
				.type-italic;
				.type-normal;
			}
		}

		.sub-menu {
			margin-top: .375rem;

			a {
				
				font-weight: 400;

				&.active {
					.link(@color-lightest);
					background: @color-sidebar-wide;
					color: @color-primary;
					width: 100%;
					padding-top: 10px;
					padding-bottom: 10px;
				}
				
			}


			&:empty {
				margin: 0;
				max-height: 0;
				overflow: hidden;
			}
		}

		li {
			position: relative;
			padding-top: .375rem;
			padding-bottom: .375rem;
		}
	}
}