// ===========================
// Sidebar
// ===========================

#sidebar-section {content-visibility: auto;
	.xoxo {list-style: none; margin: 0; padding: 0;}

	li.widget-container {margin: 10px 0 30px;
		&:first-child {margin-top: 0;}

		ul {margin: 0; padding: 0;
			li {list-style: none;}
		}
	}

	ul.menu {
		a {display: block; padding-right: 20px;}
		li.current-menu-item {
			a {color: $secondary_color;}
			.sub-menu a {@include link-colors($primary_color, $secondary_color);}
		}
		li.menu-item {position: relative; padding: 5px 0; list-style: none;
			ul.sub-menu {padding-left: 0;
				li.menu-item {padding: 5px 0 5px 10px; border-left: 1px solid $secondary_color;}
			}
		}
	}

	li.widget_archive label {display: none;}
	li.widget_categories ul li {
		&::before {content: "\f02e"; @include font-awesome("solid"); margin-right: 5px;}
	}

	//Overrides the default Tag Cloud widget. @TODO "Nebula" 0: Come up with a custom widget for tag list.
	.tagcloud a {display: inline-block; margin: 6px 3px 0 0; padding: 1px 8px; border-radius: 5px; @include background-color($primary_color, 0.1); color: $primary_color; font-size: rem(14px); //Font size needs !important
		&:hover,
		&:focus {@include background-color($primary_color, 0.25); color: $primary_color;}
	}
}

//Nebula expandable sidebar subnav style defaults
a.toplevelvert_expander {position: absolute; top: 5px; right: 0; padding: 2px 10px !important;
	i, svg {font-size: rem(18px); display: block; width: 100%; transform: rotate(-90deg); transition: transform 0.25s;}
		&.closed i, &.closed svg {transform: rotate(0deg);}

	.flex-first & {right: auto; left: -30px;
		i, svg {transform: rotate(270deg);}
			&.closed i, &.closed svg {transform: rotate(180deg);}
	}
}