/**
 * Siaya Smart Popup Alerts — front-end styles.
 * Brand: Siaya Green #4A9236, Gold #D4AE67, Open Sans.
 */

.sspa-root,
.sspa-popup {
	--sspa-primary: #4a9236;
	--sspa-accent: #d4ae67;
	--sspa-font: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--sspa-max-width: 620px;

	/* Motion tokens — single source of truth for every animation. */
	--sspa-ease: cubic-bezier(0.16, 1, 0.3, 1); /* expo-out: fast start, soft landing */
	--sspa-ease-in: cubic-bezier(0.4, 0, 1, 1);
	--sspa-dur-in: 420ms;
	--sspa-dur-out: 240ms;
	--sspa-reveal: 460ms;
	--sspa-stagger: 55ms;
	--sspa-shift: 16px;
}

/* Spring: overshoot, playful but contained. */
.sspa-motion-spring {
	--sspa-ease: cubic-bezier(0.34, 1.46, 0.62, 1);
	--sspa-dur-in: 520ms;
	--sspa-dur-out: 220ms;
	--sspa-reveal: 420ms;
	--sspa-stagger: 45ms;
	--sspa-shift: 22px;
}

/* Slide: glides in from the edge with no scaling. */
.sspa-motion-slide {
	--sspa-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--sspa-dur-in: 480ms;
	--sspa-dur-out: 260ms;
	--sspa-reveal: 1ms;
	--sspa-stagger: 0ms;
	--sspa-shift: 46px;
}

.sspa-motion-slide .sspa-popup__inner,
.sspa-motion-slide.sspa-popup .sspa-popup__inner {
	transform: translate3d(0, var(--sspa-shift), 0);
}

/* Zoom: crisp scale-up. */
.sspa-motion-zoom {
	--sspa-ease: cubic-bezier(0.2, 0.9, 0.28, 1);
	--sspa-dur-in: 360ms;
	--sspa-dur-out: 200ms;
	--sspa-reveal: 260ms;
	--sspa-stagger: 30ms;
	--sspa-shift: 0px;
}

/* Fade: opacity only, no movement at all. */
.sspa-motion-fade {
	--sspa-ease: ease-out;
	--sspa-dur-in: 240ms;
	--sspa-dur-out: 160ms;
	--sspa-reveal: 1ms;
	--sspa-stagger: 0ms;
	--sspa-shift: 0px;
}

/* None: everything resolves instantly. */
.sspa-motion-none,
.sspa-motion-off {
	--sspa-dur-in: 1ms;
	--sspa-dur-out: 1ms;
	--sspa-reveal: 1ms;
	--sspa-stagger: 0ms;
	--sspa-shift: 0px;
}

/* Per-preset entrance shapes ------------------------------------------ */
.sspa-motion-zoom .sspa-popup__inner {
	transform: translate3d(0, 0, 0) scale(0.86);
}

.sspa-motion-spring .sspa-popup__inner {
	transform: translate3d(0, var(--sspa-shift), 0) scale(0.94);
	transition-timing-function: var(--sspa-ease);
}

.sspa-motion-spring.sspa-popup--open .sspa-popup__inner,
.sspa-motion-zoom.sspa-popup--open .sspa-popup__inner,
.sspa-motion-slide.sspa-popup--open .sspa-popup__inner,
.sspa-motion-fade.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0) scale(1);
}

/* Edge-aware slide: the card enters from whichever edge it lives on. */
.sspa-motion-slide.sspa-popup--right .sspa-popup__inner {
	transform: translate3d(var(--sspa-shift), 0, 0);
	opacity: 1;
}

.sspa-motion-slide.sspa-popup--right.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0);
}

.sspa-motion-slide.sspa-popup--top .sspa-popup__inner {
	transform: translate3d(0, calc(var(--sspa-shift) * -1), 0);
	opacity: 1;
}

.sspa-motion-slide.sspa-popup--bottom .sspa-popup__inner {
	transform: translate3d(0, var(--sspa-shift), 0);
	opacity: 1;
}

.sspa-motion-slide.sspa-popup--top.sspa-popup--open .sspa-popup__inner,
.sspa-motion-slide.sspa-popup--bottom.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0);
}

