/**
 * =============================================================================
 * PowerX Mega Menu Component Styles (Consolidated Entry)
 * =============================================================================
 * Clean, modular stylesheet for the PowerX Mega Menu widget.
 * Sourced from modular components: mega-menu-base.css, mega-menu-desktop.css,
 * and mega-menu-mobile.css.
 * Fully compatible with Elementor Flexbox & Grid containers (ThemeForest Standard).
 * ZERO hardcoded colors. ZERO forced overrides. 100% Elementor widget controlled.
 *
 * TABLE OF CONTENTS:
 * -----------------------------------------------------------------------------
 * 1.0 - Main Widget Container & Alignment
 * 2.0 - Nav Wrapper & Top-Level Menu Items
 * 3.0 - Standard Dropdown Submenu & Pointers (Clean specificity)
 * 4.0 - Mega Menu Desktop Architecture (Full-Width, 1240px Container, Custom)
 * 5.0 - Global Content Resets & Flow (White-Space, Headings, Links, Containers)
 * 6.0 - Mobile Responsive Breakpoints & Drawer
 * =============================================================================
 *
 * @package PowerX_Core
 * @version 0.0.1
 */

/* =============================================================================
 * 1.0 - MAIN WIDGET CONTAINER & ALIGNMENT
 * ============================================================================= */

.powerx-mega-menu-widget {
	display: flex;
	align-items: center;
	position: relative;
	width: 100%;
	background: var(--px-menu-bar-bg, transparent);
}

.powerx-mega-menu-widget.px-align-left {
	justify-content: flex-start;
}

.powerx-mega-menu-widget.px-align-center {
	justify-content: center;
}

.powerx-mega-menu-widget.px-align-right {
	justify-content: flex-end;
}

.powerx-mega-menu-widget.px-align-justify {
	justify-content: space-between;
}

/* =============================================================================
 * 2.0 - NAV WRAPPER & TOP-LEVEL MENU ITEMS
 * ============================================================================= */

.powerx-mega-menu-nav {
	display: flex;
	align-items: center;
	width: auto;
	background: var(--px-menu-bar-bg, transparent);
}

.powerx-mega-menu-widget.px-align-justify .powerx-mega-menu-nav {
	width: 100%;
}

.powerx-menu-list {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: var(--px-menu-gap, 24px);
}

.powerx-mega-menu-widget.px-align-justify .powerx-menu-list {
	width: 100%;
	justify-content: space-between;
}

.powerx-menu-list > li {
	position: relative;
	margin: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
}

.powerx-menu-list > li:not(.px-has-megamenu) {
	white-space: nowrap;
}

.powerx-menu-list > li.px-has-megamenu {
	position: static;
	white-space: normal;
}

