/*
 * **********************************************************************
 * Blog Post Back Banner
 *
 * Full-width "← Back" banner shown under the site header on single
 * blog post pages, styled to match .mah-events-header.
 *
 * @package  KadenceChild
 * @version  1.0.1
 * @updated  2026-08-19
 * **********************************************************************
 */

.mah-blog-post-back {
	position: relative;
	left: 50%;
	width: 100vw;
	margin-left: -50vw;
	display: flex;
	align-items: center;
	gap: var(--mah-space-4);
	padding: 10px 16px;
	background: var(--mah-green-dark);
}

.mah-blog-post-back__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	background: var(--btn-primary-bg);
	color: var(--btn-primary-text);
	font-size: var(--mah-font-sm2);
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: none;
	border-radius: var(--mah-radius-sm);
	white-space: nowrap;
	flex-shrink: 0;
}

.mah-blog-post-back__link:hover,
.mah-blog-post-back__link:focus {
	color: var(--btn-primary-hover-text);
	text-decoration: none;
	outline: none;
}

.mah-blog-post-back__link:visited { color: var(--btn-primary-visited); }

.mah-blog-post-back__link:focus-visible {
	outline: 2px solid var(--mah-white);
	outline-offset: 2px;
}

.mah-blog-post-back__title {
	margin: 0;
	padding: 0;
	color: var(--mah-white);
	font-size: var(--mah-font-xl);
	font-weight: 700;
	text-shadow: 0 1px 3px rgba(0,0,0,0.5);
	letter-spacing: 0.02em;
}