/**
 * Eagle Mountain Value — beehiiv Bridge.
 *
 * Two jobs:
 *   1. Style the shortcode subscribe form + the inline status messages.
 *   2. Normalise the HTML that arrives from beehiiv so an imported issue reads
 *      like the rest of the site instead of like an email.
 *
 * Colours are the brand tokens from the Eagle Mountain Value design system:
 * Deep Navy #0d2337, Sunrise Gold #eda23c, Ink #111827, Slate #6b7280.
 */

/* ==========================================================================
   Subscribe form (shortcode) + status messages
   ========================================================================== */

.emv-beehiiv-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* The honeypot must be reachable by a naive bot but never by a person. */
.emv-beehiiv-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.emv-beehiiv-block .emv-subscribe {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 480px;
	margin: 0;
}

.emv-beehiiv-input {
	flex: 1 1 220px;
	min-width: 0;
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 14px 18px;
	color: #111827;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.2;
	outline: none;
	transition: border-color 120ms ease, box-shadow 120ms ease;
}

.emv-beehiiv-input::placeholder {
	color: #9ca3af;
}

.emv-beehiiv-input:focus {
	border-color: #0d2337;
	box-shadow: 0 0 0 3px rgba(237, 162, 60, 0.35);
}

.emv-beehiiv-button {
	background: #0d2337;
	color: #ffffff;
	font-family: inherit;
	font-weight: 700;
	font-size: 16px;
	padding: 14px 26px;
	border: 1px solid transparent;
	border-radius: 8px;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color 120ms ease;
}

.emv-beehiiv-button:hover:not(:disabled) {
	background: #16344e;
}

.emv-beehiiv-button:disabled {
	opacity: 0.55;
	cursor: progress;
}

.emv-beehiiv-button:focus-visible,
.emv-beehiiv-input:focus-visible {
	outline: 2px solid #eda23c;
	outline-offset: 2px;
}

.emv-beehiiv-note {
	margin: 14px 0 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: #6b7280;
}

.emv-beehiiv-done {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	margin: 0;
	background: rgba(237, 162, 60, 0.14);
	border: 1px solid #eda23c;
	border-radius: 8px;
	padding: 14px 22px;
	font-size: 15.5px;
	color: #111827;
}

/* Dark variant — for the navy conversion panels. */
.emv-beehiiv-block--dark .emv-beehiiv-input {
	border-color: #24486a;
}

.emv-beehiiv-block--dark .emv-beehiiv-button {
	background: #eda23c;
	color: #071825;
}

.emv-beehiiv-block--dark .emv-beehiiv-button:hover:not(:disabled) {
	background: #f2b764;
}

.emv-beehiiv-block--dark .emv-beehiiv-note {
	color: #6b8299;
}

.emv-beehiiv-block--dark .emv-beehiiv-done {
	color: #ffffff;
}

/* Status line. Injected by the script, so it styles both the shortcode form
   and the theme's own hand-built forms. */
.emv-beehiiv-message {
	margin: 12px 0 0;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.5;
	color: #2f6f4f;
}

.emv-beehiiv-message--error {
	color: #b3402f;
}

/* On a navy field the error red is unreadable; lift it to a gold-tinted warn. */
.emv-beehiiv-block--dark .emv-beehiiv-message,
[style*="background: #0d2337"] .emv-beehiiv-message,
[style*="background: #071825"] .emv-beehiiv-message {
	color: #f7d7a3;
}

/* ==========================================================================
   Imported issue body
   --------------------------------------------------------------------------
   beehiiv ships full email/web HTML with its own inline styles. These rules
   set the surrounding rhythm and rein in the parts that would otherwise break
   the layout (oversized images, fixed-width tables, stray heading scales).
   ========================================================================== */

.emv-issue-body {
	font-size: 18.5px;
	line-height: 1.72;
	color: #26313c;
	overflow-wrap: break-word;
}

.emv-issue-body > *:first-child {
	margin-top: 0;
}

.emv-issue-body p,
.emv-issue-body ul,
.emv-issue-body ol {
	margin: 0 0 24px;
}

