@charset "UTF-8";

:root {
	--dip-nav-width: 250px;
	--dip-nav-widen-transition: width 100ms linear, padding-left 100ms linear;
}
.global-searching {
	--dip-nav-width: 450px;
}

/* navbar */
.navbar {
	background-color: #fff;
	--bs-navbar-brand-margin-end: var(--bs-navbar-toggler-padding-x);
	--bs-navbar-active-color: #f8f9fa; /* .text-light without vars */
}
.navbar-nav {
	align-items: unset;
}

/* links */
.nav-pills .nav-link {
	display: flex;
	align-items: center;
	white-space: nowrap;
	position: relative;
}
.nav-pills .nav-link > svg {
	flex: 16px 0 0;
}
.navbar-expand-lg .navbar-nav .nav-link {
	padding-left: 1.0rem;
	padding-right: 0;
	border-radius: 0 var(--bs-nav-pills-border-radius) var(--bs-nav-pills-border-radius) 0;
}
.navbar-expand-lg .navbar-nav .submenu .nav-link {
	padding-left: 36px;
	font-size: 0.9rem;
}
.nav-link[data-bs-toggle="collapse"]:after {
	width: 1.25em;
	line-height: 0;
	content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
	transition: transform 0.35s ease;
	transform-origin: 0.5em 50%;
	margin-left: 0.3rem;
}
.nav-link[data-bs-toggle="collapse"][aria-expanded="true"]:after {
	transform: rotate(90deg);
}

@media (min-width: 992px) {
	/* layout */
	body.auth {
		padding-left: var(--dip-nav-width);
		transition: var(--dip-nav-widen-transition);
	}
	.navbar {
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		width: var(--dip-nav-width);
		transition: var(--dip-nav-widen-transition);
		align-items: unset;
		overflow-x: hidden;
		overflow-y: scroll;
		--bs-navbar-brand-margin-end: 0;
		--bs-navbar-brand-padding-y: 1.25rem;
	}
	.main-content {
		min-height: calc(100vh - 40px);
		--bs-gutter-x: 4.5rem;
	}

	/* navbar */
	.navbar-expand-lg {
		flex-direction: column;
	}
	.navbar-brand {
		align-self: center;
	}
	.navbar-expand-lg .navbar-nav {
		flex-direction: column;
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--dip-nav-widen-transition: none;
	}
}