/* FXGoPlus Theme Overrides */

/* Problem 3 Fix: Change background-size from 100% auto to cover to prevent bottom background seam/layering gaps */
.fxg-home-hero {
	background-size: cover !important;
}

/* Problem 2 Fix: Increase mobile navigation breakpoint to 1024px to prevent horizontal menu vertical stacking on tablet viewports */
@media (max-width: 1024px) {
	.fxg-site-header {
		position: static !important;
	}

	.fxg-site-header__inner {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) auto !important;
		align-items: center !important;
		gap: 10px 12px !important;
		min-height: 62px !important;
		padding-block: 10px !important;
	}

	.fxg-site-brand-wrap {
		min-width: 0 !important;
	}

	.fxg-site-brand,
	.custom-logo-link {
		min-width: 0 !important;
	}

	.fxg-site-brand__name {
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
	}

	.fxg-mobile-menu-toggle {
		display: inline-flex !important;
		width: 44px !important;
		height: 44px !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0 !important;
		border: 1px solid var(--fxg-border) !important;
		border-radius: 999px !important;
		background: #fff !important;
		box-shadow: none !important;
		color: var(--fxg-ink) !important;
		cursor: pointer !important;
	}

	.fxg-mobile-menu-toggle__icon {
		position: relative !important;
		width: 18px !important;
		height: 14px !important;
		display: block !important;
	}

	.fxg-mobile-menu-toggle__icon span {
		display: block !important;
		width: 18px !important;
		height: 2px !important;
		border-radius: 999px !important;
		background-color: var(--fxg-text, #0f172a) !important;
		position: absolute !important;
		left: 0 !important;
		transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms ease, background-color 180ms ease !important;
	}

	.fxg-mobile-menu-toggle__icon span:nth-child(1) {
		top: 0 !important;
	}

	.fxg-mobile-menu-toggle__icon span:nth-child(2) {
		top: 6px !important;
	}

	.fxg-mobile-menu-toggle__icon span:nth-child(3) {
		top: 12px !important;
	}

	.fxg-site-header.is-nav-open .fxg-mobile-menu-toggle__icon span:nth-child(1) {
		transform: translateY(6px) rotate(45deg) !important;
	}

	.fxg-site-header.is-nav-open .fxg-mobile-menu-toggle__icon span:nth-child(2) {
		opacity: 0 !important;
	}

	.fxg-site-header.is-nav-open .fxg-mobile-menu-toggle__icon span:nth-child(3) {
		transform: translateY(-6px) rotate(-45deg) !important;
	}

	.fxg-site-nav,
	.fxg-site-header__actions {
		display: none !important;
		grid-column: 1 / -1 !important;
		width: 100% !important;
	}

	.fxg-site-header.is-nav-open .fxg-site-nav {
		display: block !important;
	}

	.fxg-site-header.is-nav-open .fxg-site-header__actions {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 8px !important;
	}

	.fxg-site-nav__menu {
		display: grid !important;
		width: 100% !important;
		gap: 6px !important;
		padding: 10px 0 4px !important;
		justify-content: flex-start !important;
	}

	.fxg-site-nav__menu>li {
		width: 100% !important;
	}

	.fxg-site-nav__menu .menu-item-has-children {
		position: relative !important;
	}

	.fxg-site-nav__menu a {
		width: 100% !important;
		min-height: 40px !important;
		justify-content: flex-start !important;
		padding: 9px 12px !important;
	}

	.fxg-site-nav__menu .sub-menu {
		position: static !important;
		display: grid !important;
		width: 100% !important;
		min-width: 0 !important;
		box-shadow: none !important;
		margin: 4px 0 0 14px !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: none !important;
	}

	.fxg-site-nav__menu .sub-menu::before {
		display: none !important;
	}

	.fxg-submenu-toggle {
		display: inline-flex !important;
	}
}
