/* The "live demos" card: bottom right, white, with a green live dot. A small pill on phones. */
.fkc-demo-tab {
	position: fixed;
	z-index: 99980;
	right: 20px;
	bottom: 20px;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px 11px 14px;
	border: 1px solid var(--fkc-border-strong);
	border-radius: 14px;
	background: #fff;
	color: var(--fkc-text);
	font-family: var(--fkc-font);
	line-height: 1.25;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(27, 42, 65, .14);
	transition: transform .15s, box-shadow .15s, border-color .15s;
}
.fkc-demo-tab__dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #22A06B; box-shadow: 0 0 0 4px #DDF3E8; }
.fkc-demo-tab__text { display: flex; flex-direction: column; }
.fkc-demo-tab__text strong { font-size: .9375rem; font-weight: 700; }
.fkc-demo-tab__text small { font-size: .8125rem; color: var(--fkc-muted); }
.fkc-demo-tab__short { display: none; }
.fkc-demo-tab__arrow { flex: none; color: var(--fkc-primary); transition: transform .15s; }
.fkc-demo-tab:hover,
.fkc-demo-tab:focus-visible {
	color: var(--fkc-text);
	border-color: var(--fkc-primary);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(27, 42, 65, .2);
}
.fkc-demo-tab:hover .fkc-demo-tab__arrow,
.fkc-demo-tab:focus-visible .fkc-demo-tab__arrow { transform: translateX(3px); }
.fkc-demo-tab:focus-visible { outline: 3px solid var(--fkc-primary); outline-offset: 3px; }
/* On a phone: a small pill, "135 demos". The cookie banner fills the bottom, so the pill waits until it is answered. */
@media (max-width: 700px) {
	.fkc-demo-tab { right: 12px; bottom: 12px; gap: 8px; padding: 9px 12px; border-radius: 999px; }
	.fkc-demo-tab__title,
	.fkc-demo-tab__text small { display: none; }
	.fkc-demo-tab__short { display: block; font-size: .875rem !important; }
	.fkc-demo-tab__dot { box-shadow: 0 0 0 3px #DDF3E8; }
	.fkc-consent:not([hidden]) ~ .fkc-demo-tab { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.fkc-demo-tab, .fkc-demo-tab__arrow { transition: none; }
	.fkc-demo-tab:hover,
	.fkc-demo-tab:focus-visible { transform: none; }
	.fkc-demo-tab:hover .fkc-demo-tab__arrow,
	.fkc-demo-tab:focus-visible .fkc-demo-tab__arrow { transform: none; }
}
@media print {
	.fkc-demo-tab { display: none; }
}