.sspa-popup {
	position: fixed;
	inset: 0;
	z-index: var(--sspa-z, 2147483000);
	isolation: isolate;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	padding-bottom: max(24px, env(safe-area-inset-bottom));
	font-family: var(--sspa-font);
	font-size: 16px;
	line-height: 1.6;
	color: #1f2a1c;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--sspa-dur-in) var(--sspa-ease), visibility var(--sspa-dur-in) var(--sspa-ease);
	-webkit-font-smoothing: antialiased;
}

.sspa-popup[hidden] {
	display: none !important;
}

/* Backdrop ------------------------------------------------------------- */
.sspa-popup::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(16, 26, 14, 0.62);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity var(--sspa-dur-in) var(--sspa-ease);
}

.sspa-popup--open::before {
	opacity: 1;
}

.sspa-popup.sspa-popup--open {
	opacity: 1;
	visibility: visible;
}

/* Card ----------------------------------------------------------------- */
.sspa-popup__inner {
	position: relative;
	width: 100%;
	max-width: var(--sspa-max-width);
	max-height: calc(100vh - 48px);
	max-height: calc(100dvh - 48px);
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border-radius: 14px;
	border-top: 5px solid var(--sspa-alert-color, var(--sspa-primary));
	box-shadow: 0 26px 60px -12px rgba(10, 20, 8, 0.45), 0 0 0 1px rgba(74, 146, 54, 0.14);
	overflow: hidden;
	opacity: 0;
	transform: translate3d(0, var(--sspa-shift), 0) scale(0.975);
	transform-origin: 50% 40%;
	transition:
		transform var(--sspa-dur-in) var(--sspa-ease),
		opacity var(--sspa-dur-in) var(--sspa-ease);
	will-change: transform, opacity;
	backface-visibility: hidden;
}

.sspa-popup--open .sspa-popup__inner {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

/* Drop the compositor hint once the entrance has finished. */
.sspa-popup--settled .sspa-popup__inner {
	will-change: auto;
}

/* Staggered content reveal ------------------------------------------- */
.sspa-popup__inner > .sspa-popup__head,
.sspa-popup__inner > .sspa-popup__media,
.sspa-popup__inner > .sspa-popup__body,
.sspa-popup__inner > .sspa-popup__footer {
	opacity: 0;
	transform: translate3d(0, calc(var(--sspa-shift) * 0.6), 0);
	transition:
		opacity var(--sspa-reveal) var(--sspa-ease),
		transform var(--sspa-reveal) var(--sspa-ease);
}

.sspa-popup--open .sspa-popup__head,
.sspa-popup--open .sspa-popup__media,
.sspa-popup--open .sspa-popup__body,
.sspa-popup--open .sspa-popup__footer {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

/* Cascade: badge → media → text → buttons → footer. */
.sspa-popup--open .sspa-popup__head {
	transition-delay: calc(var(--sspa-stagger) * 1);
}

.sspa-popup--open .sspa-popup__media {
	transition-delay: calc(var(--sspa-stagger) * 2);
}

.sspa-popup--open .sspa-popup__body {
	transition-delay: calc(var(--sspa-stagger) * 3);
}

.sspa-popup--open .sspa-popup__footer {
	transition-delay: calc(var(--sspa-stagger) * 4);
}

/* On the way out nothing waits its turn. */
.sspa-popup--closing .sspa-popup__head,
.sspa-popup--closing .sspa-popup__media,
.sspa-popup--closing .sspa-popup__body,
.sspa-popup--closing .sspa-popup__footer {
	transition-delay: 0ms;
}

/* Close button: fade with the card, no travel. */
.sspa-popup__inner > .sspa-popup__close {
	opacity: 0;
	transition: opacity var(--sspa-dur-in) var(--sspa-ease), background 0.15s ease, color 0.15s ease, transform 0.2s var(--sspa-ease);
}

.sspa-popup--open .sspa-popup__inner > .sspa-popup__close {
	opacity: 1;
	transition-delay: calc(var(--sspa-stagger) * 2);
}

/* Accent line stays put while the card animates around it. */
.sspa-popup__inner > .sspa-popup__bar {
	opacity: 1;
	transform: none;
}

.sspa-popup__bar {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--sspa-primary), var(--sspa-accent));
}

