/*
 * The Eastern Border - poster restyle, v2 (dark)
 * Sits on top of MH Magazine lite. Remove the enqueue line in functions.php
 * (handle "eb-poster") to switch the whole restyle off.
 * Dark ground, warm off-white text, Soviet red accents.
 */

:root {
	--eb-page: #0f0d0b;        /* outer background */
	--eb-panel: #1b1713;       /* content panel */
	--eb-panel-2: #26201a;     /* fields, player frame */
	--eb-line: #3a3128;        /* thin rules */
	--eb-text: #e9e0cc;        /* body text, warm off-white like the covers */
	--eb-text-soft: #c9bea6;
	--eb-muted: #a3957d;
	--eb-red: #d81e35;         /* accent fills */
	--eb-red-bright: #f25366;  /* red text on dark, readable at small sizes */
	--eb-black: #000;
	--eb-display: 'Oswald', 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif;
	--eb-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
}

/* ---------- Page and frame ---------- */

body,
body.custom-background {
	background: var(--eb-page) !important;
	background-image: none !important;
	color: var(--eb-text);
	font-family: var(--eb-serif);
	font-size: 17px;
	line-height: 1.65;
}

.mh-container-outer {
	margin: 0 auto 40px;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	border-left: 1px solid var(--eb-line);
	border-right: 1px solid var(--eb-line);
}

.mh-wrapper {
	background: var(--eb-panel);
	padding: 32px;
}

a { color: var(--eb-text); }
a:hover { color: var(--eb-red-bright); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--eb-display);
	color: var(--eb-text);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 0.01em;
}

/* ---------- Header: banner fills its box, no white gap ---------- */

.mh-header { background: var(--eb-black); }

.mh-header .mh-container-inner { padding: 0; }

.mh-header-image-link,
.mh-header-image {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}

/* ---------- Navigation ---------- */

.mh-main-nav-wrap { background: var(--eb-black); }

.mh-main-nav {
	border-bottom: 6px solid var(--eb-red);
	font-family: var(--eb-display);
	letter-spacing: 0.08em;
}

.mh-main-nav li { font-weight: 600; }

.mh-main-nav li a {
	color: var(--eb-text);
	padding: 12px 22px;
	border-left: 1px solid rgba(233, 224, 204, 0.12);
}

.mh-main-nav li:hover,
.mh-main-nav .menu > .current-menu-item { background: var(--eb-red); }

.mh-main-nav ul li:hover > ul { background: var(--eb-black); }

.mh-main-nav-wrap .slicknav_menu { background: var(--eb-black); }
.mh-main-nav-wrap .slicknav_btn { background: var(--eb-red); }

/* ---------- Episode list ---------- */

.mh-loop-item {
	padding-bottom: 28px;
	margin-bottom: 28px;
	border-bottom: 1px solid var(--eb-line);
}

.mh-loop-thumb { margin-right: 24px; }

.mh-loop-thumb img {
	max-width: 235px;
	border: 3px solid var(--eb-black);
	box-shadow: 6px 6px 0 var(--eb-red);
	-webkit-box-shadow: 6px 6px 0 var(--eb-red);
	transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}

.mh-loop-thumb a:hover img {
	transform: translate(-2px, -2px);
	box-shadow: 8px 8px 0 var(--eb-red);
}

.mh-loop-title {
	font-size: 23px;
	font-size: 1.45rem;
	text-transform: uppercase;
	line-height: 1.08;
}

.mh-loop-title a { color: var(--eb-text); }
.mh-loop-title a:hover { color: var(--eb-red-bright); }

.mh-loop-excerpt { color: var(--eb-text-soft); }

/* Meta line: keep the date, drop author and the always-zero comment count */
.mh-meta,
.mh-meta a {
	font-family: var(--eb-display);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--eb-red-bright);
	font-size: 13px;
}

.mh-meta .mh-meta-author,
.mh-meta .mh-meta-comments { display: none; }

/* Podcast player line under each episode */
.podcast_meta,
.podcast_meta a {
	font-family: var(--eb-display);
	font-size: 13px;
	letter-spacing: 0.04em;
	color: var(--eb-muted);
}

.podcast_meta a:hover { color: var(--eb-red-bright); }

/* Castos / SSP player: frame it so it does not melt into the dark panel */
.castos-player {
	border: 1px solid var(--eb-line);
	box-shadow: 4px 4px 0 var(--eb-red);
}

/* Theme leftovers that assume a white page */
.mh-widget, .mh-footer-widget { color: var(--eb-text); }
.widget_archive li, .widget_categories li, .widget_pages li a, .widget_meta li,
.widget_nav_menu .menu > li, .widget_rss li { border-color: var(--eb-line); }
.entry-header, .page-header, .mh-loop-description, .mh-author-box, .mh-post-nav {
	border-color: var(--eb-line);
}
input, textarea, select {
	background: var(--eb-panel-2);
	color: var(--eb-text);
	border: 1px solid var(--eb-line);
}

/* ---------- Single episode / page ---------- */

.entry-title,
.page-title {
	font-size: 40px;
	font-size: 2.5rem;
	text-transform: uppercase;
	line-height: 1.05;
}

.entry-content { font-size: 18px; line-height: 1.7; }

.entry-content a {
	color: var(--eb-red-bright);
	text-decoration: underline;
	text-underline-offset: 2px;
}

blockquote {
	font-family: var(--eb-serif);
	color: var(--eb-text-soft);
	border-left: 6px solid var(--eb-red);
}

/* ---------- Sidebar ---------- */

.mh-sidebar {
	overflow-wrap: anywhere;
	word-wrap: break-word;
}

