/* FillKite popups: a native <dialog>, so focus stays inside and Esc closes it. */
.fkc-popup {
	width: min(100% - 32px, var(--fkc-popup-width, 560px));
	max-height: calc(100vh - 48px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--fkc-radius-lg);
	background: var(--fkc-bg);
	color: var(--fkc-text);
	box-shadow: var(--fkc-shadow-lg);
	overflow: auto;
}
.fkc-popup::backdrop { background: rgba(27, 42, 65, .55); }
.fkc-popup__box { position: relative; }
.fkc-popup .fkc-popup__close,
.fkc-popup .fkc-popup__close:focus {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--fkc-border);
	border-radius: 50%;
	background: var(--fkc-bg);
	color: var(--fkc-text);
	cursor: pointer;
}
.fkc-popup .fkc-popup__close:hover { border-color: var(--fkc-primary); color: var(--fkc-primary-strong); }
.fkc-popup__close svg { width: 18px; height: 18px; }
[dir="rtl"] .fkc-popup__close { right: auto; left: 12px; }

@media (prefers-reduced-motion: no-preference) {
	.fkc-popup[open] { animation: fkc-popup-in .25s cubic-bezier(.2, .8, .2, 1); }
	.fkc-popup[open]::backdrop { animation: fkc-fade-in .25s ease; }
}
@keyframes fkc-popup-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }
@keyframes fkc-fade-in { from { opacity: 0; } }