/* Close button --------------------------------------------------------- */
.sspa-popup__close {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.88);
	color: #33402f;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.sspa-popup__close:hover,
.sspa-popup__close:focus-visible {
	background: var(--sspa-primary);
	color: #ffffff;
	transform: rotate(90deg);
}

.sspa-popup__close:focus-visible {
	outline: 2px solid var(--sspa-accent);
	outline-offset: 2px;
}

/* Header / badge ------------------------------------------------------- */
.sspa-popup__head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 20px 56px 0 24px;
	flex-wrap: wrap;
}

.sspa-popup__badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 999px;
	background: #f2f7ef;
	background: color-mix(in srgb, var(--sspa-alert-color, var(--sspa-primary)) 12%, #ffffff);
	color: var(--sspa-alert-color, var(--sspa-primary));
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.sspa-popup__badge::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

.sspa-motion-full .sspa-popup--cat-emergency.sspa-popup--open .sspa-popup__badge::before {
	animation: sspa-beacon 2.4s ease-in-out 600ms 3;
}

@keyframes sspa-beacon {
	0%,
	100% {
		box-shadow: 0 0 0 0 currentColor;
		opacity: 1;
	}
	50% {
		box-shadow: 0 0 0 4px transparent;
		opacity: 0.65;
	}
}

.sspa-popup__urgent {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: #c0392b;
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Media ---------------------------------------------------------------- */
.sspa-popup__media {
	margin: 16px 24px 0;
	border-radius: 10px;
	overflow: hidden;
	background: #f4f7f2;
	max-height: 220px;
}

.sspa-popup__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 220px;
	object-fit: cover;
}

/* Body ----------------------------------------------------------------- */
.sspa-popup__body {
	padding: 16px 24px 4px;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.sspa-popup__title {
	margin: 10px 0 8px;
	font-family: var(--sspa-font);
	font-size: 22px;
	line-height: 1.28;
	font-weight: 700;
	color: #1c2a18;
}

.sspa-popup__content {
	color: #33402f;
	font-size: 15.5px;
}

.sspa-popup__content > *:first-child {
	margin-top: 0;
}

.sspa-popup__content > *:last-child {
	margin-bottom: 0;
}

.sspa-popup__content p {
	margin: 0 0 0.85em;
}

.sspa-popup__content h1,
.sspa-popup__content h2,
.sspa-popup__content h3,
.sspa-popup__content h4 {
	margin: 0 0 0.5em;
	font-size: 17px;
	line-height: 1.35;
	color: #1c2a18;
}

.sspa-popup__content ul,
.sspa-popup__content ol {
	margin: 0 0 0.85em;
	padding-left: 1.25em;
}

.sspa-popup__content li {
	margin-bottom: 0.35em;
}

.sspa-popup__content a {
	color: var(--sspa-primary);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 0.15s ease, text-underline-offset 0.15s ease;
}

.sspa-popup__content a:hover {
	text-underline-offset: 5px;
}

.sspa-popup__content a:hover {
	color: #3a742a;
}

.sspa-popup__content blockquote {
	margin: 0 0 0.85em;
	padding: 10px 14px;
	border-left: 3px solid var(--sspa-accent);
	background: #fbf8f1;
	color: #4a5545;
}

.sspa-popup__content img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

/* PDF link ------------------------------------------------------------- */
.sspa-popup__pdf {
	margin: 14px 0 0;
}

.sspa-popup__pdf a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	width: 100%;
	box-sizing: border-box;
	border: 1px dashed rgba(74, 146, 54, 0.4);
	border-radius: 10px;
	background: #f5f9f3;
	color: #2c4426;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s var(--sspa-ease);
}

.sspa-popup__pdf a:hover,
.sspa-popup__pdf a:focus-visible {
	background: #ecf5e8;
	border-color: var(--sspa-primary);
	transform: translateY(-1px);
}

.sspa-popup__pdf a:active {
	transform: translateY(0) scale(0.99);
}

.sspa-popup__pdf svg {
	color: var(--sspa-primary);
	flex: 0 0 auto;
}

.sspa-popup__pdf-tag {
	margin-left: auto;
	padding: 2px 8px;
	border-radius: 5px;
	background: var(--sspa-accent);
	color: #3b2f10;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

/* Actions -------------------------------------------------------------- */
.sspa-popup__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 18px 0 0;
}

.sspa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	max-width: 100%;
	min-height: 44px;
	padding: 0 22px;
	border: 0;
	border-radius: 9px;
	font-family: var(--sspa-font);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	text-decoration: none;
	transition: transform 0.18s var(--sspa-ease), box-shadow 0.18s var(--sspa-ease), background 0.18s ease;
	will-change: transform;
}

