/*
 * The glossy bundle assigns order:2 to the menu button. Once the navigation
 * becomes fixed at the 1180px breakpoint, grid auto-placement consequently
 * pushes that button into a second, 16px-tall row. Keep it in the header row
 * and provide a proper touch target without changing the desktop navigation.
 */
body.admin-bar.ieta-aura-futuristic-home .site-header {
	top: 0 !important;
}

@media (max-width: 1180px) {
	body.ieta-aura-futuristic-home .site-header > .menu-toggle {
		grid-column: 2 !important;
		grid-row: 1 !important;
		order: 0 !important;
		width: 44px;
		height: 44px;
		min-width: 44px;
		min-height: 44px;
		padding: 0;
		border-radius: 4px;
		touch-action: manipulation;
	}

	body.ieta-aura-futuristic-home .site-header > .menu-toggle:hover,
	body.ieta-aura-futuristic-home .site-header > .menu-toggle[aria-expanded="true"] {
		background: rgba(56, 215, 255, 0.1);
	}

	body.ieta-aura-futuristic-home .site-header > nav {
		z-index: 81;
	}
}

@media (max-width: 560px) {
	body.ieta-aura-futuristic-home .site-header > .menu-toggle {
		justify-self: end;
	}
}

/* Keep the connected-products rail swipeable without showing OS scrollbars. */
body.ieta-aura-futuristic-home .ecosystem-rail {
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
	overscroll-behavior-inline: contain;
	-webkit-overflow-scrolling: touch;
}

body.ieta-aura-futuristic-home .ecosystem-rail::-webkit-scrollbar {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
}