/*
 * La Galga Gris · whatsapp-fab.css
 * FAB bottom-left con pulse. Se expande en hover desktop mostrando copy.
 */

.lgg-wa {
	position: fixed;
	left: var(--sp-4);
	bottom: var(--sp-4);
	z-index: calc(var(--z-toast) - 2);

	display: inline-flex;
	align-items: center;
	gap: var(--sp-3);
	padding: 0;

	background: #25D366;
	color: #FFFFFF;
	text-decoration: none;

	min-width: 56px;
	height: 56px;
	border-radius: var(--radius-pill);
	box-shadow: var(--shadow-lg);

	opacity: 0;
	transform: translateY(20px);
	pointer-events: none;
	transition: opacity var(--dur-slow) var(--ease-emphasized),
				transform var(--dur-slow) var(--ease-emphasized),
				padding-right var(--dur-base) var(--ease-emphasized),
				box-shadow var(--dur-fast) var(--ease-standard);
	overflow: hidden;
}
.lgg-wa[data-state="visible"] {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.lgg-wa:hover {
	box-shadow: 0 18px 40px rgba(37, 211, 102, 0.35);
	color: #FFFFFF;
	background: #128C7E;
}
@media (prefers-reduced-motion: reduce) {
	.lgg-wa { transition: none; }
}

.lgg-wa__pulse {
	position: absolute;
	top: 0; left: 0;
	width: 56px; height: 56px;
	border-radius: 50%;
	background: #25D366;
	opacity: 0.45;
	animation: lgg-wa-pulse 2.6s ease-out infinite;
}
@keyframes lgg-wa-pulse {
	0%   { transform: scale(0.85); opacity: 0.45; }
	70%  { transform: scale(1.4); opacity: 0; }
	100% { transform: scale(1.4); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.lgg-wa__pulse { animation: none; opacity: 0; }
}

.lgg-wa__icon {
	position: relative;
	flex: 0 0 auto;
	width: 56px; height: 56px;
	padding: 16px;
	box-sizing: border-box;
}

.lgg-wa__copy {
	display: none;
	flex-direction: column;
	line-height: 1.15;
	padding-right: var(--sp-5);
	max-width: 0;
	opacity: 0;
	white-space: nowrap;
	transition: max-width var(--dur-base) var(--ease-emphasized),
				opacity var(--dur-fast) var(--ease-standard);
}
@media (min-width: 1024px) {
	.lgg-wa__copy { display: inline-flex; }
	.lgg-wa:hover .lgg-wa__copy,
	.lgg-wa:focus-visible .lgg-wa__copy {
		max-width: 240px;
		opacity: 1;
	}
}

.lgg-wa__copy-title {
	font-family: var(--font-display);
	font-size: 0.95rem;
	font-weight: var(--fw-medium);
}
.lgg-wa__copy-sub {
	font-family: var(--font-body);
	font-size: 0.7rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	opacity: 0.85;
}