.sspa-btn--primary {
	background: var(--sspa-primary);
	color: #ffffff;
	box-shadow: 0 8px 18px -8px rgba(74, 146, 54, 0.85);
}

.sspa-btn--primary:hover,
.sspa-btn--primary:focus-visible {
	background: #3f7f2d;
	color: #ffffff;
	transform: translateY(-1px);
}

.sspa-btn--ghost {
	background: transparent;
	color: #55614f;
	border: 1px solid #d8dfd3;
}

.sspa-btn--ghost:hover,
.sspa-btn--ghost:focus-visible {
	background: #f2f5ef;
	color: #33402f;
	transform: translateY(-1px);
}

.sspa-btn:active {
	transform: translateY(0) scale(0.985);
	transition-duration: 90ms;
}

.sspa-btn:focus-visible {
	outline: 2px solid var(--sspa-accent);
	outline-offset: 2px;
}

/* Footer --------------------------------------------------------------- */
.sspa-popup__footer {
	margin-top: 16px;
	padding: 12px 24px;
	border-top: 1px solid #edf0ea;
	background: #fafbf8;
	color: #7b8676;
	font-size: 12.5px;
	letter-spacing: 0.02em;
}

.sspa-popup__dot {
	margin: 0 4px;
}

/* Scroll lock ---------------------------------------------------------- */
html.sspa-locked,
html.sspa-locked body {
	overflow: hidden !important;
	overscroll-behavior: none;
}

html.sspa-locked body {
	padding-right: var(--sspa-scrollbar, 0px);
}

/* WordPress admin bar ------------------------------------------------ */
body.admin-bar .sspa-popup--banner {
	top: 32px;
}

body.admin-bar .sspa-popup--top {
	padding-top: calc(32px + 12px);
}

@media screen and (max-width: 782px) {
	body.admin-bar .sspa-popup--banner {
		top: 46px;
	}

	body.admin-bar .sspa-popup--top {
		padding-top: calc(46px + 10px);
	}
}

/* Positions ------------------------------------------------------------ */
.sspa-popup--top {
	align-items: flex-start;
	justify-content: center;
}

.sspa-popup--top .sspa-popup__inner {
	transform: translate3d(0, calc(var(--sspa-shift) * -2), 0) scale(0.99);
	transform-origin: 50% 0%;
	border-top-width: 0;
	border-top: 1px solid rgba(74, 146, 54, 0.12);
	border-bottom: 5px solid var(--sspa-alert-color, var(--sspa-primary));
	box-shadow: 0 30px 60px -22px rgba(10, 20, 8, 0.5), 0 0 0 1px rgba(74, 146, 54, 0.12);
}

.sspa-popup--top .sspa-popup__bar {
	top: auto;
	bottom: 0;
}

.sspa-popup--top .sspa-popup__close {
	top: 12px;
}

.sspa-popup--top.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0) scale(1);
}

.sspa-popup--bottom {
	align-items: flex-end;
}

.sspa-popup--bottom .sspa-popup__inner {
	border-radius: 16px 16px 0 0;
	transform: translate3d(0, calc(var(--sspa-shift) * 2.2), 0);
	transform-origin: 50% 100%;
	max-height: 82vh;
	max-height: 82dvh;
}

.sspa-popup--right {
	align-items: flex-end;
	justify-content: flex-end;
}

