grocy/public/css/grocy_menu_layout.css

html {
	position: relative;
	min-height: 100%;
}

body {
	overflow-x: hidden;
}

body.fixed-nav {
	padding-top: 56px;
}

.content-wrapper {
	min-height: calc(100vh - 56px);
	padding-top: 1rem;
}

#mainNav .navbar-collapse {
	overflow: auto;
	max-height: 75vh;
}

#mainNav .navbar-collapse .navbar-nav .nav-item .nav-link {
	cursor: pointer;
}

#mainNav .navbar-collapse .navbar-sidenav .nav-link-collapse:after {
	float: right;
	content: '\f107';
	font-family: 'Font Awesome 6 Free';
}

#mainNav .navbar-collapse .navbar-sidenav .nav-link-collapse.collapsed:after {
	content: '\f105';
}

#mainNav .navbar-collapse .navbar-sidenav .sidenav-second-level,
#mainNav .navbar-collapse .navbar-sidenav .sidenav-third-level {
	padding-left: 0;
}

#mainNav .navbar-collapse .navbar-sidenav .sidenav-second-level>li>a,
#mainNav .navbar-collapse .navbar-sidenav .sidenav-third-level>li>a {
	display: block;
	padding: 0.5em 0;
}

#mainNav .navbar-collapse .navbar-sidenav .sidenav-second-level>li>a:focus,
#mainNav .navbar-collapse .navbar-sidenav .sidenav-second-level>li>a:hover,
#mainNav .navbar-collapse .navbar-sidenav .sidenav-third-level>li>a:focus,
#mainNav .navbar-collapse .navbar-sidenav .sidenav-third-level>li>a:hover {
	text-decoration: none;
}

#mainNav .navbar-collapse .navbar-sidenav .sidenav-second-level>li>a {
	padding-left: 1em;
}

#mainNav .navbar-collapse .navbar-sidenav .sidenav-third-level>li>a {
	padding-left: 2em;
}

#mainNav .navbar-collapse .sidenav-toggler {
	display: none;
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link {
	position: relative;
	min-width: 45px;
	max-width: 75%;
	margin-left: auto;
	margin-right: auto;
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link:after {
	float: right;
	width: auto;
	content: '\f105';
	border: none;
	font-family: 'Font Awesome 6 Free';
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link .indicator {
	position: absolute;
	top: 5px;
	left: 21px;
	font-size: 10px;
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown.show>.nav-link:after {
	content: '\f107';
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown .dropdown-menu>.dropdown-item>.dropdown-message {
	overflow: hidden;
	max-width: none;
	text-overflow: ellipsis;
}

@media (min-width: 992px) {
	#mainNav .navbar-brand {
		width: 250px;
	}

	.sidenav-toggled>#mainNav .navbar-brand {
		width: 130px;
	}

	#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link {
		max-width: 100%;
	}

	#mainNav .navbar-collapse {
		overflow: visible;
		max-height: none;
	}

	#mainNav .navbar-collapse .navbar-sidenav {
		position: absolute;
		top: 0;
		left: 0;
		flex-direction: column;
		margin-top: 56px;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item {
		width: 250px;
		padding: 0;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item>.nav-link {
		padding: 1em;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level,
	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level {
		padding-left: 0;
		list-style: none;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li,
	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li {
		width: 250px;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a,
	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li>a {
		padding: 1em;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a {
		padding-left: 2.75em;
	}

	#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li>a {
		padding-left: 3.75em;
	}

	#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link {
		min-width: 0;
	}

	#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link:after {
		width: 24px;
		text-align: center;
	}

	#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown .dropdown-menu>.dropdown-item>.dropdown-message {
		max-width: 300px;
	}
}

.navbar-nav,
.navbar-nav .dropdown-item {
	text-align: center;
}

#mainNav.fixed-top .sidenav-toggler {
	display: none;
}

@media (min-width: 992px) {

	.navbar-nav,
	.navbar-nav .dropdown-item {
		text-align: left;
	}

	.sidenav-toggled .navbar-nav {
		text-align: center;
	}

	#mainNav.fixed-top .navbar-sidenav {
		height: calc(100vh - 112px);
	}

	#mainNav.fixed-top .sidenav-toggler {
		position: absolute;
		top: 0;
		left: 0;
		display: flex;
		flex-direction: column;
		margin-top: calc(100vh - 56px);
	}

	#mainNav.fixed-top .sidenav-toggler>.nav-item {
		width: 250px;
		padding: 0;
	}

	#mainNav.fixed-top .sidenav-toggler>.nav-item>.nav-link {
		padding: 1em;
	}
}

#mainNav.fixed-top.navbar-light .sidenav-toggler {
	background-color: #d6d6d6;
}

#mainNav.fixed-top.navbar-light .sidenav-toggler a i {
	color: rgba(0, 0, 0, 0.5);
}

body.sidenav-toggled #mainNav.fixed-top .sidenav-toggler {
	overflow-x: hidden;
	width: 55px;
}

body.sidenav-toggled #mainNav.fixed-top .sidenav-toggler .nav-item,
body.sidenav-toggled #mainNav.fixed-top .sidenav-toggler .nav-link {
	width: 55px !important;
}

body.sidenav-toggled #mainNav.fixed-top #sidenavToggler i {
	transform: scaleX(-1);
	filter: FlipH;
}

.content-wrapper {
	overflow-x: hidden;
	background: white;
}

@media (min-width: 992px) {
	.content-wrapper {
		margin-left: 250px;
	}
}

