/**
 * Preluence News — menu bar sizing and auto-fit.
 *
 * Loaded for the primary menu whether or not it has panels, because the bar
 * itself is always on screen. Keeps the top-level items sized from the Density
 * setting, lets them shrink instead of jumping to a new row, and balances the
 * rows when a wrap is genuinely needed (see assets/js/menu-fit.js).
 */

/* ---------- Item sizing (Density) ---------- */

:root {
	--pn-menu-item-size: 0.82rem;
	--pn-menu-item-pad: 0.9rem;
	--pn-menu-item-gap: 0.35rem;
	--pn-menu-fit-scale: 1;
	--pn-menu-per-row: 0;
}

.pn-menu-density-compact {
	--pn-menu-item-size: 0.76rem;
	--pn-menu-item-pad: 0.55rem;
	--pn-menu-item-gap: 0.15rem;
}

.pn-menu-density-spacious {
	--pn-menu-item-size: 0.9rem;
	--pn-menu-item-pad: 1.2rem;
	--pn-menu-item-gap: 0.6rem;
}

body .pn-primary-nav .pn-menu {
	gap: var(--pn-menu-item-gap);
}

body .pn-primary-nav .pn-menu > li > a {
	padding-inline: calc(var(--pn-menu-item-pad) * var(--pn-menu-fit-scale));
	font-size: calc(var(--pn-menu-item-size) * var(--pn-menu-fit-scale));
	white-space: nowrap;
}

/* ---------- Auto-fit ---------- */

.pn-menu-fit .pn-primary-nav .pn-menu {
	flex-wrap: wrap;
	justify-content: center;
	row-gap: 0;
}

/* Shrinkable: this is what lets a nearly-fitting menu stay on one row. */
.pn-menu-fit .pn-primary-nav .pn-menu > li {
	flex: 0 1 auto;
	min-width: 0;
}

/* When the plan wraps, hold each row to its balanced item count. */
.pn-menu-fit.pn-menu-wrapped .pn-primary-nav .pn-menu > li {
	--pn-menu-basis: calc(
		(100% - (var(--pn-menu-per-row) - 1) * var(--pn-menu-item-gap, 0.35rem)) /
			var(--pn-menu-per-row)
	);
	flex: 1 1 var(--pn-menu-basis);
}

.pn-menu-fit.pn-menu-wrapped .pn-primary-nav .pn-menu > li > a {
	justify-content: center;
	text-align: center;
}

/* ---------- 3D items ---------- */

.pn-menu-3d .pn-primary-nav .pn-menu {
	perspective: 900px;
}

.pn-menu-3d .pn-primary-nav .pn-menu > li > a {
	transform-style: preserve-3d;
	transition: transform 0.22s var(--pn-ease, ease), box-shadow 0.22s var(--pn-ease, ease);
}

.pn-menu-3d .pn-primary-nav .pn-menu > li > a:hover,
.pn-menu-3d .pn-primary-nav .pn-menu > li:focus-within > a,
.pn-menu-3d .pn-primary-nav .pn-menu > li.is-open > a {
	transform: translateY(-2px) rotateX(12deg) translateZ(12px);
	box-shadow: 0 16px 26px -18px rgb(11 16 32 / 65%);
}

.pn-menu-3d .pn-primary-nav .pn-menu > li > a > span {
	transform: translateZ(6px);
}

@media (prefers-reduced-motion: reduce) {

	.pn-menu-3d .pn-primary-nav .pn-menu > li > a:hover,
	.pn-menu-3d .pn-primary-nav .pn-menu > li:focus-within > a,
	.pn-menu-3d .pn-primary-nav .pn-menu > li.is-open > a {
		transform: none !important;
	}
}

/* Mobile drawer keeps its own sizing. */
@media (max-width: 1023px) {

	.pn-menu-fit .pn-primary-nav .pn-menu > li {
		flex: 1 1 100%;
	}
}