/**
 * NetoCore mobile mega menu — full-height columns + soft gray UI
 */

.netocore-mm {
	--nc-mm-accent: var(--nc-mega-accent, #2563eb);
	--nc-mm-accent-soft: var(--nc-mega-accent-soft, rgba(37, 99, 235, 0.1));
	--nc-mm-icon: var(--nc-mega-muted, #6b7280);
	--nc-mm-text: var(--nc-mega-text, #4b5563);
	--nc-mm-text-soft: var(--nc-mega-muted, #9ca3af);
	--nc-mm-border: var(--nc-mega-border, #e8eaef);
	--nc-mm-border-soft: var(--nc-mega-border, #f0f1f4);
	--nc-mm-bg: var(--nc-mega-bg, #ffffff);
	--nc-mm-bg-muted: var(--nc-mega-sidebar-bg, #f6f7f9);
	--nc-mm-bg-sidebar: var(--nc-mega-sidebar-bg, #f3f4f7);

	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	height: min(85vh, 640px) !important;
	max-height: 85vh !important;
	min-height: 0 !important;
	background: var(--nc-mm-bg) !important;
	font-family: "Vazirmatn FD", Vazirmatn, Tahoma, sans-serif !important;
	color: var(--nc-mm-text) !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
	direction: rtl !important;
	-webkit-font-smoothing: antialiased;
}

.netocore-mm *,
.netocore-mm *::before,
.netocore-mm *::after {
	box-sizing: border-box !important;
}

/* —— Header (fixed height) —— */
.netocore-mm-header {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 10px !important;
	flex: 0 0 auto !important;
	padding: 12px 14px !important;
	border-bottom: 1px solid var(--nc-mm-border-soft) !important;
	background: var(--nc-mm-bg) !important;
}

.netocore-mm-title {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--nc-mm-text-soft, #6b7280) !important;
	letter-spacing: -0.01em !important;
}

.netocore-mm-close {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 32px !important;
	height: 32px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--nc-mm-border) !important;
	border-radius: 8px !important;
	background: var(--nc-mm-bg-muted) !important;
	color: var(--nc-mm-icon) !important;
	cursor: pointer !important;
}

.netocore-mm-close svg {
	width: 16px !important;
	height: 16px !important;
	stroke: var(--nc-mm-icon) !important;
	color: var(--nc-mm-icon) !important;
}

/* —— Body: full height (no header) —— */
.netocore-mm-body {
	display: grid !important;
	grid-template-columns: var(--nc-mm-sidebar-w) minmax(0, 1fr) !important;
	grid-template-rows: 1fr !important;
	flex: 1 1 auto !important;
	min-height: 0 !important;
	height: 100% !important;
	overflow: hidden !important;
	background: var(--nc-mm-bg) !important;
}

/* —— Right column: full height + scroll —— */
.netocore-mm-sidebar {
	grid-column: 1 !important;
	grid-row: 1 !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: 100% !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
	background: var(--nc-mm-bg-sidebar) !important;
	border-left: 1px solid var(--nc-mm-border) !important;
	scrollbar-width: thin;
	scrollbar-color: #d5d8e0 transparent;
}

.netocore-mm-cats {
	display: flex !important;
	flex-direction: column !important;
	padding: 6px 0 24px !important;
	gap: 2px !important;
	min-height: min-content !important;
}

.netocore-mm-cat {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 5px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 10px 4px 9px !important;
	border: none !important;
	border-right: 2.5px solid transparent !important;
	background: transparent !important;
	color: var(--nc-mm-text) !important;
	cursor: pointer !important;
	font-family: inherit !important;
	text-align: center !important;
}

.netocore-mm-cat:hover {
	background: rgba(255, 255, 255, 0.55) !important;
	color: #374151 !important;
}

.netocore-mm-cat:hover .netocore-mm-cat-icon,
.netocore-mm-cat:hover .netocore-mm-cat-icon svg {
	color: #4b5563 !important;
	stroke: #4b5563 !important;
}

.netocore-mm-cat.is-active {
	background: #fff !important;
	color: var(--nc-mm-accent) !important;
	border-right-color: var(--nc-mm-accent) !important;
}

.netocore-mm-cat.is-active .netocore-mm-cat-name {
	color: var(--nc-mm-accent) !important;
}

.netocore-mm-cat.is-active .netocore-mm-cat-icon,
.netocore-mm-cat.is-active .netocore-mm-cat-icon svg {
	color: var(--nc-mm-accent) !important;
	stroke: var(--nc-mm-accent) !important;
}

.netocore-mm-cat-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: var(--nc-mm-cat-icon-size, 22px) !important;
	height: var(--nc-mm-cat-icon-size, 22px) !important;
	flex-shrink: 0 !important;
	color: var(--nc-mm-icon) !important;
}

.netocore-mm-cat-icon i,
.netocore-mm-cat-icon [class*="fa-"],
.netocore-mm-cat-icon [class*="eicon"] {
	font-size: calc(var(--nc-mm-cat-icon-size, 22px) * 0.9) !important;
	line-height: 1 !important;
}

.netocore-mm-cat-icon svg {
	width: var(--nc-mm-cat-icon-size, 20px) !important;
	height: var(--nc-mm-cat-icon-size, 20px) !important;
	display: block !important;
	color: var(--nc-mm-icon) !important;
	stroke: var(--nc-mm-icon) !important;
	fill: none !important;
}

.netocore-mm-cat-icon img {
	width: var(--nc-mm-cat-icon-size, 20px) !important;
	height: var(--nc-mm-cat-icon-size, 20px) !important;
	object-fit: contain !important;
	border-radius: 3px !important;
	display: block !important;
	opacity: 0.72;
	filter: grayscale(0.35);
}

.netocore-mm-cat.is-active .netocore-mm-cat-icon img {
	opacity: 1;
	filter: none;
}

.netocore-mm-cat-name {
	display: -webkit-box !important;
	-webkit-box-orient: vertical !important;
	-webkit-line-clamp: 2 !important;
	line-clamp: 2 !important;
	overflow: hidden !important;
	font-size: var(--nc-mm-cat-font-size, 9.5px) !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
	max-height: calc(var(--nc-mm-cat-font-size, 9.5px) * 1.3 * 2) !important;
	max-width: calc(var(--nc-mm-sidebar-w, 72px) - 8px) !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding: 0 2px !important;
	color: var(--nc-mm-text) !important;
	white-space: normal !important;
	word-break: break-word !important;
	overflow-wrap: anywhere !important;
	hyphens: auto !important;
	text-overflow: ellipsis !important;
}

/* —— Left column: full height + scroll —— */
.netocore-mm-panels {
	grid-column: 2 !important;
	grid-row: 1 !important;
	position: relative !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: 100% !important;
	min-width: 0 !important;
	overflow: hidden !important;
	background: var(--nc-mm-bg-muted) !important;
}

.netocore-mm-panel {
	display: none !important;
	position: absolute !important;
	inset: 0 !important;
	height: 100% !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	padding: 12px 12px 22px !important;
	background: var(--nc-mm-bg-muted) !important;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: #d5d8e0 transparent;
}

.netocore-mm-panel.is-active {
	display: block !important;
}

.netocore-mm-panel[hidden] {
	display: none !important;
}

.netocore-mm-panel-head {
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
	margin: 2px 2px 12px !important;
	padding: 0 !important;
	text-decoration: none !important;
	color: #6b7280 !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
}

.netocore-mm-panel-head:hover {
	color: var(--nc-mm-accent) !important;
}

.netocore-mm-chevron {
	flex-shrink: 0 !important;
	width: 16px !important;
	height: 16px !important;
	color: var(--nc-mm-text-soft) !important;
	stroke: var(--nc-mm-text-soft) !important;
}

/* —— Accordion —— */
.netocore-mm-accordions {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.netocore-mm-acc {
	border: 1px solid var(--nc-mm-border) !important;
	border-radius: 10px !important;
	background: #fff !important;
	overflow: hidden !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.025) !important;
}

.netocore-mm-acc.is-open {
	background: #f8f9fb !important;
	border-color: #eceef2 !important;
	box-shadow: none !important;
}

.netocore-mm-acc-toggle {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 8px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 12px !important;
	border: none !important;
	background: transparent !important;
	color: #6b7280 !important;
	font-family: inherit !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	text-align: right !important;
	text-decoration: none !important;
	cursor: pointer !important;
	line-height: 1.4 !important;
}

.netocore-mm-acc-label {
	flex: 1 !important;
	min-width: 0 !important;
	color: #6b7280 !important;
}

.netocore-mm-acc-icon {
	flex-shrink: 0 !important;
	width: 16px !important;
	height: 16px !important;
	color: var(--nc-mm-text-soft) !important;
	stroke: var(--nc-mm-text-soft) !important;
	transition: transform 0.2s ease, color 0.15s, stroke 0.15s !important;
}

.netocore-mm-acc.is-open .netocore-mm-acc-toggle,
.netocore-mm-acc.is-open .netocore-mm-acc-label {
	color: var(--nc-mm-accent) !important;
}

.netocore-mm-acc.is-open .netocore-mm-acc-icon {
	transform: rotate(180deg);
	color: var(--nc-mm-accent) !important;
	stroke: var(--nc-mm-accent) !important;
}

.netocore-mm-acc-link {
	justify-content: flex-start !important;
}

.netocore-mm-acc-body {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
	padding: 2px 10px 14px !important;
}

.netocore-mm-acc-body[hidden] {
	display: none !important;
}

.netocore-mm-acc-body a {
	display: block !important;
	padding: 11px 6px !important;
	margin: 0 !important;
	text-decoration: none !important;
	color: var(--nc-mm-text) !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	text-align: center !important;
	line-height: 1.5 !important;
	border-radius: 0 !important;
	border-bottom: 1px solid #f0f1f4 !important;
	transition: color 0.12s, background 0.12s !important;
}

.netocore-mm-acc-body a:last-child {
	border-bottom: none !important;
}

.netocore-mm-acc-body a:hover,
.netocore-mm-acc-body a:active {
	color: var(--nc-mm-accent) !important;
	background: rgba(255, 255, 255, 0.75) !important;
}

.netocore-mm-acc-all {
	font-weight: 600 !important;
	color: var(--nc-mm-accent) !important;
	margin-bottom: 0 !important;
}

.netocore-mm-empty {
	padding: 32px 12px !important;
	text-align: center !important;
}

.netocore-mm-empty a {
	color: var(--nc-mm-accent) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	font-size: 13px !important;
}

/* Stretch inside Elementor / popup shells */
.elementor-popup-modal .dialog-message,
.elementor-popup-modal .dialog-widget-content,
.elementor-popup-modal .elementor-popup-modal__content,
.dialog-type-lightbox .dialog-widget-content {
	height: 100% !important;
}

.elementor-popup-modal .netocore-mm,
.dialog-widget-content .netocore-mm,
.mfp-content .netocore-mm {
	height: min(85vh, 640px) !important;
	max-height: 85vh !important;
}