.emv-issue-body ul,
.emv-issue-body ol {
	padding-left: 24px;
}

.emv-issue-body li {
	margin-bottom: 8px;
}

.emv-issue-body h1,
.emv-issue-body h2,
.emv-issue-body h3,
.emv-issue-body h4 {
	color: #111827;
	letter-spacing: -0.015em;
	scroll-margin-top: 96px;
}

.emv-issue-body h1,
.emv-issue-body h2 {
	font-family: 'Newsreader', Georgia, serif;
	font-weight: 500;
	font-size: 30px;
	line-height: 1.2;
	margin: 44px 0 22px;
}

.emv-issue-body h3 {
	font-size: 21px;
	font-weight: 700;
	line-height: 1.3;
	margin: 36px 0 12px;
}

.emv-issue-body h4 {
	font-size: 17px;
	font-weight: 700;
	margin: 28px 0 10px;
}

.emv-issue-body a {
	color: #ab6522;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

.emv-issue-body a:hover {
	color: #b8681f;
}

.emv-issue-body strong,
.emv-issue-body b {
	color: #111827;
	font-weight: 700;
}

.emv-issue-body blockquote {
	margin: 0 0 28px;
	padding: 4px 0 4px 22px;
	border-left: 3px solid #eda23c;
	font-family: 'Newsreader', Georgia, serif;
	font-style: italic;
	font-size: 22px;
	line-height: 1.5;
	color: #0d2337;
}

.emv-issue-body blockquote p:last-child {
	margin-bottom: 0;
}

.emv-issue-body hr {
	border: none;
	border-top: 1px solid #e5e7eb;
	margin: 44px 0;
}

.emv-issue-body img,
.emv-issue-body video,
.emv-issue-body iframe {
	max-width: 100%;
	height: auto;
	border-radius: 12px;
}

.emv-issue-body figure {
	margin: 0 0 28px;
}

.emv-issue-body figcaption {
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.5;
	color: #9ca3af;
	text-align: center;
}

.emv-issue-body iframe {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
}

/* Email HTML is table-driven. Neutralise fixed widths so it reflows. */
.emv-issue-body table {
	width: 100% !important;
	max-width: 100% !important;
	border-collapse: collapse;
	margin: 0 0 28px;
	font-size: 16px;
}

.emv-issue-body table td,
.emv-issue-body table th {
	width: auto !important;
	padding: 10px 12px;
	vertical-align: top;
	text-align: left;
}

/* Layout tables (no borders in the source) should not gain any. */
.emv-issue-body table[border]:not([border="0"]) td,
.emv-issue-body table[border]:not([border="0"]) th {
	border: 1px solid #e5e7eb;
}

/* beehiiv wraps content in fixed-width containers; let them breathe. */
.emv-issue-body [width],
.emv-issue-body [style*="width:"] {
	max-width: 100%;
}

/* Anything genuinely wide gets its own scroller rather than the page. */
.emv-issue-body pre {
	overflow-x: auto;
	background: #f7f8fa;
	border: 1px solid #eef0f3;
	border-radius: 10px;
	padding: 16px 18px;
	font-size: 14px;
	line-height: 1.55;
}

/* The "read the rest on beehiiv" panel used for gated/premium issues. */
.emv-issue-gate {
	margin: 8px 0 0;
	padding: 34px;
	border-radius: 16px;
	background: #0d2337;
	color: #ffffff;
	text-align: center;
}

.emv-issue-gate p {
	margin: 0 0 20px;
	font-size: 16.5px;
	line-height: 1.6;
	color: #cdd8e3;
}

.emv-issue-gate a {
	display: inline-block;
	background: #eda23c;
	color: #071825;
	font-weight: 700;
	font-size: 15.5px;
	padding: 13px 28px;
	border-radius: 8px;
	text-decoration: none;
}

.emv-issue-gate a:hover {
	background: #f2b764;
}

@media (max-width: 720px) {
	.emv-issue-body {
		font-size: 17.5px;
	}

	.emv-issue-body h1,
	.emv-issue-body h2 {
		font-size: 26px;
	}
}
