/**
 * Layout overrides: sidebar closed by default, off-canvas on all screen sizes.
 * Sidebar opens only via profile icon click.
 */

/* All screen sizes: sidebar off-canvas (hidden by default) */
.top-header {
	left: 0 !important;
}

.page-content-wrapper {
	margin-left: 0 !important;
}

.footer {
	margin-left: 0 !important;
}

.sidebar-wrapper {
	left: -260px !important;
	width: 260px !important;
	box-shadow: none;
	z-index: 16;
	transition: left 0.25s ease-out, box-shadow 0.25s ease-out;
	display: flex;
	flex-direction: column;
}
/* Restore visibility when closed (critical CSS hides it on load) - ensures sidebar is never partially visible */
.wrapper:not(.toggled) .sidebar-wrapper {
	visibility: hidden !important;
	transition: none !important;
}

.sidebar-footer {
	flex-shrink: 0;
}

/* Overlay hidden by default */
.overlay.toggle-btn-mobile {
	display: none;
	pointer-events: none;
}

/* Sidebar OPEN (wrapper.toggled): slide in + overlay, extend to top so profile fills gap */
.wrapper.toggled .sidebar-wrapper {
	left: 0 !important;
	top: 0 !important;
	height: 100% !important;
	box-shadow: 0.3rem 0 0.6rem rgba(0, 0, 0, 0.13);
	visibility: visible !important;
	transition: left 0.25s ease-out, box-shadow 0.25s ease-out !important;
}

/* Profile block at top - no gap, flush to top */
.sidebar-profile-top {
	flex-shrink: 0;
	margin: 0;
	padding: 0.5rem 1rem;
	border-bottom: 1px solid #e4e4e4;
}

/* Remove top padding/margin so no gap between profile and menu */
.sidebar-wrapper .metismenu {
	padding-top: 0 !important;
}

.sidebar-wrapper .metismenu li:first-child {
	margin-top: 0 !important;
}

.wrapper.toggled .overlay.toggle-btn-mobile {
	display: block !important;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #000;
	opacity: 0.6;
	z-index: 15;
	pointer-events: auto;
	cursor: pointer;
	transition: opacity 0.2s ease-out;
}

/* Disable desktop "collapsed strip" behavior */
.wrapper.toggled:not(.sidebar-hovered) .sidebar-wrapper,
.wrapper.toggled .sidebar-wrapper {
	width: 260px !important;
}

.wrapper.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu a {
	justify-content: flex-start;
}

.wrapper.toggled .sidebar-wrapper .metismenu .menu-title,
.wrapper.toggled .sidebar-wrapper .metismenu li.menu-label,
.wrapper.toggled .sidebar-wrapper .metismenu .has-arrow:after {
	display: block !important;
}

/* Fix menu overlap: ensure proper positioning and prevent overlap */
.sidebar-wrapper .metismenu li ul {
	position: relative;
	z-index: 1;
}

/* Override app.css rule that hides sub-menus when toggled - metismenu adds mm-show to the ul */
.wrapper.toggled .sidebar-wrapper .metismenu ul.mm-show {
	display: block !important;
}

/* Ensure menu items don't overlap and flow naturally */
.sidebar-wrapper .metismenu > li {
	position: relative;
	z-index: auto;
}

.sidebar-wrapper .metismenu li {
	position: relative;
	z-index: auto;
}

/* Prevent sub-menu items from overlapping content below - only adjust spacing */
.sidebar-wrapper .metismenu ul {
	margin: 0;
	padding: 0;
}

/* Show left-topbar for profile section */
.left-topbar {
	display: flex !important;
}

/* Center topbar for action buttons */
.center-topbar {
	display: flex;
	justify-content: center;
}

/* Right topbar for logo */
.right-topbar {
	display: flex;
	align-items: center;
}
