/* Mobile Slide Menu for Elementor */

.mlm-menu {
	--mlm-z: 9999;
	--mlm-icon-size: 28px;
	--mlm-line-h: 3px;
	--mlm-line-gap: 6px;
	--mlm-icon-color: #000;
	--mlm-icon-color-active: #fff;
	--mlm-icon-dur: 300ms;
	--mlm-panel-w: 100%;
	--mlm-panel-dur: 550ms;
	--mlm-panel-delay: 120ms;
	--mlm-pre-dur: 380ms;
	--mlm-pre-close-delay: 120ms;
	--mlm-ease: cubic-bezier(0.77, 0, 0.175, 1);

	display: flex;
	justify-content: flex-start;
	align-items: center;
}

/* ------------------------------------------------------------ Burger */

.mlm-burger {
	position: relative;
	z-index: calc(var(--mlm-z) + 1);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
	margin: 0;
	background: transparent;
	border: none;
	cursor: pointer;
	line-height: 0;
	transition: background-color var(--mlm-icon-dur) ease;
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
	-webkit-user-select: none;
	user-select: none;
}

.mlm-burger:focus {
	outline: none;
}

.mlm-burger.is-fixed {
	position: fixed !important;
	margin: 0 !important;
	z-index: calc(var(--mlm-z) + 2);
}

.mlm-burger-ph {
	display: none;
}

.mlm-burger__box {
	position: relative;
	display: block;
	width: var(--mlm-icon-size);
	height: calc(var(--mlm-line-h) * 3 + var(--mlm-line-gap) * 2);
}

.mlm-burger__line {
	position: absolute;
	left: 0;
	width: 100%;
	height: var(--mlm-line-h);
	background: var(--mlm-icon-color);
	border-radius: calc(var(--mlm-line-h) / 2);
	transition:
		top var(--mlm-icon-dur) var(--mlm-ease),
		transform var(--mlm-icon-dur) var(--mlm-ease),
		opacity var(--mlm-icon-dur) ease,
		background-color var(--mlm-icon-dur) ease;
}

.mlm-burger__line:nth-child(1) { top: 0; }
.mlm-burger__line:nth-child(2) { top: calc(var(--mlm-line-h) + var(--mlm-line-gap)); }
.mlm-burger__line:nth-child(3) { top: calc((var(--mlm-line-h) + var(--mlm-line-gap)) * 2); }

/* Burger -> Cross */
.mlm-menu.is-open .mlm-burger__line {
	background: var(--mlm-icon-color-active);
}

.mlm-menu.is-open .mlm-burger__line:nth-child(1) {
	top: calc(var(--mlm-line-h) + var(--mlm-line-gap));
	transform: rotate(45deg);
}

.mlm-menu.is-open .mlm-burger__line:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}

.mlm-menu.is-open .mlm-burger__line:nth-child(3) {
	top: calc(var(--mlm-line-h) + var(--mlm-line-gap));
	transform: rotate(-45deg);
}

/* ------------------------------------------------- Panel + Pre-layer */

.mlm-pre,
.mlm-panel {
	position: fixed;
	top: 0;
	height: 100vh;
	height: 100dvh;
	width: var(--mlm-panel-w);
	max-width: 100%;
	z-index: var(--mlm-z);
	visibility: hidden;
	will-change: transform;
}

.mlm-side-left .mlm-pre,
.mlm-side-left .mlm-panel {
	left: 0;
	transform: translateX(-105%);
}

.mlm-side-right .mlm-pre,
.mlm-side-right .mlm-panel {
	right: 0;
	transform: translateX(105%);
}

/* Pre-layer sits UNDER the panel (same z-index, earlier in the DOM). */
.mlm-pre {
	background: #e74c3c;
	/* closing: waits a bit so it stays visible behind the leaving panel */
	transition: transform var(--mlm-pre-dur) var(--mlm-ease) var(--mlm-pre-close-delay);
}

.mlm-panel {
	background: #111;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	/* closing: leaves immediately */
	transition: transform var(--mlm-panel-dur) var(--mlm-ease) 0ms;
}

/* Open state: pre-layer goes first, panel follows after a delay */
.mlm-menu.is-open .mlm-pre {
	transform: translateX(0);
	visibility: visible;
	transition-delay: 0ms;
}

.mlm-menu.is-open .mlm-panel {
	transform: translateX(0);
	visibility: visible;
	transition-delay: var(--mlm-panel-delay);
}

/* Keep layers visible while the closing animation plays */
.mlm-menu.is-closing .mlm-pre,
.mlm-menu.is-closing .mlm-panel {
	visibility: visible;
}

/* The template always fills the panel edge-to-edge, starting at the very
   top of the screen. The burger/cross button is a pure overlay and never
   affects the template layout. */
.mlm-panel__inner {
	min-height: 100%;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
}

.mlm-panel__inner > .elementor {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	margin: 0 !important;
}

.mlm-panel__inner > .elementor > .elementor-section,
.mlm-panel__inner > .elementor > .e-con {
	flex-grow: 1;
}

.mlm-panel__inner > .elementor > .elementor-section:first-child,
.mlm-panel__inner > .elementor > .e-con:first-child {
	margin-top: 0 !important;
}

.mlm-empty {
	padding: 40px 20px;
	color: #fff;
	font-size: 14px;
	opacity: 0.7;
}

/* Scroll lock */
html.mlm-scroll-lock,
html.mlm-scroll-lock body {
	overflow: hidden !important;
}

/* Editor preview: force the open state without JS */
.mlm-menu.mlm-preview-open .mlm-pre,
.mlm-menu.mlm-preview-open .mlm-panel {
	transform: translateX(0) !important;
	visibility: visible !important;
	transition: none !important;
}