.klickkk-wac {
	position: fixed;
	bottom: 24px;
	z-index: 999999;
	display: flex;
	align-items: flex-end;
	gap: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.klickkk-wac--right {
	right: 24px;
	flex-direction: row;
}

.klickkk-wac--left {
	left: 24px;
	flex-direction: row-reverse;
}

.klickkk-wac__button {
	display: grid;
	width: var(--klickkk-size);
	height: var(--klickkk-size);
	min-width: var(--klickkk-size);
	max-width: var(--klickkk-size);
	min-height: var(--klickkk-size);
	max-height: var(--klickkk-size);
	flex: 0 0 var(--klickkk-size);
	place-items: center;
	background: #25d366;
	border-radius: 50%;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.22);
	transition: transform 0.2s, box-shadow 0.2s;
}

.klickkk-wac__button:hover {
	transform: translateY(-2px) scale(1.04);
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}

.klickkk-wac__button:focus-visible {
	outline: 3px solid #111;
	outline-offset: 3px;
}

.klickkk-wac__button svg {
	width: 56%;
	height: 56%;
	fill: #fff;
}

.klickkk-wac__greeting {
	position: relative;
	display: none;
	min-width: 190px;
	max-width: 260px;
	padding: 14px 34px 14px 16px;
	color: #17211b;
	line-height: 1.35;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 5px 24px rgba(0, 0, 0, 0.16);
}

.klickkk-wac__greeting.is-visible {
	display: flex;
	flex-direction: column;
	animation: klickkk-in 0.25s ease-out;
}

.klickkk-wac__greeting strong {
	font-size: 15px;
}

.klickkk-wac__greeting span {
	margin-top: 3px;
	color: #56615a;
	font-size: 13px;
}

.klickkk-wac__close {
	position: absolute;
	top: 5px;
	right: 7px;
	padding: 2px 5px;
	color: #6a726d;
	font-size: 20px;
	background: transparent;
	border: 0;
	cursor: pointer;
}

@keyframes klickkk-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (max-width: 767px) {
	.klickkk-wac--desktop-only {
		display: none;
	}

	.klickkk-wac {
		--klickkk-size: var(--klickkk-mobile-size, 44px) !important;

		bottom: var(--klickkk-mobile-bottom, 18px) !important;
	}

	.klickkk-wac--right {
		right: var(--klickkk-mobile-side, 18px) !important;
	}

	.klickkk-wac--left {
		left: var(--klickkk-mobile-side, 18px) !important;
	}

	.klickkk-wac__greeting {
		min-width: 160px;
		max-width: 210px;
	}

	.klickkk-wac--rtl-mobile .klickkk-wac__greeting {
		padding: 14px 16px 14px 34px;
		text-align: right;
		direction: rtl;
	}

	.klickkk-wac--rtl-mobile .klickkk-wac__close {
		right: auto;
		left: 7px;
	}
}

@media (min-width: 768px) {
	.klickkk-wac--mobile-only {
		display: none;
	}

	.klickkk-wac--rtl-desktop .klickkk-wac__greeting {
		padding: 14px 16px 14px 34px;
		text-align: right;
		direction: rtl;
	}

	.klickkk-wac--rtl-desktop .klickkk-wac__close {
		right: auto;
		left: 7px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.klickkk-wac__button,
	.klickkk-wac__greeting {
		animation: none;
		transition: none;
	}
}