/**
 * hm/bunny-video — frontend styles.
 *
 * Fixed 16:9 frame for EVERY video (vertical sources letterbox inside
 * Bunny's player; fullscreen is available) — matches the site's legacy
 * hand-pasted Bunny embeds 1:1. Breakpoint-free by design (no fit-desktop
 * regeneration needed).
 */

.hm-bunny-video {
	margin: 0 0 20px;
}

.hm-bunny-video__frame {
	position: relative;
	padding-top: 56.25%; /* 16:9 — same ratio as the legacy manual embeds */
	border-radius: 12px;
	overflow: hidden;
	background: #000;
}

.hm-bunny-video__iframe {
	position: absolute;
	top: 0;
	inset-inline-start: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Caption/credit line — mirrors .post-thumbnail__caption (single.css). */
.hm-bunny-video__caption {
	margin: 8px 0 0;
	font-family: var(--hm-font-primary);
	font-size: 13px;
	font-weight: 300;
	line-height: 1.4;
	color: var(--hm-color-text-muted, #6b7280);
	text-align: center;
	unicode-bidi: isolate;
}

/* === Processing placeholder (shown until Bunny finishes encoding; the
   cron purges the page cache and this flips to the iframe — same 16:9
   frame, so no CLS) === */

.hm-bunny-video--processing .hm-bunny-video__frame {
	background: rgba(33, 33, 33, 0.06);
}

.hm-bunny-video__processing-inner {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 16px;
	text-align: center;
}

.hm-bunny-video__processing-text {
	margin: 0;
	font-family: var(--hm-font-primary);
	font-size: 15px;
	font-weight: 700;
	color: var(--hm-color-text, #212121);
}

.hm-bunny-video__spinner {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 3px solid rgba(33, 33, 33, 0.15);
	border-top-color: var(--hm-color-accent, #ff173e);
	animation: hm-bunny-video-spin 900ms linear infinite;
	/* If the visitor sits on the placeholder, stop painting eventually
	   (page refresh/cache purge is what reveals the video anyway). */
	animation-iteration-count: 40;
}

@keyframes hm-bunny-video-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-bunny-video__spinner {
		animation: none;
	}
}