@charset "utf-8";
/* CSS Document */

.wrapper_h {
	width: 100%;
	height: calc(100vh - 56px - 54px - 50px);
}

.wrapper_left {
	display: flex;
	width: 100%;
	align-items: stretch;
	min-height: calc(100vh - 56px - 54px);
}

#sidebar_leftmenu {
	/*
	min-width: 150px;
	max-width: 150px;
	*/
	background: #E9ECEF; /* #34495E */
	color: #495057; /* fff */
	transition: all 0.3s;
	position: relative;
	z-index: 1020; /* Below top-div, above content */
	color: #999;
}

/* --- Desktop Toggled Styles --- */
#sidebar_leftmenu.toggled {
	min-width: 80px;
	max-width: 80px;
	text-align: center;
}
#sidebar_leftmenu.toggled .sidebar_leftmenu-header h3,
#sidebar_leftmenu.toggled .list-unstyled .nav-link span {
	display: none;
}
#sidebar_leftmenu.toggled .list-unstyled .nav-link i {
	margin-right: 0; display: block; font-size: 1.8em; margin-bottom: 5px; color: #495057;
}
#sidebar_leftmenu.toggled .list-unstyled .nav-item {
	position: relative;
}
#sidebar_leftmenu.toggled .dropdown-toggle::after {
	display: none;
}
#sidebar_leftmenu.toggled .list-unstyled .nav-item:hover {
	background: #E9ECEF; /* #1ABC9C */
}
#sidebar_leftmenu.toggled .submenu {
	position: absolute; left: 100%; top: 0; min-width: 220px;
	background-color: #E9ECEF; /* #34495E */ box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.17);
	display: none; padding: 0; list-style: none; z-index: 1050;
	height: auto !important; visibility: visible !important; overflow: visible !important;
}
#sidebar_leftmenu.toggled .nav-item:hover > .submenu { display: block; }
#sidebar_leftmenu.toggled .submenu a {
	padding: 10px 10px !important; color: #495057; font-size: 1.1em !important; text-align: left;
}
#sidebar_leftmenu.toggled .submenu a i { display: none; }
#sidebar_leftmenu.toggled .submenu a span { display: inline !important; }
#sidebar_leftmenu.toggled .submenu a:hover { background: #E9ECEF; }
#sidebar_leftmenu.toggled .submenu .nav-item { position: relative; }
#sidebar_leftmenu.toggled .submenu .nav-item .submenu { top: 0; left: 100%; }
#sidebar_leftmenu.toggled .submenu .dropdown-toggle::after {
	display: block; content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900;
	float: right; border: none; margin-top: 3px; font-size: 1em;
	transform: none !important; position: static;
}


/* --- Base sidebar_leftmenu Styles (Expanded & Mobile Base) --- */
#sidebar_leftmenu .sidebar_leftmenu-header { padding: 15px; background: #EEEEEE; text-align: center; } /* #2C3E50 */
#sidebar_leftmenu ul.components { padding: 15px 0; }
#sidebar_leftmenu ul li a {
	padding: 10px 10px; font-size: 1.1em; display: block; color: #495057; /* #ECF0F1 */
	text-decoration: none; transition: all 0.2s; position: relative; /* For arrow */
}
#sidebar_leftmenu ul li a i { margin-right: 10px; }
#sidebar_leftmenu ul li a:hover, #sidebar_leftmenu ul li a.active { color: #495057; background: #E9ECEF; }
#sidebar_leftmenu .dropdown-toggle::after {
	display: block; position: absolute; top: 50%; right: 15px;
	transform: translateY(-50%) rotate(0deg); transition: transform 0.2s;
	content: "\f078"; font-family: "Font Awesome 6 Free"; font-weight: 900; border: none;
}
#sidebar_leftmenu a[aria-expanded="true"]::after { transform: translateY(-50%) rotate(180deg); }
#sidebar_leftmenu ul ul a { font-size: 1em !important; padding-left: 45px !important; background: #EEEEEE; } /* #2C3E50; */
#sidebar_leftmenu ul ul ul a { padding-left: 60px !important; background: #E9ECEE; } /* #212F3D */

/* --- Collapse (Not Toggled) --- */
#sidebar_leftmenu:not(.toggled) .submenu {
	position: static;
	padding: 0;
	list-style: none;
	background: #EEEEEE; /* Ensure background */ /* #2C3E50 */
	/* Let Bootstrap handle display */
}

#content_body { width: 100%; padding: 10px; min-height: calc(100vh - 56px - 54px); transition: all 0.3s; background-color: #f8f9fa; }

/* --- Mobile Styles --- */
@media (max-width: 991.98px) {
	#sidebar_leftmenu {
		margin-left: -250px;
		position: fixed; /* Make mobile fixed */
		height: 100vh;
		z-index: 1100; /* Above overlay */
	}
	#sidebar_leftmenu.toggled { /* Reset toggled styles for mobile view */
		min-width: 250px; max-width: 250px; text-align: left;
		margin-left: -250px; /* Still hidden */
	}
	 #sidebar_leftmenu.toggled .sidebar_leftmenu-header h3,
	 #sidebar_leftmenu.toggled .list-unstyled .nav-link span { display: inline; }
	 #sidebar_leftmenu.toggled .list-unstyled .nav-link i {
		margin-right: 10px; display: inline-block; font-size: 1.1em; margin-bottom: 0;
	 }

	#sidebar_leftmenu.active { /* Show sidebar_leftmenu on mobile */
		margin-left: 0;
	}

	/* Ensure submenus are static & arrows work on mobile */
	#sidebar_leftmenu .submenu {
		position: static !important;
		left: auto !important; top: auto !important; min-width: 100% !important;
		background-color: #EEEEEE !important; box-shadow: none !important; /* #2C3E50 */
		padding: 0 !important; display: none; /* Let collapse manage display */
		z-index: auto !important;
	}
	/* Make sure .show displays it */
	#sidebar_leftmenu .submenu.show {
		display: block !important;
	}
	/* Disable ALL popout/hover effects */
	#sidebar_leftmenu.toggled .nav-item:hover > .submenu,
	#sidebar_leftmenu .nav-item:hover > .submenu {
		display: none !important;
	}
	/* Force collapse.show to win on mobile */
	 #sidebar_leftmenu .submenu.collapse.show {
		display: block !important;
	 }

	/* Ensure arrows are always down-style on mobile */
	#sidebar_leftmenu .dropdown-toggle::after,
	#sidebar_leftmenu.toggled .submenu .dropdown-toggle::after {
		display: block !important; position: absolute !important; top: 50% !important;
		right: 20px !important; transform: translateY(-50%) rotate(0deg) !important;
		content: "\f078" !important; float: none !important;
	}
	#sidebar_leftmenu a[aria-expanded="true"]::after,
	#sidebar_leftmenu.toggled a[aria-expanded="true"]::after {
		transform: translateY(-50%) rotate(180deg) !important;
	}

	/* Backdrop */
	.modal-backdrop {
		z-index: 1040;
	}
}