/**
 * Gate 52 — Sticky Sidebar Navigation
 *
 * Apply class `g52-sticky-nav` to a Group block inside a Column.
 * Place a Navigation block (with a menu or Page List) inside the Group.
 *
 * The Group sticks within its column until the column's bottom edge,
 * leveraging CSS `position: sticky` inside a flex-stretched child.
 *
 * Mockup reference: docs/mock-ups/internal-page.html lines 129-136
 */

/* ================================================================
   Sticky container
   Mockup: sticky top-32, border-l-2 pl-6
   ================================================================ */

.g52-sticky-nav {
	position: sticky;
	top: 8rem;
	border-left: 2px solid var(--g52--color--border, #e5e7eb);
	padding-left: 1.5rem;
	align-self: start;
}

/* Auto-detect dark context (Venue Info page, footer, etc.) */
.g52-venue-info .g52-sticky-nav,
.g52-sticky-nav--dark {
	border-left-color: var(--g52--color--footer-border, #262626);
}

/* Desktop-only — hide below lg breakpoint */
@media (max-width: 1023px) {
	.g52-sticky-nav {
		display: none;
	}
}

/* ================================================================
   Navigation block — strip all defaults, force vertical layout
   ================================================================ */

.g52-sticky-nav .wp-block-navigation {
	--navigation-layout-direction: column;
	--navigation-layout-wrap: nowrap;
	--navigation-layout-justify: flex-start;
	gap: 0;
	min-width: 0;
	padding: 0;
	margin: 0;
}

/* Force the responsive container and its children to always show
   content (WordPress hides it behind a hamburger at mobile sizes) */
.g52-sticky-nav .wp-block-navigation__responsive-container,
.g52-sticky-nav .wp-block-navigation__responsive-container.is-menu-open {
	display: block !important;
	position: static !important;
	width: auto !important;
	height: auto !important;
	overflow: visible !important;
	visibility: visible !important;
	background: none !important;
	padding: 0 !important;
	margin: 0;
}

.g52-sticky-nav .wp-block-navigation__responsive-close,
.g52-sticky-nav .wp-block-navigation__responsive-dialog {
	display: block !important;
	position: static !important;
	background: none !important;
	padding: 0 !important;
	margin: 0;
	width: auto !important;
	height: auto !important;
	overflow: visible !important;
}

.g52-sticky-nav .wp-block-navigation__responsive-container-content {
	display: block !important;
	padding: 0 !important;
}

.g52-sticky-nav .wp-block-navigation__container,
.g52-sticky-nav .wp-block-page-list {
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	gap: 2rem !important;
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Strip nav item defaults */
.g52-sticky-nav .wp-block-navigation-item {
	padding: 0;
	margin: 0;
	display: block;
}

/* Hide hamburger open/close buttons and submenu arrows */
.g52-sticky-nav .wp-block-navigation__responsive-container-open,
.g52-sticky-nav .wp-block-navigation__responsive-container-close,
.g52-sticky-nav .wp-block-navigation__submenu-icon {
	display: none !important;
}

/* ================================================================
   Link styling — inactive state
   Mockup: text-gray-400 (#9ca3af), font-condensed (Oswald),
           text-lg (1.125rem), uppercase, tracking-widest (0.1em),
           hover:text-white
   ================================================================ */

.g52-sticky-nav .wp-block-navigation-item__content,
.g52-sticky-nav .wp-block-navigation-item__content:visited {
	color: #9ca3af !important;
	font-family: var(--g52--font--condensed, Oswald, sans-serif) !important;
	font-size: 1.125rem !important;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	text-decoration: none !important;
	transition: color var(--g52--transition--fast, 250ms ease);
	padding: 0 !important;
	background: none !important;
	line-height: 1.2;
	display: block;
}

.g52-sticky-nav .wp-block-navigation-item__content:hover,
.g52-sticky-nav .wp-block-navigation-item__content:focus {
	color: var(--g52--color--primary, #D90429) !important;
	text-decoration: none !important;
}

/* ================================================================
   Active page link
   Mockup: text-primary (#D90429), font-display (Anton),
           text-xl (1.25rem), uppercase, tracking-wide (0.025em)
   WordPress adds `current-menu-item` (menus) or
   `current_page_item` (Page List) to the active <li>.
   ================================================================ */

.g52-sticky-nav .current-menu-item > .wp-block-navigation-item__content,
.g52-sticky-nav .current_page_item > .wp-block-navigation-item__content,
.g52-sticky-nav .current-menu-ancestor > .wp-block-navigation-item__content,
.g52-sticky-nav .current_page_ancestor > .wp-block-navigation-item__content {
	color: var(--g52--color--primary, #D90429) !important;
	font-family: var(--g52--font--display, Anton, sans-serif) !important;
	font-size: 1.25rem !important;
	font-weight: 700;
	letter-spacing: 0.025em;
	line-height: 1.2;
}

.g52-sticky-nav .current-menu-item > .wp-block-navigation-item__content:hover,
.g52-sticky-nav .current_page_item > .wp-block-navigation-item__content:hover {
	color: var(--g52--color--primary-dark, #b00220) !important;
}