#sidenavToggler i {
	font-weight: 800;
}

.navbar-sidenav-tooltip.show {
	display: none;
}

@media (min-width: 992px) {
	body.sidenav-toggled .content-wrapper {
		margin-left: 55px;
	}
}

body.sidenav-toggled .navbar-sidenav {
	width: 55px;
}

body.sidenav-toggled .navbar-sidenav .nav-link-text {
	display: none;
}

body.sidenav-toggled .navbar-sidenav .nav-item,
body.sidenav-toggled .navbar-sidenav .nav-link {
	width: 55px !important;
}

body.sidenav-toggled .navbar-sidenav .nav-item:after,
body.sidenav-toggled .navbar-sidenav .nav-link:after {
	display: none;
}

body.sidenav-toggled .navbar-sidenav .nav-item {
	white-space: nowrap;
}

body.sidenav-toggled .navbar-sidenav-tooltip.show {
	display: flex;
}

#mainNav {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

@media (min-width: 992px) {
	#mainNav {
		padding-left: 0.75rem;
		padding-right: 0;
	}

	.sidenav-toggled>#mainNav {
		padding-left: 0.25rem;
	}
}

#mainNav.navbar-light .navbar-collapse .navbar-sidenav .nav-link-collapse:after {
	color: rgba(0, 0, 0, 0.5);
}

#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item>.nav-link {
	color: rgba(0, 0, 0, 0.5);
}

#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item>.nav-link:hover {
	color: rgba(0, 0, 0, 0.7);
}

#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a,
#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li>a {
	color: rgba(0, 0, 0, 0.5);
}

#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a:focus,
#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a:hover,
#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li>a:focus,
#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level>li>a:hover {
	color: rgba(0, 0, 0, 0.7);
}

#mainNav.navbar-light .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link:after {
	color: rgba(0, 0, 0, 0.5);
}

@media (min-width: 992px) {
	#mainNav.navbar-light .navbar-collapse .navbar-sidenav {
		background: #f8f9fa;
	}

	#mainNav.navbar-light .navbar-collapse .navbar-sidenav li.active a {
		color: #000 !important;
		background-color: #d6d6d6;
	}

	#mainNav.navbar-light .navbar-collapse .navbar-sidenav li.active a:focus,
	#mainNav.navbar-light .navbar-collapse .navbar-sidenav li.active a:hover {
		color: #000;
	}

	#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level,
	#mainNav.navbar-light .navbar-collapse .navbar-sidenav>.nav-item .sidenav-third-level {
		background: #f8f9fa;
	}
}

#mainNav {
	line-height: 1;
	background-color: #e5e5e5 !important;
	border-bottom: 2px solid !important;
	border-color: #d6d6d6 !important;
	padding-bottom: 0.3rem;
}

#mainNav .dropdown-menu {
	line-height: 1.5;
}

.navbar-sidenav {
	overflow: hidden;
	border-top: 2px solid !important;
}

.navbar-sidenav:hover {
	overflow-y: auto;
}

.navbar-sidenav,
.sidenav-second-level {
	background-color: #e5e5e5 !important;
	border-right: 2px solid !important;
	border-color: #d6d6d6 !important;
}

.navbar-nav .dropdown-menu {
	background-color: #e5e5e5 !important;
	border: 0;
	border-radius: 0;
}

.navbar-nav .dropdown-divider,
.nav-item-divider {
	border-top: 2px solid !important;
	border-color: #d6d6d6 !important;
}

.sidenav-toggler {
	background-color: #d6d6d6 !important;
	border-right: 2px solid !important;
	border-color: #d6d6d6 !important;
}

.navbar-sidenav>li:hover,
.sidenav-second-level>li:hover,
.navbar-nav .dropdown-item:hover,
.navbar-sidenav>li>a:focus,
.sidenav-second-level>li>a:focus,
.navbar-nav .dropdown-item:focus,
.active-page {
	box-shadow: inset 7px 0 0 #337ab7 !important;
	background-color: #d6d6d6 !important;
}

.navbar-brand {
	margin-right: 0;
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link:after,
#mainNav .navbar-collapse .navbar-sidenav .nav-link-collapse:after {
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
}

#mainNav .navbar-collapse .navbar-nav>.nav-item.dropdown>.nav-link.py-0:after,
#mainNav .navbar-collapse .navbar-sidenav .nav-link-collapse.py-0:after {
	padding-top: 8px;
}

#mainNav .navbar-collapse .navbar-sidenav>.nav-item>.nav-link,
#mainNav .navbar-collapse .navbar-sidenav>.nav-item .sidenav-second-level>li>a {
	padding: 0.75em;
}

@media (min-width: 992px) {
	#mainNav .navbar-collapse .navbar-sidenav {
		margin-top: 46px;
	}

	#mainNav.fixed-top .navbar-sidenav {
		height: calc(100vh - 94px)
	}

	#mainNav.fixed-top .sidenav-toggler {
		margin-top: calc(100vh - 48px);
	}

	.content-wrapper {
		margin-left: 245px;
	}
}

#mainNav .navbar-collapse .navbar-sidenav>.nav-item>.nav-link {
	padding-right: 1.25em !important;
}

#sidebarResponsive .nav-item-sidebar {
	line-height: 1;
}

body.embedded.fixed-nav {
	padding-top: 0;
}

body.fixed-nav {
	padding-top: 54px;
}

@media print {
	body.fixed-nav {
		padding-top: 0;
	}
}