.sspa-popup--right .sspa-popup__inner {
	max-width: 380px;
	border-radius: 14px;
	transform: translate3d(calc(var(--sspa-shift) * 1.8), 0, 0);
	transform-origin: 100% 100%;
	max-height: 80vh;
	max-height: 80dvh;
}

/* Reset the positional entrance offsets once settled — without these the
   card stays offset by its entry distance (it visibly bled off-screen). */
.sspa-popup--right.sspa-popup--open .sspa-popup__inner,
.sspa-popup--bottom.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0) scale(1);
}

.sspa-popup--right .sspa-popup__title {
	font-size: 19px;
}

/* Banner style --------------------------------------------------------- */
.sspa-popup--banner {
	align-items: flex-start;
	inset: 0 0 auto 0;
	padding: 0;
}

.sspa-popup--banner::before {
	background: transparent;
	backdrop-filter: none;
}

.sspa-popup--banner .sspa-popup__inner {
	max-width: none;
	border-radius: 0;
	border-top-width: 0;
	border-bottom: 3px solid var(--sspa-alert-color, var(--sspa-primary));
	box-shadow: 0 12px 28px -14px rgba(10, 20, 8, 0.5);
	transform: translate3d(0, -100%, 0);
	transform-origin: 50% 0%;
	max-height: 70vh;
	max-height: 70dvh;
	opacity: 1;
}

.sspa-popup--banner.sspa-popup--open .sspa-popup__inner {
	transform: translate3d(0, 0, 0);
}

/* The banner slides out of view rather than fading in place. */
.sspa-popup--banner.sspa-popup--closing .sspa-popup__inner {
	opacity: 1;
	transform: translate3d(0, -100%, 0);
	transition: transform var(--sspa-dur-out) var(--sspa-ease-in);
}

.sspa-popup--banner .sspa-popup__head {
	padding-top: 16px;
}

.sspa-popup--banner .sspa-popup__content {
	max-width: 900px;
}

/* Inline shortcode rendering ------------------------------------------ */
.sspa-popup--inline {
	position: static;
	inset: auto;
	display: block;
	opacity: 1;
	visibility: visible;
	padding: 0;
	z-index: auto;
}

.sspa-popup--inline::before,
.sspa-popup--inline .sspa-popup__close {
	display: none;
}

.sspa-popup--inline .sspa-popup__inner {
	max-width: 100%;
	max-height: none;
	opacity: 1;
	transform: none;
	box-shadow: 0 10px 26px -18px rgba(10, 20, 8, 0.5);
}

.sspa-popup--inline .sspa-popup__inner > * {
	opacity: 1;
	transform: none;
}

/* Sticky trigger reopens the queue ------------------------------------ */
.sspa-reopen {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 999998;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--sspa-primary, #4a9236);
	color: #ffffff;
	font-family: var(--sspa-font, sans-serif);
	font-size: 13px;
	font-weight: 700;
	box-shadow: 0 12px 26px -12px rgba(16, 26, 14, 0.7);
	cursor: pointer;
}

/* Mobile --------------------------------------------------------------- */
@media (max-width: 600px) {
	.sspa-popup {
		padding: 12px;
		align-items: flex-end;
	}

	.sspa-popup {
		padding-bottom: max(12px, env(safe-area-inset-bottom));
	}

	/* A full-width banner must stay edge to edge on phones. */
	.sspa-popup--banner {
		padding: 0;
		align-items: flex-start;
	}

	/* Top-positioned alerts stay at the top on phones so they are never
	   pushed below the fold by a long message. */
	.sspa-popup--top {
		align-items: flex-start;
		padding-top: max(12px, env(safe-area-inset-top));
	}

	.sspa-popup--top .sspa-popup__inner {
		border-radius: 8px 8px 14px 14px;
	}

	.sspa-popup__inner {
		max-height: 88vh;
		max-height: 88dvh;
		border-radius: 14px 14px 8px 8px;
	}

	.sspa-popup__head {
		padding: 16px 52px 0 18px;
	}

	.sspa-popup__body {
		padding: 12px 18px 4px;
	}

	.sspa-popup__media {
		margin: 12px 18px 0;
		max-height: 160px;
	}

	.sspa-popup__title {
		font-size: 19px;
	}

	.sspa-popup__content {
		font-size: 15px;
	}

	.sspa-popup__actions {
		flex-direction: column;
	}

	.sspa-btn {
		width: 100%;
	}

	.sspa-popup__footer {
		padding: 10px 18px;
		font-size: 11.5px;
	}

	.sspa-popup--right .sspa-popup__inner {
		max-width: none;
	}

	.sspa-popup--banner .sspa-popup__content {
		max-height: 45vh;
		overflow-y: auto;
	}
}

