.lww-widget {
	--lww-accent: #25d366;
	--lww-accent-dark: #1ebe57;
	--lww-size: 60px;
	--lww-gap: 24px;
	position: fixed;
	z-index: 9999;
	bottom: calc(var(--lww-gap) + env(safe-area-inset-bottom, 0px));
	right: calc(var(--lww-gap) + env(safe-area-inset-right, 0px));
	left: auto;
}

.lww-widget[data-position="left"] {
	right: auto;
	left: calc(var(--lww-gap) + env(safe-area-inset-left, 0px));
}

.lww-btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--lww-size);
	height: var(--lww-size);
	border-radius: 50%;
	background: var(--lww-accent);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
	text-decoration: none;
	transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.lww-btn:hover,
.lww-btn:focus-visible {
	background: var(--lww-accent-dark);
	transform: scale(1.06);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}

.lww-btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.lww-btn svg {
	width: 55%;
	height: 55%;
	fill: #fff;
}

/* Bulle "Discutez avec nous" au survol (desktop uniquement, cf. media query plus bas) */
.lww-tooltip {
	position: absolute;
	right: calc(100% + 12px);
	top: 50%;
	transform: translateY(-50%);
	background: #1a1a1a;
	color: #fff;
	padding: 0.5rem 0.85rem;
	border-radius: 8px;
	font-family: inherit;
	font-size: 0.85rem;
	line-height: 1.3;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.15s ease;
}

.lww-widget[data-position="left"] .lww-tooltip {
	right: auto;
	left: calc(100% + 12px);
}

.lww-btn:hover .lww-tooltip,
.lww-btn:focus-visible .lww-tooltip {
	opacity: 1;
}

/* Léger halo pulsé pour attirer l'œil ; retiré au premier clic/survol via script.js
   et désactivé pour les utilisateurs qui préfèrent moins d'animations. */
.lww-pulse::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.55);
	animation: lww-pulse 2.4s ease-out infinite;
	pointer-events: none;
}

@keyframes lww-pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.55);
	}
	70% {
		box-shadow: 0 0 0 16px rgba(37, 211, 102, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.lww-btn,
	.lww-tooltip,
	.lww-pulse::after {
		animation: none !important;
		transition: none !important;
	}
}

/* Tablette */
@media (max-width: 1024px) {
	.lww-widget {
		--lww-size: 56px;
		--lww-gap: 20px;
	}
}

/* Mobile : bouton plus petit, tooltip masquée (pas d'usage au doigt) */
@media (max-width: 600px) {
	.lww-widget {
		--lww-size: 52px;
		--lww-gap: 16px;
	}

	.lww-tooltip {
		display: none;
	}
}

/* Très petits écrans */
@media (max-width: 380px) {
	.lww-widget {
		--lww-size: 48px;
		--lww-gap: 12px;
	}
}