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

.kld-popup-root {
	--kld-popup-theme-primary: var(--kld-color-primary, var(--wp--preset--color--primary, #315b50));
	--kld-popup-theme-secondary: var(--kld-color-secondary, var(--wp--preset--color--secondary, #263225));
	--kld-popup-theme-accent: var(--kld-color-accent, var(--wp--preset--color--accent, #d3a349));
	--kld-popup-theme-background: var(--kld-color-background, var(--wp--preset--color--base, #fff));
	--kld-popup-theme-text: var(--kld-color-text, var(--wp--preset--color--contrast, #263225));
	position: fixed;
	inset: 0;
	z-index: 999990;
	display: grid;
	place-items: center;
	padding: clamp(12px, 3vw, 32px);
	box-sizing: border-box;
}

.kld-popup-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(20, 24, 18, .64);
}

.kld-popup-dialog {
	position: relative;
	max-width: min(100%, 760px);
	max-height: calc(100vh - 24px);
	max-height: calc(100dvh - 24px);
	overflow: auto;
	outline: none;
}

.kld-popup-content {
	max-width: 100%;
}

.kld-popup-close {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 2;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: var(--kld-popup-theme-background);
	color: var(--kld-popup-theme-text);
	font: 700 24px/1 sans-serif;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}

.kld-popup-close:focus-visible {
	outline: 3px solid var(--kld-popup-theme-primary, var(--kld-popup-theme-accent));
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.kld-popup-root,
	.kld-popup-backdrop {
		animation: none !important;
		transition: none !important;
	}
}