/* Compact mode: bottom sheet on phones --------------------------------- */
@media (max-width: 600px) {
	.sspa-popup--compact .sspa-popup__inner {
		max-height: 76vh;
		max-height: 76dvh;
	}

	.sspa-popup--compact .sspa-popup__media {
		display: none;
	}

	.sspa-popup--compact .sspa-popup__footer {
		display: none;
	}

	.sspa-popup--compact .sspa-popup__title {
		font-size: 17.5px;
	}
}


/* =====================================================================
   Compact card — a small, stylish alert that never takes over the page.
   The overlay itself is click-through; only the card receives pointers,
   so the visitor can keep reading and scrolling behind it.
   ===================================================================== */
.sspa-popup--card {
	pointer-events: none;
	align-items: flex-end;
	justify-content: flex-end;
	padding: 20px;
	padding-bottom: max(20px, env(safe-area-inset-bottom));
}

.sspa-popup--card .sspa-popup__inner {
	pointer-events: auto;
	width: min(var(--sspa-card-width, 380px), calc(100vw - 40px));
	max-width: var(--sspa-card-width, 380px);
	max-height: min(72dvh, 560px);
	border-radius: 16px;
	border-top-width: 0;
	border-left: 4px solid var(--sspa-alert-color, var(--sspa-primary));
	background: #ffffff;
	box-shadow:
		0 2px 3px -1px rgba(16, 26, 14, 0.08),
		0 22px 48px -18px rgba(16, 26, 14, 0.36),
		0 0 0 1px rgba(74, 146, 54, 0.09);
}

/* Soft accent wash in the corner instead of a heavy coloured bar. */
.sspa-popup--card .sspa-popup__inner::after {
	content: "";
	position: absolute;
	top: -40px;
	right: -30px;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(74, 146, 54, 0.12) 0%, rgba(74, 146, 54, 0) 70%);
	background: radial-gradient(circle, color-mix(in srgb, var(--sspa-alert-color, var(--sspa-primary)) 13%, transparent) 0%, transparent 70%);
	pointer-events: none;
}

.sspa-popup--card .sspa-popup__bar {
	display: none;
}

/* Placement variants stay compact. */
.sspa-popup--card.sspa-popup--center {
	align-items: center;
	justify-content: center;
}

.sspa-popup--card.sspa-popup--top {
	align-items: flex-start;
	justify-content: flex-end;
}

.sspa-popup--card.sspa-popup--bottom {
	align-items: flex-end;
	justify-content: center;
}

.sspa-popup--card.sspa-popup--bottom .sspa-popup__inner {
	border-radius: 16px;
	border-left-width: 4px;
	border-top-width: 0;
}

/* Compact typography and spacing. */
.sspa-popup--card .sspa-popup__head {
	padding: 16px 52px 0 18px;
}

.sspa-popup--card .sspa-popup__badge {
	padding: 4px 10px;
	font-size: 10.5px;
	letter-spacing: 0.07em;
}

.sspa-popup--card .sspa-popup__urgent {
	padding: 3px 8px;
	font-size: 10px;
}

.sspa-popup--card .sspa-popup__body {
	padding: 10px 18px 2px;
}

.sspa-popup--card .sspa-popup__title {
	margin: 8px 0 6px;
	font-size: 16.5px;
	line-height: 1.32;
	font-weight: 700;
	letter-spacing: -0.005em;
}

.sspa-popup--card .sspa-popup__content {
	font-size: 13.8px;
	line-height: 1.58;
	color: #4a5545;
}

.sspa-popup--card .sspa-popup__content p {
	margin-bottom: 0.6em;
}

.sspa-popup--card .sspa-popup__media {
	margin: 12px 18px 0;
	max-height: 130px;
	border-radius: 10px;
}

