/* Black Tie Ballroom — layout CSS. theme.json carries colour/type/spacing tokens;
   this carries what theme.json has no vocabulary for: the ruled-paper texture and
   the spine-tab navigation, ported from the approved scaffold
   (BlackTie_Site_Scaffold_v1_2026-09-28/index.html), adapted to real WordPress
   block markup instead of the scaffold's own hand-rolled HTML/JS. */

.bt-page-wrap {
	display: flex;
	flex-direction: row-reverse;
	align-items: stretch;
	background-color: var(--wp--preset--color--bg);
	background-image:
		radial-gradient(ellipse at 20% 10%, rgba(255,220,150,0.05), transparent 50%),
		repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 3px);
}

/* ---- the corkboard/paper content panel, ruled like a real notebook page ---- */
.bt-main-panel {
	background:
		linear-gradient(rgba(0,0,0,0.08), rgba(0,0,0,0.08)),
		var(--wp--preset--color--board);
	border: 1px solid rgba(184,146,95,0.3);
	border-radius: 10px 0 10px 10px;
	background-image:
		repeating-linear-gradient(0deg, transparent 0px, transparent 27px, rgba(184,146,95,0.16) 27px, rgba(184,146,95,0.16) 28px),
		linear-gradient(90deg, rgba(184,146,95,0.28) 0px, rgba(184,146,95,0.28) 2px, transparent 2px, transparent 54px);
	background-size: 100% 28px, 100% 100%;
	background-position: 0 8px, 0 0;
	padding: 28px 24px 40px;
}

/* ---- spine tabs — the coloured thumb-index tabs on a reference book, right side ---- */
.bt-nav-rail {
	flex: 0 0 auto;
	width: 34px;
	padding-top: 10px;
}
.bt-nav-rail .wp-block-navigation__container,
.bt-nav-rail ul {
	display: flex;
	flex-direction: column;
	gap: 5px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.bt-nav-rail .wp-block-navigation-item {
	list-style: none;
}
.bt-nav-rail .wp-block-navigation-item:nth-child(even) {
	margin-left: 7px;
}
.bt-nav-rail .wp-block-navigation-item__content,
.bt-nav-rail a {
	writing-mode: vertical-rl;
	text-orientation: upright;
	font-family: var(--wp--preset--font-family--stamp);
	font-size: 0.64rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	line-height: 1.15;
	background: var(--wp--preset--color--board-2);
	color: var(--wp--preset--color--muted);
	border: 1px solid rgba(184,146,95,0.3);
	border-left: none;
	padding: 12px 5px;
	border-radius: 0 5px 5px 0;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.35);
	min-height: 76px;
	max-height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}
.bt-nav-rail .current-menu-item > a,
.bt-nav-rail a[aria-current="page"] {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--paper);
	font-weight: 600;
}
.bt-nav-rail a:hover {
	color: var(--wp--preset--color--gold);
}

/* ---- editorial / placeholder notes, matching the scaffold's convention ---- */
.bt-editorial-note {
	background: #f6f1e7;
	border-left: 4px solid #b08d57;
	padding: 1rem 1.25rem;
	color: #221c12;
	font-size: 0.85rem;
}

@media (max-width: 460px) {
	.bt-page-wrap { flex-direction: column !important; }
	.bt-nav-rail { width: auto; padding-top: 0; }
	.bt-nav-rail .wp-block-navigation__container,
	.bt-nav-rail ul { flex-direction: row; flex-wrap: wrap; }
	.bt-nav-rail .wp-block-navigation-item__content,
	.bt-nav-rail a {
		writing-mode: horizontal-tb;
		min-height: auto; max-height: none;
		border-radius: 6px 6px 0 0;
		border: 1px solid rgba(184,146,95,0.3);
		border-bottom: none;
		margin-left: 0 !important;
		padding: 8px 12px;
	}
}