/* Menu Item Link */
.powerx-menu-item-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	color: var(--px-menu-link-color, var(--powerx-neutral-800, #32324d));
	background-color: transparent;
	font-size: 15px;
	font-weight: 500;
	padding: var(--px-menu-item-pad, 8px 0);
	position: relative;
	transition: color 0.2s ease, background-color 0.2s ease;
	cursor: pointer;
}

.powerx-menu-item-link:hover,
.powerx-menu-item-link:focus,
.powerx-menu-item-link:active {
	text-decoration: none;
}

.powerx-menu-item-link:focus-visible {
	outline: 2px solid var(--powerx-primary-500, #4945ff);
	outline-offset: 2px;
	border-radius: var(--powerx-radius-sm, 4px);
}

/* Submenu Indicator Chevron */
.powerx-sub-indicator {
	display: inline-flex;
	align-items: center;
	transition: transform 0.25s ease;
}

.powerx-menu-list > li:hover > .powerx-menu-item-link .powerx-sub-indicator {
	transform: rotate(180deg);
}

/* Pointer Animations (Underline, Overline, Pill, None) */
.powerx-mega-menu-widget.px-pointer-underline .powerx-menu-item-link::after,
.powerx-mega-menu-widget.px-pointer-overline .powerx-menu-item-link::after {
	content: '';
	position: absolute;
	left: 0;
	width: 0;
	height: var(--px-pointer-h, 2px);
	background-color: var(--px-pointer-color, currentColor);
	transition: width 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.powerx-mega-menu-widget.px-pointer-underline .powerx-menu-item-link::after {
	bottom: 0;
}

.powerx-mega-menu-widget.px-pointer-overline .powerx-menu-item-link::after {
	top: 0;
}

.powerx-mega-menu-widget.px-pointer-none .powerx-menu-item-link::after {
	display: none;
	content: none;
}

.powerx-menu-list > li:hover > .powerx-menu-item-link::after,
.powerx-menu-list > li.current-menu-item > .powerx-menu-item-link::after,
.powerx-menu-list > li.current-menu-ancestor > .powerx-menu-item-link::after {
	width: 100%;
}

/* Pill / Framed Pointer */
.powerx-mega-menu-widget.px-pointer-pill .powerx-menu-item-link {
	border-radius: var(--px-pointer-radius, var(--powerx-radius-sm, 4px));
	padding: var(--px-menu-pill-pad, 8px 16px);
}

.powerx-mega-menu-widget.px-pointer-pill .powerx-menu-list > li:hover > .powerx-menu-item-link,
.powerx-mega-menu-widget.px-pointer-pill .powerx-menu-list > li.current-menu-item > .powerx-menu-item-link {
	background-color: var(--px-pointer-color, var(--powerx-primary-50, #f0f0ff));
}

/* =============================================================================
 * 3.0 - STANDARD DROPDOWN SUBMENU & POINTERS (CLEAN SPECIFICITY)
 * ============================================================================= */

.powerx-mega-menu-widget .powerx-menu-list .sub-menu {
	position: absolute;
	top: calc(100% + var(--px-dropdown-distance, 10px));
	left: 0;
	min-width: 220px;
	background-color: var(--px-dropdown-bg, var(--powerx-neutral-0, #ffffff));
	border-radius: var(--px-dropdown-radius, var(--powerx-radius-sm, 4px));
	border: 0 solid transparent;
	outline: none;
	box-shadow: var(--powerx-shadow-lg, 0 10px 30px rgba(33, 33, 52, 0.12));
	list-style: none;
	margin: 0;
	padding: 8px 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease, visibility 0.2s ease;
	z-index: var(--powerx-z-drawer, 999);
	pointer-events: none;
}

/* Invisible Hover Bridge to eliminate mouse travel gap */
.powerx-mega-menu-widget .powerx-menu-list .sub-menu::before {
	content: '';
	position: absolute;
	top: -24px;
	left: 0;
	width: 100%;
	height: 28px;
	background: transparent;
	display: block;
	z-index: var(--powerx-z-active, 10);
}

.powerx-mega-menu-widget .powerx-menu-list li:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.powerx-mega-menu-widget .powerx-menu-list .sub-menu li {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	border: 0 solid transparent;
	outline: none;
}

.powerx-mega-menu-widget .powerx-menu-list .sub-menu li > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 9px 18px;
	color: var(--px-dropdown-text-color, var(--powerx-neutral-800, #32324d));
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	border: 0 solid transparent;
	outline: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.powerx-mega-menu-widget .powerx-menu-list .sub-menu li > a:hover,
.powerx-mega-menu-widget .powerx-menu-list .sub-menu li:hover > a,
.powerx-mega-menu-widget .powerx-menu-list .sub-menu li.current-menu-item > a {
	background-color: var(--powerx-neutral-100, #f6f6f9);
	color: var(--powerx-primary-500, #4945ff);
	border: 0 solid transparent;
	outline: none;
}

.powerx-mega-menu-widget .powerx-menu-list .sub-menu li > a:focus-visible {
	outline: 2px solid var(--powerx-primary-500, #4945ff);
	outline-offset: -2px;
	color: var(--powerx-primary-500, #4945ff);
	background-color: var(--powerx-neutral-100, #f6f6f9);
}

/* Divider lines between items */
.powerx-mega-menu-widget.powerx-menu-dividers-yes .sub-menu li:not(:last-child) {
	border-bottom: 1px solid var(--px-dropdown-divider-color, rgba(0, 0, 0, 0.08));
}

/* Nested 3rd Level Submenu */
.powerx-mega-menu-widget .powerx-menu-list .sub-menu .sub-menu {
	top: 0;
	left: 100%;
	transform: translateX(8px);
}

.powerx-mega-menu-widget .powerx-menu-list .sub-menu li:hover > .sub-menu {
	transform: translateX(0);
}

/* =============================================================================
 * 4.0 - MEGA MENU DESKTOP ARCHITECTURE (FULL-WIDTH, 1240PX CONTAINER, CUSTOM)
 * ============================================================================= */

.px-has-megamenu {
	position: static;
}

@media (min-width: 1025px) {
	/* Universal Fixed Viewport Placement */
	.powerx-mega-menu-widget .px-has-megamenu > .px-megamenu-wrapper,
	.px-megamenu-wrapper {
		position: fixed;
		top: var(--px-megamenu-top, 100%);
		box-shadow: 0 15px 45px rgba(0, 0, 0, 0.15);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.2s ease, visibility 0.2s ease;
		z-index: var(--powerx-z-modal, 99999);
		pointer-events: none;
		white-space: normal;
		padding: 0;
		border-radius: var(--powerx-radius-sm, 4px);
	}

	/* Full-Width Layout */
	.powerx-mega-menu-widget .px-has-megamenu.px-megamenu-full-width > .px-megamenu-wrapper,
	.powerx-mega-menu-widget .px-megamenu-wrapper.px-megamenu-design-full-width,
	.px-megamenu-wrapper.px-megamenu-design-full-width {
		left: 0;
		right: 0;
		width: 100vw;
		max-width: 100vw;
		transform: none;
		border-radius: 0;
		padding: 0;
	}

	/* 1240px Centered Container Layout */
	.powerx-mega-menu-widget .px-has-megamenu.px-megamenu-container > .px-megamenu-wrapper,
	.powerx-mega-menu-widget .px-megamenu-wrapper.px-megamenu-design-container,
	.px-megamenu-wrapper.px-megamenu-design-container {
		left: 50%;
		right: auto;
		transform: translateX(-50%);
		width: min(1240px, calc(100vw - 32px));
		max-width: 1240px;
	}

	/* Custom Width Centered Layout */
	.powerx-mega-menu-widget .px-has-megamenu.px-megamenu-custom > .px-megamenu-wrapper,
	.powerx-mega-menu-widget .px-megamenu-wrapper.px-megamenu-design-custom,
	.px-megamenu-wrapper.px-megamenu-design-custom {
		left: 50%;
		right: auto;
		transform: translateX(-50%);
		width: min(var(--px-megamenu-custom-width, 1240px), calc(100vw - 32px));
		max-width: 100vw;
	}

	/* Desktop Hover Reveal State */
	.powerx-mega-menu-widget .px-has-megamenu:hover > .px-megamenu-wrapper,
	.powerx-mega-menu-widget .px-megamenu-wrapper:hover,
	.px-has-megamenu:hover > .px-megamenu-wrapper,
	.px-megamenu-wrapper:hover {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	/* Invisible Hover Bridge */
	.powerx-mega-menu-widget .px-has-megamenu > .px-megamenu-wrapper::before,
	.px-megamenu-wrapper::before {
		content: '';
		position: absolute;
		top: -30px;
		left: 0;
		right: 0;
		height: var(--px-menu-hover-bridge-h, 35px);
		background: transparent;
		display: block;
		pointer-events: auto;
		z-index: var(--powerx-z-active, 10);
	}
}

/* =============================================================================
 * 5.0 - GLOBAL CONTENT RESETS & FLOW (WHITE-SPACE, HEADINGS, LINKS, CONTAINERS)
 * ============================================================================= */

/* Deep White-Space & Box-Sizing Reset */
.powerx-mega-menu-widget .px-megamenu-wrapper,
.powerx-mega-menu-widget .px-megamenu-wrapper *,
.px-megamenu-wrapper,
.px-megamenu-wrapper *,
.px-megamenu-wrapper .px-megamenu-container,
.px-megamenu-wrapper .px-megamenu-container * {
	white-space: normal;
}

/* Headings Typography & Clean Wrapping */
.px-megamenu-wrapper .elementor-heading-title,
.px-megamenu-wrapper h1,
.px-megamenu-wrapper h2,
.px-megamenu-wrapper h3,
.px-megamenu-wrapper h4,
.px-megamenu-wrapper h5,
.px-megamenu-wrapper h6 {
	white-space: normal;
	word-break: break-word;
	overflow-wrap: break-word;
	line-height: 1.35;
	margin-bottom: var(--px-megamenu-heading-mb, 6px);
}

/* Vertical Menu & Link Items Natural Vertical Flow */
.px-megamenu-container .elementor-widget-px-vertical-menu-v2,
.px-megamenu-container .px-vmenu-container {
	width: 100%;
	max-width: 100%;
}

.px-megamenu-container .px-vmenu-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}

.px-megamenu-container .px-vmenu-list .menu-item {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
}

.px-megamenu-container .px-vmenu-list .menu-item a,
.px-megamenu-wrapper .menu-item a {
	display: flex;
	align-items: center;
	width: 100%;
	white-space: normal;
	word-break: break-word;
	overflow-wrap: break-word;
	text-decoration: none;
	line-height: 1.4;
}

/* Mega Menu Inner Container Max-Width & Fluid Expansion */
.px-megamenu-wrapper .px-megamenu-container {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	padding: 0;
}

.px-megamenu-container .elementor {
	width: 100%;
	max-width: 100%;
	display: block;
}

.px-megamenu-container .elementor > .e-con,
.px-megamenu-container .elementor > .elementor-section {
	width: 100%;
	max-width: 100%;
}

/* Flexbox Row Container Multi-Column Wrapping Engine */
.px-megamenu-container .e-con--row {
	flex-wrap: wrap;
}

.px-megamenu-container .e-con.e-flexbox-base > .e-con {
	min-width: 0;
}

/* =============================================================================
 * 6.0 - MOBILE RESPONSIVE BREAKPOINTS & DRAWER
 * ============================================================================= */

.powerx-menu-mobile-toggle {
	display: none;
	background: transparent;
	border: none;
	color: var(--px-toggle-color, currentColor);
	cursor: pointer;
	padding: 8px;
	border-radius: var(--powerx-radius-sm, 4px);
	line-height: 1;
}

/* --- Breakpoint: Tablet & Mobile (<= 1024px) --- */
@media (max-width: 1024px) {
	.powerx-mega-menu-widget.px-break-tablet .powerx-menu-mobile-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.powerx-mega-menu-widget.px-break-tablet:not(.is-mobile-open) .powerx-mega-menu-nav {
		display: none;
	}

	.powerx-mega-menu-widget.px-break-tablet.is-mobile-open .powerx-mega-menu-nav {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		width: 100%;
		min-width: 260px;
		background: var(--px-mobile-menu-bg, transparent);
		border-radius: var(--powerx-radius-sm, 4px);
		box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);
		padding: 16px;
		z-index: var(--powerx-z-modal, 99999);
	}

	.powerx-mega-menu-widget.px-break-tablet.is-mobile-open .powerx-menu-list {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		width: 100%;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.powerx-mega-menu-widget.px-break-tablet.is-mobile-open .powerx-menu-list > li {
		display: block;
		width: 100%;
		margin: 0;
		padding: 0;
		position: relative;
		white-space: normal;
	}

	.powerx-mega-menu-widget.px-break-tablet.is-mobile-open .powerx-menu-item-link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: var(--px-mobile-menu-item-pad, 12px 14px);
		color: var(--px-mobile-menu-link-color, inherit);
		border-bottom: 1px solid var(--px-mobile-menu-divider, transparent);
		background-color: var(--px-mobile-menu-link-bg, transparent);
		font-size: 15px;
		text-decoration: none;
		cursor: pointer;
	}

	.powerx-mega-menu-widget.px-break-tablet.is-mobile-open .powerx-menu-item-link::after {
		display: none;
		content: none;
	}

	.powerx-mega-menu-widget.px-break-tablet .sub-menu,
	.powerx-mega-menu-widget.px-break-tablet .px-megamenu-wrapper {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0 solid transparent;
		border-radius: var(--powerx-radius-sm, 4px);
		width: 100%;
		left: auto;
		display: none;
		padding: var(--px-mobile-submenu-pad, 8px 14px);
		background: var(--px-mobile-submenu-bg, transparent);
	}

	.powerx-mega-menu-widget.px-break-tablet .menu-item-has-children.is-sub-open > .sub-menu,
	.powerx-mega-menu-widget.px-break-tablet .px-has-megamenu.is-sub-open > .px-megamenu-wrapper {
		display: block;
	}

	.powerx-mega-menu-widget.px-break-tablet .sub-menu li > a {
		display: block;
		padding: 8px 0;
		color: var(--px-mobile-menu-link-color, inherit);
		font-size: 14px;
		border-bottom: 1px dashed var(--px-mobile-menu-divider, transparent);
		background: transparent;
	}
}

/* --- Breakpoint: Desktop for Tablet Mode (> 1024px) --- */
@media (min-width: 1025px) {
	.powerx-mega-menu-widget.px-break-tablet .powerx-menu-mobile-toggle {
		display: none;
	}

	.powerx-mega-menu-widget.px-break-tablet .powerx-mega-menu-nav {
		display: flex;
		align-items: center;
		background: var(--px-menu-bar-bg, transparent);
	}
}

/* --- Breakpoint: Mobile Only (<= 768px) --- */
@media (max-width: 768px) {
	.powerx-mega-menu-widget.px-break-mobile .powerx-menu-mobile-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.powerx-mega-menu-widget.px-break-mobile:not(.is-mobile-open) .powerx-mega-menu-nav {
		display: none;
	}

	.powerx-mega-menu-widget.px-break-mobile.is-mobile-open .powerx-mega-menu-nav {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		width: 100%;
		min-width: 260px;
		background: var(--px-mobile-menu-bg, transparent);
		border-radius: var(--powerx-radius-sm, 4px);
		box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);
		padding: 16px;
		z-index: var(--powerx-z-modal, 99999);
	}

	.powerx-mega-menu-widget.px-break-mobile.is-mobile-open .powerx-menu-list {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		width: 100%;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.powerx-mega-menu-widget.px-break-mobile.is-mobile-open .powerx-menu-list > li {
		display: block;
		width: 100%;
		margin: 0;
		padding: 0;
		position: relative;
		white-space: normal;
	}

	.powerx-mega-menu-widget.px-break-mobile.is-mobile-open .powerx-menu-item-link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: var(--px-mobile-menu-item-pad, 12px 14px);
		color: var(--px-mobile-menu-link-color, inherit);
		border-bottom: 1px solid var(--px-mobile-menu-divider, transparent);
		background-color: var(--px-mobile-menu-link-bg, transparent);
		font-size: 15px;
		text-decoration: none;
		cursor: pointer;
	}

	.powerx-mega-menu-widget.px-break-mobile.is-mobile-open .powerx-menu-item-link::after {
		display: none;
		content: none;
	}

	.powerx-mega-menu-widget.px-break-mobile .sub-menu,
	.powerx-mega-menu-widget.px-break-mobile .px-megamenu-wrapper {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0 solid transparent;
		border-radius: var(--powerx-radius-sm, 4px);
		width: 100%;
		left: auto;
		display: none;
		padding: var(--px-mobile-submenu-pad, 8px 14px);
		background: var(--px-mobile-submenu-bg, transparent);
	}

	.powerx-mega-menu-widget.px-break-mobile .menu-item-has-children.is-sub-open > .sub-menu,
	.powerx-mega-menu-widget.px-break-mobile .px-has-megamenu.is-sub-open > .px-megamenu-wrapper {
		display: block;
	}

	.powerx-mega-menu-widget.px-break-mobile .sub-menu li > a {
		display: block;
		padding: 8px 0;
		color: var(--px-mobile-menu-link-color, inherit);
		font-size: 14px;
		border-bottom: 1px dashed var(--px-mobile-menu-divider, transparent);
		background: transparent;
	}
}

/* --- Breakpoint: Desktop for Mobile Mode (> 768px) --- */
@media (min-width: 769px) {
	.powerx-mega-menu-widget.px-break-mobile .powerx-menu-mobile-toggle {
		display: none;
	}

	.powerx-mega-menu-widget.px-break-mobile .powerx-mega-menu-nav {
		display: flex;
		align-items: center;
		background: var(--px-menu-bar-bg, transparent);
	}
}