/**
 * Plectra primary navigation — register styling (Phase 05e Wave 1).
 *
 * Rendered by plectra_primary_nav() (inc/nav.php) inside the block header part,
 * so it appears identically on every route. Warm-paper/ink/terracotta, Hanken Grotesk, no
 * system-blue, no grey pills — continuous with register.css / login.css. Quiet by
 * default; weight (not a pill) marks the current section. Wraps on narrow screens.
 *
 * 05e Wave 1 polish: the nav now reads INLINE beside the wordmark on one header
 * row (after dom.net), not on its own second row — see the header band in
 * parts/header.html. The Log-out link in that band is quieted to mist here too.
 */

/* Header band: a full-width chrome strip that brackets the narrow content column
   (after dom.net). The render wrapper emits this part at body root so it already
   spans full width; the padding + hairline bottom rule live here because
   do_blocks() strips block-level spacing/border from the static part markup. */
.plectra-header-band {
	padding: var(--wp--preset--spacing--md);
	border-bottom: 1px solid var(--wp--preset--color--rule);
}

.plectra-primary-nav {
	/* Inline beside the wordmark in the header band (one horizontal row), not a
	   second row. The header flex cluster owns the wordmark↔nav gap. */
	margin: 0;
}

.plectra-primary-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--md);
	align-items: baseline;
}

.plectra-primary-nav li {
	margin: 0;
}

.plectra-primary-nav a {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-size: 0.95rem;
	font-weight: 400;
	line-height: 1.4;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	/* Generous tap target without a pill (a11y on 320px). */
	display: inline-block;
	padding: 0.25rem 0;
	border-bottom: 1px solid transparent;
}

.plectra-primary-nav a:hover,
.plectra-primary-nav a:focus-visible {
	color: var(--wp--preset--color--accent); /* terracotta */
	border-bottom-color: var(--wp--preset--color--accent);
}

.plectra-primary-nav a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* Current section: weight + terracotta, never a filled pill. */
.plectra-primary-nav a.is-current {
	font-weight: 500;
	color: var(--wp--preset--color--accent);
	border-bottom-color: var(--wp--preset--color--rule);
}

/* Header Log out: quiet wayfinding (mist), terracotta on hover — sits at the far right
   of the header band and must not shout louder than the nav it accompanies. */
.plectra-header__exit a {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-size: 0.95rem;
	color: var(--wp--preset--color--mist);
	text-decoration: none;
}

.plectra-header__exit a:hover,
.plectra-header__exit a:focus-visible {
	color: var(--wp--preset--color--accent); /* terracotta */
}

.plectra-header__exit a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* ── Curator cluster (operator only) — set apart from member wayfinding ────────
 * IA reorg (2026-06-12): operator surfaces (Open requests · Moderation · Waitlist ·
 * Members) render as a SEPARATE nav, marked as operator chrome — a mono "Curator"
 * label + a leading rule divide it from the member row, and the links are mist
 * (quieter than the ink member links) so member wayfinding stays primary. Terracotta on
 * hover keeps the register continuous. AA: mist 6.60:1 / terracotta 5.64:1 on paper. */
.plectra-curator-nav {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--wp--preset--spacing--md);
	padding-left: var(--wp--preset--spacing--md);
	border-left: 1px solid var(--wp--preset--color--rule);
}

.plectra-curator-nav__label {
	font-family: var(--font-mono);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--mist);
}

.plectra-curator-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--md);
	align-items: baseline;
}

.plectra-curator-nav li {
	margin: 0;
}

.plectra-curator-nav a {
	font-family: var(--font-mono);
	font-size: 0.85rem;
	color: var(--wp--preset--color--mist);
	text-decoration: none;
	display: inline-block;
	padding: 0.25rem 0;
	border-bottom: 1px solid transparent;
}

.plectra-curator-nav a:hover,
.plectra-curator-nav a:focus-visible {
	color: var(--wp--preset--color--accent); /* terracotta */
	border-bottom-color: var(--wp--preset--color--accent);
}

.plectra-curator-nav a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.plectra-curator-nav a.is-current {
	color: var(--wp--preset--color--accent);
	border-bottom-color: var(--wp--preset--color--rule);
}
