/**
 * Mobile / tablet drawer menu — readable white links on dark panel.
 * Loads last to override light theme variable swaps (--wa-white = navy).
 */

@media (max-width: 1024px) {
	.wa-main-navigation.wa-mobile-drawer {
		--wa-white: #ffffff;
		--wa-text: rgba(255, 255, 255, 0.92);
		--wa-text-muted: rgba(255, 255, 255, 0.72);
		--wa-navy-mid: rgba(255, 255, 255, 0.06);
		background: linear-gradient(180deg, #121f33 0%, #0b1423 55%, #0a1220 100%) !important;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu > li > a,
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu .sub-menu a {
		color: #ffffff !important;
		text-shadow: none !important;
		-webkit-font-smoothing: antialiased;
		opacity: 1 !important;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu > li > a {
		font-size: 15px !important;
		font-weight: 600 !important;
		letter-spacing: 0.06em !important;
		text-transform: uppercase !important;
		padding: 15px 14px !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
		border-radius: 10px !important;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu > li > a:hover,
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu > li.current-menu-item > a,
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu > li.current_page_item > a {
		color: #5ec8ed !important;
		background: rgba(94, 200, 237, 0.16) !important;
		box-shadow: inset 3px 0 0 #5ec8ed;
	}

	/* Services sub-menu — no white slab */
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu .sub-menu {
		position: static !important;
		display: block !important;
		background: rgba(255, 255, 255, 0.06) !important;
		border: 1px solid rgba(94, 200, 237, 0.18) !important;
		border-radius: 10px !important;
		box-shadow: none !important;
		padding: 6px 8px 10px !important;
		margin: 2px 0 12px 8px !important;
		min-height: 0 !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu .sub-menu li {
		min-height: 0;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu .sub-menu a {
		font-size: 13px !important;
		font-weight: 500 !important;
		text-transform: none !important;
		letter-spacing: 0.02em !important;
		color: rgba(255, 255, 255, 0.9) !important;
		padding: 11px 12px !important;
		border-radius: 8px !important;
		border-bottom: none !important;
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu .sub-menu a:hover {
		color: #5ec8ed !important;
		background: rgba(94, 200, 237, 0.12) !important;
	}

	/* Book Now in menu — stand out */
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu a[href*="book-now"],
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu a[href*="book_now"] {
		margin-top: 8px;
		background: linear-gradient(135deg, #5ec8ed 0%, #2a8ccf 100%) !important;
		color: #0b1423 !important;
		text-align: center;
		border: none !important;
		box-shadow: 0 6px 24px rgba(94, 200, 237, 0.35);
	}

	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu a[href*="book-now"]:hover,
	.wa-main-navigation.wa-mobile-drawer .wa-nav-menu a[href*="book_now"]:hover {
		color: #0b1423 !important;
		transform: translateY(-1px);
	}

	/* Hamburger / close — always visible on dark drawer */
	body.wa-menu-open .wa-menu-toggle .wa-hamburger::before,
	body.wa-menu-open .wa-menu-toggle .wa-hamburger::after,
	body.wa-menu-open .wa-menu-toggle.active .wa-hamburger::before,
	body.wa-menu-open .wa-menu-toggle.active .wa-hamburger::after {
		background: #ffffff !important;
		box-shadow: none !important;
	}

	body.wa-theme-light.wa-menu-open .wa-menu-toggle .wa-hamburger::before,
	body.wa-theme-light.wa-menu-open .wa-menu-toggle .wa-hamburger::after,
	body.wa-theme-light.wa-menu-open .wa-menu-toggle.active .wa-hamburger::before,
	body.wa-theme-light.wa-menu-open .wa-menu-toggle.active .wa-hamburger::after,
	body.wa-theme-light:not(.wa-front-page) .wa-menu-toggle.active .wa-hamburger::before,
	body.wa-theme-light:not(.wa-front-page) .wa-menu-toggle.active .wa-hamburger::after {
		background: #ffffff !important;
	}
}
