/* Category dropdowns. This file is the ONLY owner of a panel's open/closed
   state: display, visibility, opacity, translate and pointer-events for
   .lvs-nav__sub appear here and nowhere else, so nothing loaded earlier or
   later can leave a category permanently shut. Surface colour and link colour
   live in header-final.css.

   Open on :hover, on :focus-within and on .is-open (touch / keyboard, set by
   the small script in functions.php). Closed panels keep their markup in the
   DOM: visibility+opacity hide them from the eye without removing the links,
   so the crawler still reads every page behind a category. */

.lvs-nav__node {
	position: relative !important;
}

.lvs-nav__sub {
	/* the panel box */
	position: absolute !important;
	top: calc(100% + 6px) !important;
	left: 0 !important;
	z-index: 200 !important;
	min-width: 288px !important;
	width: max-content !important;
	max-width: 380px !important;
	max-height: 68vh !important;
	overflow-y: auto !important;
	overscroll-behavior: contain !important;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box !important;

	/* closed by default — hidden, not removed */
	display: block !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translateY(-6px) !important;
	transition: opacity .16s ease, transform .16s ease, visibility .16s ease !important;
}

/* The last categories would otherwise run past the right edge of a 1920 screen
   at their natural width; the script adds this class when it measures overflow. */
.lvs-nav__node--flip > .lvs-nav__sub {
	left: auto !important;
	right: 0 !important;
}

/* --- open states ------------------------------------------------------- */
.lvs-nav__node:hover > .lvs-nav__sub,
.lvs-nav__node:focus-within > .lvs-nav__sub,
.lvs-nav__node.is-open > .lvs-nav__sub {
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	transform: translateY(0) !important;
}

/* Trigger reads as pressed while its panel is open. */
.lvs-nav__node:hover > .lvs-nav__anchor,
.lvs-nav__node:focus-within > .lvs-nav__anchor,
.lvs-nav__node.is-open > .lvs-nav__anchor,
.lvs-nav__node--has-children > .lvs-nav__anchor {
	position: relative;
}

/* Chevron: a quiet marker that this category has pages under it. */
.lvs-nav__node--has-children > .lvs-nav__anchor::after {
	content: "" !important;
	display: inline-block !important;
	width: 0 !important;
	height: 0 !important;
	margin-left: 7px !important;
	vertical-align: 2px !important;
	border-left: 4px solid transparent !important;
	border-right: 4px solid transparent !important;
	border-top: 5px solid #9fb6d2 !important;
	transition: transform .16s ease, border-top-color .16s ease !important;
}
.lvs-nav__node--has-children:hover > .lvs-nav__anchor::after,
.lvs-nav__node--has-children:focus-within > .lvs-nav__anchor::after,
.lvs-nav__node--has-children.is-open > .lvs-nav__anchor::after {
	border-top-color: #ffd75e !important;
	transform: rotate(180deg) !important;
}

/* --- panel contents ---------------------------------------------------- */
.lvs-nav__sub > li {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.lvs-nav__sub > li > a {
	display: block !important;
	padding: 9px 14px !important;
	border-radius: 7px !important;
	text-decoration: none !important;
	transition: background-color .12s ease, color .12s ease !important;
}

/* Hub row: the category's own page, ruled off from the children below it. */
.lvs-nav__sub > .lvs-nav__hub-link {
	margin-bottom: 6px !important;
	padding-bottom: 6px !important;
	border-bottom: 1px solid #dbe5f2 !important;
}

/* Comfortable tap targets on touch. */
@media (hover: none) {
	.lvs-nav__sub > li > a {
		padding: 12px 14px !important;
		min-height: 44px !important;
		box-sizing: border-box !important;
	}
	.lvs-nav__node--has-children > .lvs-nav__anchor {
		padding-right: 26px !important;
	}
}

/* Short viewports: the panel scrolls rather than pushing the page. */
@media (max-height: 620px) {
	.lvs-nav__sub {
		max-height: 76vh !important;
	}
}

/* Narrow screens: full-width panels, one per row, anchored to the bar. */
@media (max-width: 720px) {
	.lvs-nav__sub {
		position: absolute !important;
		left: 0 !important;
		right: auto !important;
		min-width: 260px !important;
		max-width: min(340px, calc(100vw - 32px)) !important;
	}
	.lvs-nav__node--flip > .lvs-nav__sub {
		left: auto !important;
		right: 0 !important;
	}
}

/* Reduced motion: no slide, just show. */
@media (prefers-reduced-motion: reduce) {
	.lvs-nav__sub,
	.lvs-nav__node--has-children > .lvs-nav__anchor::after {
		transition: none !important;
	}
	.lvs-nav__sub { transform: none !important; }
}