.mh-widget-title {
	border-bottom: 3px solid var(--eb-red);
	padding-bottom: 0;
	letter-spacing: 0.06em;
}

.mh-widget-title-inner {
	display: inline-block;
	background: var(--eb-red);
	color: #fff;
	padding: 5px 12px 3px;
}

/* Blog-era widgets that list 2015-2024 posts instead of episodes. Hidden here
   for the preview; remove them in Appearance > Widgets once approved. */
.mh-sidebar .widget_categories,
.mh-sidebar .widget_archive,
.mh-sidebar .widget_recent_entries,
.mh-sidebar .widget_recent_comments,
.mh-sidebar .widget_meta { display: none; }

.mh-widget .search-form .search-field,
.search-form .search-field {
	background: var(--eb-panel-2);
	border: 1px solid var(--eb-line);
	color: var(--eb-text);
	font-family: var(--eb-display);
}

/* ---------- Pagination ---------- */

.page-numbers {
	font-family: var(--eb-display);
	background: var(--eb-panel-2);
	color: var(--eb-text);
}

.page-numbers:hover,
.mh-loop-pagination .current {
	background: var(--eb-red);
	color: #fff;
}

/* ---------- Footer ---------- */

.mh-footer,
.mh-copyright-wrap {
	background: var(--eb-black);
	color: var(--eb-text);
}

.mh-copyright-wrap { border-top: 6px solid var(--eb-red); }

.mh-copyright,
.mh-copyright a { color: var(--eb-muted); }

/* ---------- Small screens ---------- */

@media screen and (max-width: 767px) {
	body { font-size: 16px; }
	.mh-wrapper { padding: 18px; }
	.mh-loop-thumb {
		float: none;
		margin: 0 0 18px;
	}
	.mh-loop-thumb img { max-width: 100%; width: 100%; }
	.mh-loop-title { font-size: 22px; font-size: 1.375rem; }
	.entry-title,
	.page-title { font-size: 30px; font-size: 1.875rem; }
}

/* ===================== v3 additions ===================== */

/* Action strip under the menu: Bluesky, Patreon, merch (content-header.php) */
.eb-actionbar {
	background: var(--eb-panel);
	border-bottom: 1px solid var(--eb-line);
}
.eb-actionbar-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 6px 22px;
	padding: 8px 22px;
	font-family: var(--eb-display);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}
.eb-actionbar a { color: var(--eb-muted); }
.eb-actionbar a:hover { color: var(--eb-text); }
.eb-actionbar a.eb-actionbar-merch {
	color: var(--eb-red-bright);
	padding: 0 10px;
	box-shadow: inset 0 0 0 1px var(--eb-red);
}
.eb-actionbar a.eb-actionbar-merch:hover { color: #fff; background: var(--eb-red); }
@media screen and (max-width: 767px) {
	.eb-actionbar-inner { justify-content: center; padding: 8px 12px; }
}

/* Mastodon box in the sidebar: no longer used */
#custom_html-3 { display: none; }

/* Sidebar: hide RuSov ad and the old T-shirt affiliate script widget, and the
   duplicated second copy of search. Remove these properly in Appearance >
   Widgets; this only hides them. */
#text-3,
#text-2 { display: none; }
.mh-sidebar .widget_search ~ .widget_search { display: none; }

/* Search box: no light panel behind it */
.mh-widget .search-form,
.search-form {
	background: transparent;
	padding: 0;
}
.mh-widget .search-form .search-field,
.search-form .search-field {
	width: 100%;
	padding: 10px 12px;
	letter-spacing: 0.06em;
}

/* Episode page meta: date only, no author, empty category or zero count */
.entry-meta {
	border-top: 1px solid var(--eb-line);
	border-bottom: 1px solid var(--eb-line);
}
.entry-meta-author,
.entry-meta-categories,
.entry-meta-comments { display: none !important; }

/* In the episode list the cover already shows on the left, so drop the
   second copy inside the player */
.mh-loop-item .castos-player .player__artwork { display: none; }

/* Pinned merch post becomes a slim red announcement bar */
.home .mh-loop-item.sticky {
	background: var(--eb-red);
	padding: 16px 20px;
	border-bottom: none;
	box-shadow: 6px 6px 0 var(--eb-black);
}
.home .mh-loop-item.sticky .mh-loop-thumb,
.home .mh-loop-item.sticky .mh-loop-meta { display: none; }
.home .mh-loop-item.sticky .mh-loop-header { margin-bottom: 4px; }
.home .mh-loop-item.sticky .mh-loop-title {
	font-size: 20px;
	font-size: 1.25rem;
}
.home .mh-loop-item.sticky a,
.home .mh-loop-item.sticky .mh-loop-title a,
.home .mh-loop-item.sticky .mh-loop-excerpt { color: #fff; }
.home .mh-loop-item.sticky .mh-loop-excerpt { font-size: 15px; }

/* Newest episode, first page only: bigger cover and title */
body.home:not(.paged) .mh-loop-item.sticky + .mh-loop-item .mh-loop-thumb img { max-width: 300px; }
body.home:not(.paged) .mh-loop-item.sticky + .mh-loop-item .mh-loop-title {
	font-size: 32px;
	font-size: 2rem;
}

@media screen and (max-width: 767px) {
	body.home:not(.paged) .mh-loop-item.sticky + .mh-loop-item .mh-loop-thumb img { max-width: 100%; }
	body.home:not(.paged) .mh-loop-item.sticky + .mh-loop-item .mh-loop-title {
		font-size: 26px;
		font-size: 1.625rem;
	}
}
