/*
 * Designer Frames mobile navigation enhancement.
 * Scoped to Blocksy's off-canvas mobile menu; desktop navigation is untouched.
 */
@media (max-width: 999.98px) {
	body.df-mobile-navigation-enabled #offcanvas.ct-panel.ct-header {
		overflow: hidden;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-panel-inner {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100vh;
		height: 100dvh;
		max-height: 100vh;
		max-height: 100dvh;
		overflow: hidden;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-panel-actions {
		position: sticky;
		top: 0;
		z-index: 20;
		flex: 0 0 auto;
		min-height: 56px;
		background: #fff;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-toggle-close {
		min-width: 44px;
		min-height: 44px;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-toggle-close .ct-icon {
		width: 16px;
		height: 16px;
		fill: #151f2a;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-toggle-close:hover .ct-icon,
	body.df-mobile-navigation-enabled #offcanvas .ct-toggle-close:focus-visible .ct-icon {
		fill: #e76713;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-panel-content[data-device="mobile"] {
		flex: 1 1 auto;
		min-height: 0;
		overflow: hidden;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-panel-content[data-device="mobile"] .ct-panel-content-inner {
		flex: 1 1 auto;
		min-height: 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}

	body.df-mobile-navigation-enabled #offcanvas .ct-panel-content[data-device="mobile"] .ct-panel-content-inner {
		box-sizing: border-box;
		width: 100%;
		padding-bottom: calc(24px + env(safe-area-inset-bottom));
		overflow-x: hidden;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu,
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul {
		width: 100%;
		max-width: 100%;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul {
		margin: 0;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li > a.ct-menu-link,
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li > .ct-sub-menu-parent {
		box-sizing: border-box;
		width: 100%;
		min-height: 48px;
		border-bottom: 1px solid rgba(21, 31, 42, 0.12);
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li > a.ct-menu-link {
		display: flex;
		align-items: center;
		padding-block: 0;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li > .ct-sub-menu-parent {
		display: flex;
		align-items: stretch;
		gap: 4px;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li > .ct-sub-menu-parent > a.ct-menu-link {
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		min-width: 0;
		min-height: 48px;
		padding-block: 0;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile {
		display: grid;
		flex: 0 0 48px;
		place-items: center;
		box-sizing: border-box;
		width: 48px;
		min-width: 48px;
		height: 48px;
		min-height: 48px;
		margin: 0;
		padding: 0;
		color: #e76713;
		background-color: rgba(231, 103, 19, 0.09) !important;
		border: 0;
		border-left: 1px solid rgba(231, 103, 19, 0.22) !important;
		border-radius: 0;
		cursor: pointer;
		touch-action: manipulation;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile:hover,
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile:focus-visible,
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile[aria-expanded="true"] {
		color: #fff;
		background-color: #e76713 !important;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile:focus-visible,
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu a.ct-menu-link:focus-visible,
	body.df-mobile-navigation-enabled #offcanvas .ct-toggle-close:focus-visible {
		outline: 2px solid #e76713;
		outline-offset: -2px;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile .ct-icon {
		width: 18px;
		height: 18px;
		fill: currentColor;
		transition: transform 180ms ease;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile[aria-expanded="true"] .ct-icon {
		transform: rotate(180deg);
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children.dropdown-active > .ct-sub-menu-parent {
		background: rgba(231, 103, 19, 0.045);
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu {
		box-sizing: border-box;
		width: calc(100% - 8px);
		margin: 0 0 6px 8px;
		padding: 4px 0 4px 14px;
		background: rgba(21, 31, 42, 0.025);
		border-left: 2px solid rgba(231, 103, 19, 0.68);
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu > li {
		margin: 0;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu > li + li {
		border-top: 1px solid rgba(21, 31, 42, 0.09);
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu > li > a.ct-menu-link {
		display: flex;
		align-items: center;
		box-sizing: border-box;
		width: 100%;
		min-height: 44px;
		padding: 7px 12px 7px 10px;
		font-size: 14px;
		font-weight: 500;
		line-height: 1.35;
		letter-spacing: 0.01em;
		text-transform: none;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu a.ct-menu-link {
		overflow-wrap: anywhere;
	}
}

@media (max-width: 374.98px) {
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu {
		padding-left: 10px;
	}

	body.df-mobile-navigation-enabled #offcanvas .mobile-menu > ul > li.menu-item-has-children > .sub-menu > li > a.ct-menu-link {
		font-size: 13.5px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.df-mobile-navigation-enabled #offcanvas .mobile-menu .ct-toggle-dropdown-mobile .ct-icon {
		transition: none;
	}
}