/**
 * Nav layout override – child theme
 *
 * Problem: theme uses .main-navigation a { padding: 15px 15px 40px }
 * When the menu wraps to a 2nd row, that 40px bottom padding creates a huge gap.
 *
 * Goal: tighter rows so Language + Tutorial Series can fit without ugly spacing.
 * Does not touch parent theme SCSS/CSS files.
 */

@media (min-width: 992px) {

	/* Tighter header padding so wrapped rows don't leave a huge gap */
	.header-default {
		padding-bottom: 8px;
	}

	/* Allow wrapping with compact row spacing */
	.main-navigation #primary-menu {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
		row-gap: 4px;
		column-gap: 0;
	}

	/* Override float layout from parent theme */
	.main-navigation #primary-menu > li {
		float: none;
		margin-top: 0;
	}

	/*
	 * Kill the 40px bottom padding that causes the big wrap gap.
	 * Slightly reduce horizontal padding to fit more items on one row.
	 */
	.main-navigation #primary-menu > li > a {
		padding: 10px 11px;
		font-size: 13px;
		line-height: 1.3;
	}

	/* Keep submenu positioning relative to parent */
	.main-navigation #primary-menu > li > ul.sub-menu {
		top: 100%;
	}
}

/* Mid-width desktops: a bit tighter still */
@media (min-width: 992px) and (max-width: 1199px) {
	.main-navigation #primary-menu > li > a {
		padding: 10px 8px;
		font-size: 12px;
	}
}