/*
 * NerPlay Gaming — Blocksy mobile bottom-sheet panel.
 *
 * This file styles only Blocksy's native #offcanvas panel. The menu trigger
 * remains entirely controlled by Appearance → Customize.
 */

@keyframes ng-sheet-rise {
	from {
		opacity: 0;
		transform: translateY(110%);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (max-width: 999px) {
	body.nerplay-gaming {
		padding-bottom: 1rem;
	}

	/* Never replace or hide the Header Builder's native trigger. */
	body.nerplay-gaming #header .ct-header-trigger[data-toggle-panel="#offcanvas"],
	body.nerplay-gaming .ct-header .ct-header-trigger[data-toggle-panel="#offcanvas"] {
		display: inline-flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	body.nerplay-gaming #offcanvas {
		position: fixed !important;
		z-index: 100000 !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		width: 100% !important;
		max-width: none !important;
		max-height: min(78vh, 38rem) !important;
		visibility: hidden;
		border-top: 1px solid rgba(0, 229, 255, 0.32) !important;
		border-right: 0 !important;
		border-radius: 1.1rem 1.1rem 0 0 !important;
		box-shadow: 0 -1rem 3rem rgba(0, 0, 0, 0.72), 0 0 2rem rgba(0, 229, 255, 0.1) !important;
		opacity: 0;
		pointer-events: none;
		transform: translateY(110%) !important;
		transition: opacity 220ms ease, transform 360ms cubic-bezier(0.16, 1, 0.3, 1) !important;
	}

	body.nerplay-gaming.nerplay-mobile-panel-open #offcanvas {
		display: block !important;
		visibility: visible !important;
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0) !important;
		animation: ng-sheet-rise 360ms cubic-bezier(0.16, 1, 0.3, 1) both;
	}

	body.nerplay-gaming.nerplay-mobile-panel-open::after {
		position: fixed;
		z-index: 99998;
		inset: 0;
		background: rgba(2, 4, 8, 0.72);
		content: "";
		pointer-events: none;
	}

	body.nerplay-gaming #offcanvas .ct-panel-content-inner {
		max-height: min(78vh, 38rem);
		overflow-y: auto;
		padding-bottom: 1.25rem;
	}

	body.nerplay-gaming #offcanvas .mobile-menu .ct-menu-link {
		min-height: 3.4rem;
		border-bottom-color: rgba(0, 229, 255, 0.12);
		font-family: "Orbitron", sans-serif !important;
		font-size: 0.64rem !important;
		letter-spacing: 0.1em !important;
	}

	body.nerplay-gaming #offcanvas .mobile-menu .ct-menu-link:hover,
	body.nerplay-gaming #offcanvas .mobile-menu .current-menu-item > .ct-menu-link {
		padding-left: 0.65rem;
		background: rgba(0, 229, 255, 0.08);
		color: #00e5ff;
	}
}

@media (min-width: 1000px) {
	body.nerplay-gaming #offcanvas {
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.nerplay-gaming #offcanvas,
	body.nerplay-gaming.nerplay-mobile-panel-open #offcanvas {
		animation: none !important;
		transition: none !important;
	}
}