.dec-display-flex {display: flex;}
.dec-flex-nowrap {flex-wrap: nowrap;}
.dec-flex-direction-row {flex-direction: row;}

body {
	background-color: var(--dec-background-color);
	font-size: 16px;
	font-family: var(--dec-font), sans-serif;
}
header {
	position: sticky;
	top: 0;
	z-index: 1020;
	background: linear-gradient(180deg,
		var(--dec-background-color) 0%,
		var(--dec-background-color) 60%,
		transparent 100%);
	height: 110px;
}
header a {
	display: block;
}
.content {
	position: fixed;
	top: 0;
	right: 0;
	left: 300px;
	bottom: 0;
	height: 100vh;
	background: grey;
	/*transition: left 0.25s;*/
	z-index:0;
}
.content iframe {
	width: 100%;
	height: 100vh;
	border: none;
	margin: 0;
}

.sidebar {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 57px;
	width: 300px;
	overflow-y: auto;
	overflow-x: hidden;
	background-color: var(--dec-background-color);
	/*transition: width 0.25s;*/
	z-index:1;
}
.sidebar-header-logo-container {
	font-size:1.5rem;
	padding: 1rem 1.5rem;
}
.sidebar-header-logo-container svg {
	margin-top: var(--dec-logo-margin-top);
}
.sidebar-header-icon-container {
	font-size:1.5rem;
	padding: 30px 15px;
	display: none;
}


.sidebar-container a {
	color: var(--dec-foreground-color);
	text-decoration: none;
	font-weight: 300;
}
.sidebar-container a:hover,
.sidebar-container a.active,
.sidebar-container .active .sidebar-menu-item
{
	background: var(--dec-gradient-horizonal);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: 700;
	letter-spacing: -0.6px;
}

.sidebar-menu-item {
	position: relative;
	display: block;
	padding: 0.7rem 0.25rem 0.7rem 0.5rem;
	border: 1px solid transparent;
	border-radius: 0.5rem;
	transition: background-color 0.5s;
	line-height: 1.25;
}
.sidebar-menu-item:hover,
.sidebar-menu-item:focus,
.sidebar-menu-item:focus-within
{

}
.sidebar-menu-item-title {
	margin-left: 0.5rem;
	width: 100%;
}

.sidebar-menu-item-expander {
	margin-right: 0.5rem;
}



.sidebar-menu-item.active {
	border-radius: 0.5rem;
	position: relative;
	font-weight: 700;
	letter-spacing: -0.6px;
}
.sidebar-menu-item.active:before {
	content: "";
	position: absolute;
	inset: 0;
	padding: 1px;
	background: var(--dec-gradient-diagonal);
	border-radius: inherit;
	mask: conic-gradient(var(--dec-background-color) 0 0) content-box exclude, conic-gradient(var(--dec-background-color) 0 0);
}

.sidebar-menu-item-with-submenu-container {
	position: relative;
	border-radius: 0.5rem;
}
.sidebar-menu-item-with-submenu-bg {
	position: absolute;
	top: 0;
	width: 100%;
	bottom: 0;
	border-radius: inherit;
	pointer-events: none;
}
.sidebar-menu-item-with-submenu-container.active .sidebar-menu-item-with-submenu-bg:after {
	content: "";
	position: absolute;
	inset: 0;
	padding: 1px;
	background: var(--dec-gradient-diagonal);
	border-radius: inherit;
	mask: conic-gradient(var(--dec-background-color) 0 0) content-box exclude, conic-gradient(var(--dec-background-color) 0 0);
}

.sidebar-menu {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	transition: padding 0.25s;
}




.sidebar-submenu-container {
	display: none;
}
.sidebar-submenu {
	margin-top: -0.25rem;
	padding-left: 2.25rem;
	padding-bottom: 1rem;
}
.sidebar-submenu-item {
	display: block;
	line-height: 1.25;
	font-size: 95% !important;
}
.sidebar-submenu-item.active {
	font-weight: 900;
}




.sidebar-bottom {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 300px;
	z-index: 2;
	background-color: var(--dec-background-color);
}
.sidebar-bottom-btn {
	display: block;
}
.sidebar-bottom-btn:hover,
.sidebar-bottom-btn.active
{
	background: var(--dec-gradient-diagonal);
	letter-spacing: -0.15px;
}
.sidebar-bottom-controls
{
	border-top: 1px solid var(--dec-border-color);
	padding: 1.25rem 3rem 1.25rem 2rem;
	position: relative;
}
.sidebar-bottom-panel {
	border-top: 1px solid var(--dec-border-color);
	background-color: var(--dec-background-color);
	/*background: linear-gradient(0deg, var(--dec-border-color) 0, var(--dec-background-color) 1rem);*/
	padding: 1rem 1rem 0.5rem 2rem;
}
.sidebar-bottom-panel a {
	display: block;
	margin-bottom: 0.5rem;
}
.collapse-sidebar-btn {
	position: absolute;
	right: 1.25rem;
	top: 1.25rem;
}

.sidebar-bottom-controls-collapsed {
	border-top: 1px solid var(--dec-border-color);
	padding: 1rem 0;
	display: none;
	text-align: center;
}



.sidebar-collapsed .sidebar,
.sidebar-collapsed .sidebar-bottom
{
	/*width: 60px;*/
}
.sidebar-collapsed .content {
	/*left: 60px;*/
}
.hover-sidebar-expanded .sidebar,
.hover-sidebar-expanded .sidebar-bottom
{
	/*width: 300px;*/
}




.sidebar-collapsed .sidebar-bottom-controls-collapsed,
.sidebar-collapsed .sidebar-header-icon-container
{
	/*display: block;*/
}
.sidebar-collapsed .sidebar-menu-item-title,
.sidebar-collapsed .sidebar-bottom-controls,
.sidebar-collapsed .sidebar-header-logo-container
{
	 /*display: none;*/
 }
.sidebar-collapsed.hover-sidebar-expanded .sidebar-menu-item-title {
	/*display: inline;*/
}

.sidebar-collapsed .sidebar-menu-item-icon {
	padding-left: 2px;
}


.sidebar-collapsed .sidebar-menu {
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}
.sidebar-collapsed.hover-sidebar-expanded .sidebar-menu {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}