.navbar {
	z-index: 20;
}

.navbar-brand {
	padding: 1rem 0;
}

@include media-breakpoint-up(md) {
	.navbar {
		background: $navbar-bg;

		.navbar-brand {
			background: $dark;
			width: $sidebar-width;
			margin-right: 0;
			flex-shrink: 0;
		}
	}
}

@include color-mode(dark) {
	@include media-breakpoint-up(md) {
		.navbar {
			background: $dark-bg;
		}
	}
}

@include media-breakpoint-down(md) {
	.navbar {
		background: $navbar-bg-mobile;

		.navbar-nav {
			flex-direction: row;
			gap: .75rem;

			.nav-link {
				color: $white;

				&:hover {
					color: rgba(255, 255, 255, .45);
				}
			}

			.dropdown-menu {
				position: absolute;
			}
		}

		#collapseSearch {
			border-top: solid 1px $dark;

			#search {
				margin-bottom: 1.125rem;
			}
		}
	}

	.navbar-light {
		.navbar-toggler {
			border-color: transparent;
		}

		.navbar-toggler-icon {
			background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
		}
	}
}
