.skin-noskin {
	// only using colors when there is no bootswatch skin applied
	--nav-color: #{$secondary};
	--nav-bg: #{$light};
	[data-bs-theme="dark"] & {
		--nav-color: #{$light};
		--nav-bg: #{$dark};
	}
	nav.sidebar,
	.bottombar-nav,
	.bottombar-nav .dropdown-menu {
		color: var(--nav-color) !important;
		background-color: var(--nav-bg) !important;
	}
}

.sidebar {
	@include media-breakpoint-up(lg) {
		&.open {
			min-width: 200px;
			max-width: 200px;
			width: 200px;

			.sidebar-toggle {
				.fa-angles-right { display: none; }
				.fa-angles-left { display: inline-block; }
			}
			.visible-open { display: initial; }
			.visible-closed { display: none; }
			hr.visible-open { display: block; }
			.truncate-open {
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
			.sidebar-toggle-container {
				width: 100%
			}
		}
	}
	.visible-open {	display: none; }
	.visible-closed {display: initial; }

	.truncate-open {
		overflow: initial;
		text-overflow: initial;
		white-space: initial;
	}

	.nav-link {
		$hover-color: mix($light, $dark, 90%);
		@extend .ff-secondary;
		padding: ($spacer * 0.25) ($spacer * 0.5);
		border-radius: $border-radius-sm;
		cursor: pointer;
		&.active, &:hover {
			background-color: $hover-color;
		}
	}

	.nav-item {
		.dropdown-menu .dropdown-item {
			@extend .rounded-1;
		}
	}

	.sidebar-toggle {
		justify-content: start;
		.fa-angles-right { display: inline-block; }
		.fa-angles-left { display: none; }
	}
	$dropdown-menu-width: 360px;
	.search-dropdown {
		width: $dropdown-menu-width;
	}

	.chats-dropdown, .notifications-dropdown, .drafts-dropdown {
		min-width: $dropdown-menu-width;
		width: $dropdown-menu-width;
		.list-container {
			max-height: 400px;
			overflow-y: auto;
		}
	}

	.badge {
		font-size: 9px;
		line-height: 12px;
		&.visible-open {
			font-size:12px;
			line-height: 12px;
			font-weight: normal;
		}
	}

	[data-widget-area="sidebar-footer"] {
		font-size: $font-size-base * 0.75;
	}
}

 /*rtl:begin:ignore*/
 html[data-dir="rtl"] {
	.sidebar {
		&.open {
			.sidebar-toggle {
				.fa-angles-right { display: none; }
				.fa-angles-left { display: inline-block; }
			}
		}
		.sidebar-toggle {
			.fa-angles-right { display: inline-block; }
			.fa-angles-left { display: none; }
		}
	}
}
 /*rtl:end:ignore*/