/*
 * Blind Skeleton Parlour — decorative styles.
 * Colours come from the theme palette (Appearance → Editor → Styles → Colors),
 * so changing a colour there changes it here too.
 */

/* ---------- Small text helpers used in the templates ---------- */

.parlour-eyebrow {
	font-family: var(--wp--preset--font-family--im-fell-english-sc);
	letter-spacing: 0.14em;
	color: var(--wp--preset--color--accent-1);
}

.parlour-lede {
	font-style: italic;
	color: var(--wp--preset--color--accent-4);
}

.parlour-dim {
	color: var(--wp--preset--color--paper-dim);
}

.has-contrast-background-color .parlour-lede {
	color: var(--wp--preset--color--paper-dim);
}

/* "Read the series →" style links */
.parlour-more {
	font-family: var(--wp--preset--font-family--im-fell-english-sc);
	font-size: 1.15rem;
}

.parlour-more a {
	text-decoration: none;
}

.parlour-more a:hover {
	text-decoration: underline;
}

/* Big "Three Tune Tuesday" heading in the hero */
.parlour-display {
	font-size: clamp(2.6rem, 1.9rem + 2.6vw, 3.75rem);
	font-weight: 900;
	line-height: 1.05;
}

/* Parchment band with hairlines top and bottom */
.parlour-band {
	border-top: 1px solid #CDBB98;
	border-bottom: 1px solid #CDBB98;
}

.parlour-subhead {
	margin-top: var(--wp--preset--spacing--70) !important;
	margin-bottom: var(--wp--preset--spacing--40) !important;
}

/* Top strip above the masthead */
.parlour-strip {
	font-family: var(--wp--preset--font-family--im-fell-english-sc);
	font-size: 0.95rem;
	letter-spacing: 0.08em;
	margin: 0;
}

/* Masthead */
.parlour-masthead {
	text-align: center;
}

.parlour-masthead > * + * {
	margin-block-start: 0.85rem;
}

.parlour-kicker {
	color: var(--wp--preset--color--accent-4);
	letter-spacing: 0.2em;
	font-size: 1rem;
}

.parlour-title-masthead {
	font-size: clamp(2.5rem, 1rem + 6vw, 5.75rem) !important;
}

/* Let the site name use the full width rather than the narrow reading column */
.parlour-masthead > .wp-block-site-title,
.wp-block-site-title.parlour-title-compact {
	max-width: none !important;
}

.parlour-title-compact {
	font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem) !important;
}

.parlour-motto {
	font-size: 1.2rem;
}

.parlour-masthead .parlour-double-rules,
.wp-block-site-title + .parlour-double-rules {
	margin-block-start: var(--wp--preset--spacing--40);
}

/* Footer */
.parlour-footer-title {
	font-family: var(--wp--preset--font-family--playfair-display);
	font-size: 1.5rem;
	color: var(--wp--preset--color--base);
}

.parlour-footer-menu {
	font-size: 1.1rem;
}

/* Menu spacing between the double rules */
.parlour-double-rules .wp-block-navigation {
	font-size: 1.1rem;
}

.parlour-double-rules .wp-block-navigation__container {
	column-gap: 1.25rem;
	row-gap: 0.1rem;
}

/* A heading with double rules running out to either side */
.parlour-flanked {
	display: flex;
	align-items: center;
	gap: 1.1rem;
}

.parlour-flanked::before,
.parlour-flanked::after {
	content: "";
	flex: 1 1 2rem;
	border-top: 3px double currentColor;
}

/* Double rules above and below (used around the main menu) */
.parlour-double-rules {
	border-top: 3px double var(--wp--preset--color--contrast);
	border-bottom: 3px double var(--wp--preset--color--contrast);
}

/* ---------- Block style: 78 Record (Image block) ---------- */

.wp-block-image.is-style-parlour-record {
	width: 100%;
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
	aspect-ratio: 1;
	border-radius: 50%;
	background: repeating-radial-gradient(circle at center,
		#161010 0px, #161010 2px,
		#2C2421 3px, #161010 4px);
	box-shadow: 0 18px 40px rgba(43, 29, 20, 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.wp-block-image.is-style-parlour-record img {
	width: 46% !important;
	height: auto !important;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
	border: 5px solid var(--wp--preset--color--accent-1);
	box-sizing: border-box;
}

.wp-block-image.is-style-parlour-record figcaption {
	display: none;
}

@keyframes parlour-spin {
	to { transform: rotate(360deg); }
}

.wp-block-image.is-style-parlour-record:hover {
	animation: parlour-spin 0.77s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-image.is-style-parlour-record:hover { animation: none; }
}

/* ---------- Block style: Framed Card (Group block) ---------- */

.wp-block-group.is-style-parlour-frame {
	background-color: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--contrast);
	outline: 1px solid var(--wp--preset--color--contrast);
	outline-offset: -7px;
	padding: 1.9rem;
}

/* ---------- Block style: Theatre Ticket (Group block) ---------- */

.wp-block-group.is-style-parlour-ticket {
	border: 2px dashed var(--wp--preset--color--accent-2);
	padding: 1.9rem;
}

.is-style-parlour-ticket .parlour-eyebrow {
	color: var(--wp--preset--color--brass-light);
	letter-spacing: 0.24em;
}

.is-style-parlour-ticket :where(h1, h2, h3, h4) a {
	color: inherit;
	text-decoration: none;
}

.is-style-parlour-ticket :where(h1, h2, h3, h4) a:hover {
	text-decoration: underline;
}

/* ---------- Block styles: separators ---------- */

hr.wp-block-separator.is-style-parlour-ornament {
	border: none;
	height: 14px;
	width: 100%;
	max-width: 520px;
	margin-left: auto;
	margin-right: auto;
	opacity: 1;
	position: relative;
	background: linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat;
}

hr.wp-block-separator.is-style-parlour-ornament::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	transform: translate(-50%, -50%) rotate(45deg);
	background: var(--wp--preset--color--accent-1);
	box-shadow: 0 0 0 6px var(--wp--preset--color--base);
}

hr.wp-block-separator.is-style-parlour-double {
	border: none;
	border-top: 3px double currentColor;
	opacity: 1;
	width: 100%;
}

/* ---------- Dark bands (Picture Palace, footer) ---------- */

.has-contrast-background-color :where(h1, h2, h3, h4, h5, h6) {
	color: var(--wp--preset--color--base);
}

.has-contrast-background-color a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--paper-dim);
}

.has-contrast-background-color a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--base);
}

/* ---------- Header and menu ---------- */

.parlour-double-rules .wp-block-navigation {
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
}

.wp-block-navigation .wp-block-navigation-item__content {
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
}

/* Dropdowns: cream card with an ink border */
.wp-block-navigation .wp-block-navigation__submenu-container {
	background-color: var(--wp--preset--color--card) !important;
	color: var(--wp--preset--color--contrast) !important;
	border: 1px solid var(--wp--preset--color--contrast) !important;
	padding: 0.4rem 0;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.45rem 1.1rem;
}

/* Mobile menu overlay */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	border: none !important;
	background: transparent !important;
}

/* ---------- Posts ---------- */

/* Featured images get a photo-mount border */
.wp-block-post-featured-image img {
	border: 1px solid var(--wp--preset--color--contrast);
	padding: 6px;
	background: var(--wp--preset--color--card);
	box-sizing: border-box;
}

/* Hide the record-cabinet heading rules on very narrow screens so the text has room */
@media (max-width: 420px) {
	.parlour-flanked::before,
	.parlour-flanked::after {
		flex-basis: 0.75rem;
	}
}
