/**
 * Floating chat frontend — scoped under .uwc-floating
 * Avoids Elementor/theme collisions via unique prefix and CSS variables.
 */

.uwc-floating {
	--uwc-floating-gap: 12px;
	--uwc-floating-edge: 20px;
	pointer-events: none;
}

.uwc-floating__group {
	position: fixed;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	gap: var(--uwc-floating-gap);
	pointer-events: none;
}

.uwc-floating__group--bottom-left {
	left: var(--uwc-floating-edge);
	bottom: var(--uwc-floating-edge);
	align-items: flex-start;
}

.uwc-floating__group--bottom-right {
	right: var(--uwc-floating-edge);
	bottom: var(--uwc-floating-edge);
	align-items: flex-end;
}

.uwc-floating__group--top-left {
	left: var(--uwc-floating-edge);
	top: var(--uwc-floating-edge);
	align-items: flex-start;
}

.uwc-floating__group--top-right {
	right: var(--uwc-floating-edge);
	top: var(--uwc-floating-edge);
	align-items: flex-end;
}

.uwc-floating__group--middle-left {
	left: var(--uwc-floating-edge);
	top: 50%;
	transform: translateY(-50%);
	align-items: flex-start;
}

.uwc-floating__group--middle-right {
	right: var(--uwc-floating-edge);
	top: 50%;
	transform: translateY(-50%);
	align-items: flex-end;
}

.uwc-floating__btn {
	pointer-events: auto;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--uwc-floating-bg, #25D366);
	color: #fff;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	line-height: 0;
	border: 0;
	outline: none;
}

.uwc-floating__btn:hover,
.uwc-floating__btn:focus-visible {
	transform: scale(1.06);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22);
	color: #fff;
	text-decoration: none;
}

.uwc-floating__btn--small {
	width: 44px;
	height: 44px;
}

.uwc-floating__btn--medium {
	width: 56px;
	height: 56px;
}

.uwc-floating__btn--large {
	width: 68px;
	height: 68px;
}

.uwc-floating__icon {
	display: flex;
	width: 55%;
	height: 55%;
}

.uwc-floating__icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

.uwc-floating__tooltip {
	position: absolute;
	white-space: nowrap;
	background: #1d2327;
	color: #fff;
	font-size: 12px;
	font-family: Tahoma, "Segoe UI", sans-serif;
	padding: 6px 10px;
	border-radius: 4px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
	pointer-events: none;
	z-index: 2;
}

.uwc-floating__group--bottom-left .uwc-floating__tooltip,
.uwc-floating__group--top-left .uwc-floating__tooltip,
.uwc-floating__group--middle-left .uwc-floating__tooltip {
	left: calc(100% + 10px);
}

.uwc-floating__group--bottom-right .uwc-floating__tooltip,
.uwc-floating__group--top-right .uwc-floating__tooltip,
.uwc-floating__group--middle-right .uwc-floating__tooltip {
	right: calc(100% + 10px);
}

.uwc-floating__btn:hover .uwc-floating__tooltip,
.uwc-floating__btn:focus-visible .uwc-floating__tooltip {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Device visibility */
.uwc-floating__btn--mobile:not(.uwc-floating__btn--desktop) {
	display: none;
}

.uwc-floating__btn--desktop:not(.uwc-floating__btn--mobile) {
	display: inline-flex;
}

@media (max-width: 782px) {
	.uwc-floating__btn--mobile:not(.uwc-floating__btn--desktop) {
		display: inline-flex;
	}

	.uwc-floating__btn--desktop:not(.uwc-floating__btn--mobile) {
		display: none;
	}

	.uwc-floating__btn--mobile.uwc-floating__btn--desktop {
		display: inline-flex;
	}
}

@media (min-width: 783px) {
	.uwc-floating__btn--mobile.uwc-floating__btn--desktop {
		display: inline-flex;
	}
}

/* Animations */
@keyframes uwc-floating-pulse {
	0% { box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.25); }
	70% { box-shadow: 0 0 0 12px rgba(0, 0, 0, 0); }
	100% { box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
}

@keyframes uwc-floating-bounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-6px); }
}

@keyframes uwc-floating-shake {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-3px); }
	75% { transform: translateX(3px); }
}

@keyframes uwc-floating-fade {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.55; }
}

.uwc-floating__anim--pulse {
	animation: uwc-floating-pulse 2s infinite;
}

.uwc-floating__anim--bounce {
	animation: uwc-floating-bounce 1.4s infinite;
}

.uwc-floating__anim--shake {
	animation: uwc-floating-shake 1.6s infinite;
}

.uwc-floating__anim--fade {
	animation: uwc-floating-fade 2s infinite;
}

.uwc-floating__anim--none {
	animation: none;
}

@media (prefers-reduced-motion: reduce) {
	.uwc-floating__btn {
		animation: none !important;
		transition: none;
	}
}