.sspa-popup--card .sspa-popup__media img {
	max-height: 130px;
}

.sspa-popup--card .sspa-popup__close {
	top: 10px;
	right: 10px;
	width: 30px;
	height: 30px;
	background: transparent;
	color: #8b9686;
}

.sspa-popup--card .sspa-popup__close:hover,
.sspa-popup--card .sspa-popup__close:focus-visible {
	background: #f2f6ef;
	color: var(--sspa-alert-color, var(--sspa-primary));
	transform: none;
}

.sspa-popup--card .sspa-popup__actions {
	margin: 14px 0 0;
	gap: 8px;
}

.sspa-popup--card .sspa-btn {
	min-height: 38px;
	padding: 0 16px;
	border-radius: 8px;
	font-size: 13.5px;
}

.sspa-popup--card .sspa-popup__pdf {
	margin-top: 12px;
}

.sspa-popup--card .sspa-popup__pdf a {
	padding: 8px 11px;
	font-size: 12.8px;
	border-radius: 8px;
}

.sspa-popup--card .sspa-popup__footer {
	margin-top: 10px;
	padding: 8px 18px;
	font-size: 11.5px;
	background: #fbfcfa;
}

.sspa-popup--card .sspa-popup__body {
	padding-bottom: 14px;
}

/* Clamped preview with a soft fade-out ------------------------------- */
.sspa-popup__content--clamp {
	display: -webkit-box;
	-webkit-line-clamp: var(--sspa-lines, 3);
	-webkit-box-orient: vertical;
	overflow: hidden;
	position: relative;
}

.sspa-popup__content--clamp::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1.6em;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #ffffff 85%);
	pointer-events: none;
}

.sspa-popup--expanded .sspa-popup__content--clamp {
	display: block;
	-webkit-line-clamp: unset;
	overflow: visible;
}

.sspa-popup--expanded .sspa-popup__content--clamp::after {
	display: none;
}

/* Read more ---------------------------------------------------------- */
.sspa-popup__more {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin: 6px 0 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--sspa-primary);
	font-family: var(--sspa-font);
	font-size: 12.8px;
	font-weight: 700;
	letter-spacing: 0.01em;
	cursor: pointer;
	transition: color 0.15s ease, gap 0.18s var(--sspa-ease);
}

.sspa-popup__more:hover,
.sspa-popup__more:focus-visible {
	color: #356b26;
	gap: 8px;
}

.sspa-popup__more svg {
	transition: transform 0.24s var(--sspa-ease);
}

.sspa-popup--expanded .sspa-popup__more svg {
	transform: rotate(180deg);
}

.sspa-popup__more[hidden] {
	display: none;
}

/* Backdrop variants --------------------------------------------------- */
.sspa-popup--bd-none::before {
	display: none;
}

.sspa-popup--bd-soft::before {
	background: radial-gradient(120% 90% at 50% 50%, rgba(16, 26, 14, 0.20) 0%, rgba(16, 26, 14, 0.42) 100%);
	-webkit-backdrop-filter: blur(1.5px);
	backdrop-filter: blur(1.5px);
}

