/* Divi Mega Pro - Portrait Mode Reliability Fix */
/* This file addresses intermittent mega menu issues on mobile portrait mode */

/* Override any conflicting z-index values */
:root {
	--dmp-portrait-z-index: 99999;
}

/* Ensure portrait mode menus are always accessible */
@media (orientation: portrait) and (max-width: 1024px) {
	
	/* Block elements that might be obscuring the menu */
	body.et_mobile_device .divimegapro-overlay-background {
		pointer-events: none !important;
	}
	
	/* Guarantee menu visibility in portrait */
	body.et_mobile_device .tippy-popper.dmp-open,
	body.et_mobile_device .tippy-popper[data-state="visible"] {
		z-index: var(--dmp-portrait-z-index) !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		display: block !important;
		width: 100% !important;
		max-width: 100vw !important;
		left: 0 !important;
		right: 0 !important;
	}
	
	/* Portrait-specific touch handling */
	body.et_mobile_device .tippy-popper,
	body.et_mobile_device .tippy-tooltip,
	body.et_mobile_device .tippy-content {
		touch-action: auto !important;
		pointer-events: auto !important;
		-webkit-user-select: text;
		user-select: text;
		width: 100% !important;
		max-width: 100vw !important;
	}
	
	/* Prevent any hidden overflow that might block menu */
	body.et_mobile_device .divimegapro {
		overflow: visible !important;
		-webkit-overflow-scrolling: touch;
		width: 100% !important;
	}
	
	/* Fix for iOS Safari - prevent menu from being clipped */
	body.et_mobile_device .tippy-popper {
		-webkit-clip-path: none !important;
		clip-path: none !important;
	}
	
	/* Ensure body/html don't block events */
	body, html {
		overflow-y: auto !important;
	}
	
	/* Fix potential fixed positioning issues */
	body.et_mobile_device .tippy-popper[data-placement*="bottom"],
	body.et_mobile_device .tippy-popper[data-placement*="top"] {
		z-index: var(--dmp-portrait-z-index) !important;
		width: 100% !important;
		max-width: 100vw !important;
	}
}

/* Specific fix for common portrait sizes */
@media (orientation: portrait) and (max-width: 480px) {
	/* Very small phones */
	body.et_mobile_device .tippy-popper {
		max-width: 100vw !important;
		width: 100% !important;
		left: 0 !important;
		right: 0 !important;
	}
}

@media (orientation: portrait) and (max-width: 667px) and (min-width: 481px) {
	/* Medium phones */
	body.et_mobile_device .tippy-popper {
		max-width: 100vw !important;
		width: 100% !important;
		left: 0 !important;
		right: 0 !important;
	}
}

@media (orientation: portrait) and (max-width: 1024px) and (min-width: 768px) {
	/* Tablets in portrait */
	body.et_mobile_device .tippy-popper {
		max-width: 100vw !important;
		width: 100% !important;
		left: 0 !important;
		right: 0 !important;
	}
}

/* Landscape mode - ensure no regression */
@media (orientation: landscape) and (max-width: 1024px) {
	body.et_mobile_device .tippy-popper {
		z-index: 99999 !important;
		pointer-events: auto !important;
		touch-action: auto !important;
	}
}

/* Prevent animation/transition delays from blocking interaction */
body.et_mobile_device .tippy-popper,
body.et_mobile_device .divimegapro {
	will-change: auto !important;
}

/* Ensure event listeners work properly */
body.et_mobile_device .divimegapro a,
body.et_mobile_device .tippy-popper a {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
	-webkit-touch-callout: none;
}

/* Fix for when menu is nested deep in DOM */
body.et_mobile_device .tippy-popper .divimegapro {
	pointer-events: auto !important;
}

body.et_mobile_device .tippy-popper .divimegapro .et_pb_section {
	pointer-events: auto !important;
}

body.et_mobile_device .tippy-popper .divimegapro .et_pb_row {
	pointer-events: auto !important;
}

/* Safari iOS specific fix */
@supports (-webkit-touch-callout: none) {
	body.et_mobile_device .tippy-popper {
		-webkit-user-select: text !important;
		user-select: text !important;
		-webkit-user-select-all: none !important;
	}
	
	body.et_mobile_device .tippy-popper a {
		-webkit-user-select: none !important;
		user-select: none !important;
	}
}

/* Prevent parent containers from blocking the menu */
body.et_mobile_device #page-container,
body.et_mobile_device #main-header,
body.et_mobile_device .et_pb_section {
	pointer-events: auto;
}

/* Ensure body class doesn't interfere */
body.divimegapro-open {
	z-index: 0 !important;
	position: relative !important;
}
