/*
 * Mobile navigation trigger for the custom Elementor header.
 * The theme's standard off-canvas menu handles opening and closing.
 */

/* Match desktop submenu hover/focus colour to the first menu level. */
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li > a:hover,
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li > a:focus,
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li.sfHover > a {
	color: var(--theme-color-text_link) !important;
}

/* Keep the currently open submenu page distinct from both idle and hover states. */
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li.current-menu-item > a,
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li.current-menu-parent > a,
.top_panel .menu_hover_color_line .sc_layouts_menu_nav > li ul.sub-menu li.current-menu-ancestor > a {
	color: #bfcaca !important;
	background: rgba(255, 255, 255, 0.07);
	box-shadow: inset 2px 0 0 var(--theme-color-text_link);
}

.sweat-mobile-menu-button {
	display: none;
}

@media (max-width: 1279px) {
	.sweat-mobile-menu-button {
		position: fixed;
		z-index: 100001;
		top: 20px;
		right: 24px;
		display: block;
	}

	.admin-bar .sweat-mobile-menu-button {
		top: 52px;
	}

	.sweat-mobile-menu-button > a {
		display: flex;
		width: 48px;
		height: 48px;
		align-items: center;
		justify-content: center;
		color: #ffffff;
		background: #0f1919;
		border: 1px solid rgba(255, 255, 255, 0.18);
		border-radius: 50%;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
	}

	.sweat-mobile-menu-button .sc_layouts_item_icon {
		margin: 0;
		font-size: 24px;
	}

	.sweat-mobile-menu-button > a:hover,
	.sweat-mobile-menu-button > a:focus-visible {
		color: #0f1919;
		background: #e3e52b;
		border-color: #e3e52b;
	}

	body.menu_mobile_opened .sweat-mobile-menu-button {
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
	}

	.menu_mobile .socials_mobile {
		display: none;
	}

	.menu_mobile .menu_mobile_header_wrap .sc_layouts_logo {
		flex: 0 0 76px;
		width: 76px;
		height: 64px;
	}

	.menu_mobile .menu_mobile_header_wrap .sc_layouts_logo img {
		display: block;
		width: 76px;
		height: 64px;
		max-width: 100%;
		max-height: 100%;
		object-fit: contain;
	}
}

@media (max-width: 782px) {
	.admin-bar .sweat-mobile-menu-button {
		top: 66px;
	}
}

@media (max-width: 600px) {
	.sweat-mobile-menu-button {
		top: 14px;
		right: 16px;
	}

	.admin-bar .sweat-mobile-menu-button {
		top: 60px;
	}
}