.sspa-popup--card.sspa-popup--bd-soft::before {
	background: radial-gradient(120% 100% at 100% 100%, rgba(16, 26, 14, 0.22) 0%, rgba(16, 26, 14, 0) 72%);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.sspa-popup--card.sspa-popup--bd-dim::before {
	background: rgba(16, 26, 14, 0.55);
}

/* Phones: still small, but edge to edge and thumb reachable. */
@media (max-width: 600px) {
	.sspa-popup--card {
		padding: 10px;
		padding-bottom: max(10px, env(safe-area-inset-bottom));
		align-items: flex-end;
		justify-content: center;
	}

	.sspa-popup--card.sspa-popup--top {
		align-items: flex-start;
		justify-content: center;
	}

	.sspa-popup--card .sspa-popup__inner {
		width: 100%;
		max-width: 100%;
		max-height: 66dvh;
		border-radius: 14px;
	}

	.sspa-popup--card .sspa-popup__title {
		font-size: 15.5px;
	}

	.sspa-popup--card .sspa-popup__content {
		font-size: 13.5px;
	}

	.sspa-popup--card .sspa-popup__actions {
		flex-direction: row;
		flex-wrap: wrap;
	}

	.sspa-popup--card .sspa-btn {
		width: auto;
		flex: 1 1 auto;
	}
}

/* Exit transitions ----------------------------------------------------- */
/* Exits ease IN: the content stays legible for the first frames, then leaves.
   Using the entrance curve here made the fade collapse almost instantly. */
.sspa-popup--closing {
	opacity: 0;
	transition-duration: var(--sspa-dur-out);
	transition-timing-function: var(--sspa-ease-in);
	pointer-events: none;
}

.sspa-popup--closing::before {
	opacity: 0;
	transition-duration: var(--sspa-dur-out);
	transition-timing-function: var(--sspa-ease-in);
}

.sspa-popup--closing .sspa-popup__inner {
	opacity: 0;
	transform: translate3d(0, calc(var(--sspa-shift) * 0.5), 0) scale(0.985);
	transition-duration: var(--sspa-dur-out);
	transition-timing-function: var(--sspa-ease-in);
}

.sspa-popup--top.sspa-popup--closing .sspa-popup__inner {
	transform: translate3d(0, calc(var(--sspa-shift) * -1), 0) scale(0.99);
}

.sspa-popup--bottom.sspa-popup--closing .sspa-popup__inner {
	transform: translate3d(0, calc(var(--sspa-shift) * 1.4), 0);
}

.sspa-popup--right.sspa-popup--closing .sspa-popup__inner {
	transform: translate3d(calc(var(--sspa-shift) * 1.2), 0, 0);
}

/* Entrance sheen on the accent bar ------------------------------------ */
.sspa-popup__bar {
	overflow: hidden;
}

.sspa-popup__bar::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.85) 45%, rgba(255, 255, 255, 0) 100%);
	transform: translate3d(-100%, 0, 0);
	opacity: 0;
}

.sspa-motion-full .sspa-popup--open .sspa-popup__bar::after {
	animation: sspa-sheen 1150ms var(--sspa-ease) 300ms 1 both;
}

@keyframes sspa-sheen {
	0% {
		transform: translate3d(-100%, 0, 0);
		opacity: 0;
	}
	25% {
		opacity: 0.9;
	}
	100% {
		transform: translate3d(100%, 0, 0);
		opacity: 0;
	}
}

/* Urgent attention pulse ---------------------------------------------- */
@keyframes sspa-attention {
	0% {
		box-shadow: 0 0 0 0 rgba(212, 174, 103, 0.45), 0 26px 60px -12px rgba(10, 20, 8, 0.45);
	}
	60% {
		box-shadow: 0 0 0 12px rgba(212, 174, 103, 0), 0 26px 60px -12px rgba(10, 20, 8, 0.45);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(212, 174, 103, 0), 0 26px 60px -12px rgba(10, 20, 8, 0.45);
	}
}

.sspa-motion-full .sspa-popup--attention.sspa-popup--open .sspa-popup__inner {
	animation: sspa-attention 1.5s var(--sspa-ease) 420ms 2;
}

/* Reduced motion ------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.sspa-root,
	.sspa-motion-full,
	.sspa-motion-subtle {
		--sspa-dur-in: 1ms;
		--sspa-dur-out: 1ms;
		--sspa-reveal: 1ms;
		--sspa-stagger: 0ms;
		--sspa-shift: 0px;
	}

	.sspa-popup,
	.sspa-popup::before,
	.sspa-popup__inner,
	.sspa-popup__inner > *,
	.sspa-btn,
	.sspa-popup__close,
	.sspa-popup__pdf a,
	.sspa-popup__content a {
		transition-duration: 1ms !important;
		transition-delay: 0ms !important;
		animation: none !important;
		transform: none !important;
	}

	.sspa-popup--banner .sspa-popup__inner {
		transform: none !important;
	}

	.sspa-popup--attention.sspa-popup--open .sspa-popup__inner,
	.sspa-popup--open .sspa-popup__bar::after,
	.sspa-popup--open .sspa-popup__badge::before {
		animation: none !important;
	}
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}