.navbar-sidebar--show .navbar-sidebar {
	box-shadow: 0 5px 40px rgba($primary-black, 0.5);
}

.navbar-sidebar {
	@include light {
		background-color: $trevas-light;
	}
	@include dark {
		background-color: $trevas-dark;
	}
	.navbar-sidebar__back {
		@include light {
			color: black;
		}
		@include dark {
			color: white;
		}
	}
	box-shadow: none;

	&__backdrop {
		background-color: rgba($primary-blue, 0.5);
	}

	&__brand {
		box-shadow: none;
		background-color: $trevas-dark;
	}

	&__items {
		margin-top: 15px;
		padding: 0;
	}

	.menu {
		&__list-item {
			margin: 0;

			&:not(:first-child) {
				margin-top: 10px;
			}
		}

		&__link {
			padding: 5px 15px;
			border-radius: 0;
			background-color: transparent;
			font-size: 17px;
		}
	}
}

.navbar {
	padding: 15px 40px;
	height: 85px;
	background-color: $trevas-dark;
	box-shadow: none;
	font-family: $trevas-font-book;

	&__toggle {
		margin-right: 18px;
	}

	&__brand,
	&__logo {
		width: 80px;
		height: 50px;
	}

	&__link {
		padding: 7px 21px 8px;
		line-height: 1;
		font-size: 17px;
		color: $white !important;

		&:hover {
			text-decoration: underline;
		}
	}

	.DocSearch-Button-Container {
		@include mobile {
			justify-content: center;
			width: 100%;
		}
	}

	.DocSearch-Button {
		margin-left: 19px;
		padding: 0 13px;
		width: 202px;
		height: 32px;
		box-shadow: none !important;
		border-radius: 21px;
		background-color: $zircon;

		@include mobile {
			padding: 0;
			width: 32px;
		}

		.DocSearch-Search-Icon {
			width: 16px;
			height: 16px;
		}

		.DocSearch-Button-Placeholder {
			margin-left: 8px;
			padding: 0;
			line-height: 1;
			font-family: $trevas-font-book;
			font-size: 14px;
			color: $primary-blue;
		}

		.DocSearch-Button-Key {
			&:last-child {
				margin-right: 0;
			}
		}
	}
}