/* =============================================================================
 * Tőzsér Optika — prioritásos menü ("Továbbiak" legördülő)
 * =============================================================================
 *
 * A theme/js/nav-more.js azokat a menüpontokat, amelyek nem férnek ki az
 * asztali menüsávba, átteszi a .nav-more-menu listába. Ez a fájl a legördülő
 * megjelenését adja; a main.css-t nem módosítja, csak felülírja.
 *
 * Mobilon (< 992px) a teljes menü a lenyíló panelben látszik, ezért ott a
 * "Továbbiak" gomb rejtve marad.
 * ========================================================================== */

.nav-more[hidden] {
	display: none !important;
}

/* --- Asztali menüsáv ----------------------------------------------------- */

@media (min-width: 992px) {
	/*
	 * A méréshez egy sorban kell maradnia a listának, és amíg a JS nem végzett
	 * az első számítással, a kifutó pontok se villanjanak be.
	 */
	.navbar-nav[data-nav-priority] {
		flex-wrap: nowrap;
	}

	.navbar-nav[data-nav-priority]:not(.nav-priority-ready) {
		overflow: hidden;
	}

	.nav-more {
		position: relative;
	}

	.nav-more-toggle {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		background: none;
		border: 0;
		cursor: pointer;
		font: inherit;
		white-space: nowrap;
	}

	.nav-more-toggle:focus {
		outline: none;
	}

	.nav-more-caret {
		display: inline-block;
		width: 7px;
		height: 7px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: translateY(-2px) rotate(45deg);
		transition: transform 0.25s ease;
	}

	.nav-more-open .nav-more-caret {
		transform: translateY(1px) rotate(-135deg);
	}

	.nav-more-menu {
		position: absolute;
		top: calc(100% + 10px);
		right: 0;
		z-index: 1000;
		min-width: 232px;
		margin: 0;
		padding: 10px;
		list-style: none;
		border-radius: 20px;
		background-color: rgba(255, 255, 255, 0.96);
		border: 1px solid rgba(255, 255, 255, 0.7);
		box-shadow: 0 24px 50px -20px rgba(31, 38, 60, 0.55), 0 2px 10px rgba(31, 38, 60, 0.08);
		-webkit-backdrop-filter: blur(18px) saturate(170%);
		backdrop-filter: blur(18px) saturate(170%);
		opacity: 0;
		transform: translateY(-8px);
		pointer-events: none;
		transition: opacity 0.22s ease, transform 0.22s ease;
	}

	.nav-more-open .nav-more-menu {
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}

	.nav-more-menu .nav-item {
		display: block;
	}

	.nav-more-menu .nav-link {
		display: block;
		white-space: nowrap;
		border-radius: 14px !important;
		text-align: left;
	}

	/* A legördülőben a listaelemek egymás alatt lélegezhetnek. */
	.nav-more-menu .nav-item + .nav-item {
		margin-top: 4px;
	}
}

/* --- Mobil: nincs szükség a legördülőre ---------------------------------- */

@media (max-width: 991.98px) {
	.nav-more {
		display: none !important;
	}
}
