/* Netoneo Studio - Mobile Menu (Off Canvas) */

.netoneo-mm-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: none;
	background: transparent;
	line-height: 1;
	transition: color 0.2s ease, background-color 0.2s ease;
}

.netoneo-mm-trigger.netoneo-mm-icon-right {
	flex-direction: row-reverse;
}

.netoneo-mm-trigger svg {
	fill: currentColor;
}

.netoneo-mm-overlay {
	position: fixed;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition-property: opacity, visibility;
	transition-timing-function: ease;
	z-index: 999998;
}

.netoneo-mm-overlay.netoneo-mm-active {
	visibility: visible;
	pointer-events: auto;
}

.netoneo-mm-offcanvas {
	position: fixed;
	top: 0;
	background: #ffffff;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box;
	visibility: hidden;
	z-index: 999999;
	transition-property: transform, opacity, visibility;
	transition-timing-function: ease;
}

.netoneo-mm-offcanvas.netoneo-mm-active {
	visibility: visible;
}

/* ===== Mode: Slide (arah mengikuti posisi panel) ===== */
.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-right {
	top: 0;
	right: 0;
	height: 100dvh;
	transform: translateX(100%);
}
.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-right.netoneo-mm-active {
	transform: translateX(0);
}

.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-left {
	top: 0;
	left: 0;
	height: 100dvh;
	transform: translateX(-100%);
}
.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-left.netoneo-mm-active {
	transform: translateX(0);
}

.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-top {
	top: 0;
	left: 0;
	width: 100%;
	transform: translateY(-100%);
}
.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-top.netoneo-mm-active {
	transform: translateY(0);
}

.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-bottom {
	bottom: 0;
	top: auto;
	left: 0;
	width: 100%;
	transform: translateY(100%);
}
.netoneo-mm-offcanvas.netoneo-mm-anim-slide.netoneo-mm-pos-bottom.netoneo-mm-active {
	transform: translateY(0);
}

/* ===== Mode: Fade ===== */
.netoneo-mm-offcanvas.netoneo-mm-anim-fade {
	opacity: 0;
	transform: none;
}
.netoneo-mm-offcanvas.netoneo-mm-anim-fade.netoneo-mm-pos-right {
	top: 0;
	right: 0;
	height: 100dvh;
}
.netoneo-mm-offcanvas.netoneo-mm-anim-fade.netoneo-mm-pos-left {
	top: 0;
	left: 0;
	height: 100dvh;
}
.netoneo-mm-offcanvas.netoneo-mm-anim-fade.netoneo-mm-pos-top {
	top: 0;
	left: 0;
	width: 100%;
}
.netoneo-mm-offcanvas.netoneo-mm-anim-fade.netoneo-mm-pos-bottom {
	bottom: 0;
	top: auto;
	left: 0;
	width: 100%;
}
.netoneo-mm-offcanvas.netoneo-mm-anim-fade.netoneo-mm-active {
	opacity: 1;
}

.netoneo-mm-close {
	position: absolute;
	top: 20px;
	right: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	background: transparent;
	cursor: pointer;
	line-height: 1;
	/* Angka tinggi & terisolasi dari konten template supaya tombol close
	   selalu tampil paling atas, apa pun elemen/animasi di dalam template. */
	z-index: 999999999;
	transition: color 0.2s ease, background-color 0.2s ease;
}

.netoneo-mm-close svg {
	fill: currentColor;
}

.netoneo-mm-content {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	/* "isolation: isolate" membuat konten template jadi stacking context
	   sendiri, jadi z-index berapa pun di dalam template (widget, popup,
	   dsb dari Elementor) tetap terkunci di dalam sini dan tidak bisa
	   "lolos" menutupi tombol close di atasnya. */
	position: relative;
	isolation: isolate;
	z-index: 0;
}

/* Jaring pengaman: pastikan wrapper widget ini sendiri tidak memotong
   (overflow: hidden) atau mengubah containing-block panel off-canvas
   (mis. lewat transform dari efek/animasi Elementor lain di wrapper). */
.elementor-widget-netoneo-mobile-menu,
.elementor-widget-netoneo-mobile-menu > .elementor-widget-container {
	overflow: visible !important;
	transform: none !important;
}

/* Kunci scroll body saat panel terbuka */
body.netoneo-mm-scroll-lock {
	overflow: hidden !important;
}