/* Info Popups – frontend. Scoped to .ipop so theme styles do not leak in or out. */
.ipop {
	position: fixed;
	inset: 0;
	z-index: var(--ipop-z, 99990);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	box-sizing: border-box;
	font-size: 16px;
	line-height: 1.55;
}
.ipop[hidden] { display: none !important; }
.ipop *,
.ipop *::before,
.ipop *::after { box-sizing: border-box; }

.ipop__overlay {
	position: absolute;
	inset: 0;
	background: var(--ipop-overlay, rgba(0, 0, 0, .6));
	opacity: 0;
	transition: opacity .25s ease;
	cursor: pointer;
}

.ipop__dialog {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow-y: auto;
	overscroll-behavior: contain;
	margin: 0;
	background: var(--ipop-bg, #fff);
	color: var(--ipop-text, #1f1f1f);
	border-radius: var(--ipop-radius, 14px);
	box-shadow: 0 24px 64px rgba(0, 0, 0, .28);
	text-align: var(--ipop-align, left);
	opacity: 0;
	transform: translateY(14px) scale(.98);
	transition: opacity .25s ease, transform .25s ease;
	outline: none;
}
.ipop .ipop__dialog:focus,
.ipop .ipop__dialog:focus-visible { outline: none; box-shadow: 0 24px 64px rgba(0, 0, 0, .28); }
.ipop__dialog--small { max-width: 420px; }
.ipop__dialog--large { max-width: 760px; }

.ipop.is-open .ipop__overlay,
.ipop.is-open .ipop__dialog {
	opacity: 1;
	transform: none;
}

.ipop .ipop__close {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: var(--ipop-close-radius, 20px);
	background: var(--ipop-close-bg, #fff);
	color: var(--ipop-close-color, #1f1f1f);
	box-shadow: 0 1px 6px rgba(0, 0, 0, .22);
	cursor: pointer;
	line-height: 1;
	transition: transform .15s ease;
}
.ipop .ipop__close:hover,
.ipop .ipop__close:focus {
	background: var(--ipop-close-bg, #fff);
	color: var(--ipop-close-color, #1f1f1f);
	transform: scale(1.06);
}
.ipop .ipop__close:focus-visible { outline: 3px solid var(--ipop-accent, #222); outline-offset: 2px; }
.ipop .ipop__close svg { display: block; width: 18px; height: 18px; }
.ipop .ipop__close path { stroke: currentColor; stroke-width: var(--ipop-close-width, 2.4); }

.ipop__image { margin: 0; line-height: 0; }
.ipop .ipop__img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 50vh;
	margin: 0;
	border: 0;
	border-radius: 0;
	object-fit: cover;
	box-shadow: none;
}

.ipop__body { padding: 28px 28px 30px; }
.ipop__dialog--no-image .ipop__body { padding-top: 32px; }

.ipop .ipop__title {
	margin: 0 0 10px;
	padding: 0;
	color: inherit;
	font-family: inherit;
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: normal;
	text-transform: none;
}
.ipop__dialog--no-image .ipop__title { padding-right: 40px; }

.ipop__text { color: inherit; }
.ipop__text > :first-child { margin-top: 0; }
.ipop__text > :last-child { margin-bottom: 0; }
.ipop__text p,
.ipop__text ul,
.ipop__text ol { margin: 0 0 .8em; }
.ipop__text ul,
.ipop__text ol { padding-left: 1.3em; }
.ipop__text a { color: inherit; text-decoration: underline; }

.ipop .ipop__button {
	display: inline-block;
	margin-top: 20px;
	padding: 12px 22px;
	border: 0;
	border-radius: var(--ipop-button-radius, 8px);
	background: var(--ipop-accent, #222);
	color: var(--ipop-accent-text, #fff);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: filter .15s ease;
}
.ipop .ipop__button:hover,
.ipop .ipop__button:focus { color: var(--ipop-accent-text, #fff); filter: brightness(1.12); text-decoration: none; }
.ipop .ipop__button:focus-visible { outline: 3px solid var(--ipop-accent, #222); outline-offset: 3px; }

/* Custom HTML: only the block and the close button are ours. */
.ipop__html { min-height: 60px; }
.ipop__html::after { content: ""; display: table; clear: both; }
.ipop__html img,
.ipop__html video,
.ipop__html iframe { max-width: 100%; }
.ipop__html img { height: auto; }

html.ipop-locked { overflow: hidden; }
html.ipop-locked body { padding-right: var(--ipop-scrollbar, 0); }

@media (max-width: 480px) {
	.ipop__body { padding: 22px 20px 24px; }
	.ipop .ipop__title { font-size: 1.3em; }
}

@media (prefers-reduced-motion: reduce) {
	.ipop__overlay,
	.ipop__dialog,
	.ipop .ipop__close { transition: none; }
}