/* ============================================================
   Widget flotante — cápsula sticker, inferior izquierda
   (WhatsApp de Elementor conserva la esquina inferior derecha)
   ============================================================ */
.jsa-widget {
	position: fixed;
	left: clamp(12px, 2.4vw, 26px);
	bottom: clamp(12px, 3vh, 26px);
	z-index: 99990;
	display: flex;
	align-items: flex-start;
	filter: drop-shadow(0 14px 26px rgba(4, 40, 50, .38));
	animation: jsa-widget-in .6s cubic-bezier(.34, 1.56, .64, 1) .4s backwards;
}

@keyframes jsa-widget-in {
	from { opacity: 0; transform: translateY(120%) rotate(-4deg); }
	to   { opacity: 1; transform: translateY(0) rotate(0); }
}

.jsa-widget__pill {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 18px 12px 12px;
	background: linear-gradient(145deg, var(--jsa-teal) 0%, var(--jsa-deep) 100%);
	border: 3px solid var(--jsa-cream);
	border-radius: 999px;
	text-decoration: none !important;
	animation: jsa-bob 3.6s ease-in-out infinite;
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s ease;
	box-shadow: 0 0 0 0 transparent;
}

.jsa-widget__pill:hover,
.jsa-widget__pill:focus-visible {
	animation-play-state: paused;
	transform: scale(1.05) rotate(-1deg);
	box-shadow: 0 0 0 5px color-mix(in srgb, var(--jsa-accent) 45%, transparent);
	outline: none;
}

.jsa-widget__sun { display: grid; place-items: center; }

.jsa-widget__rays {
	transform-origin: 30px 30px;
	animation: jsa-spin-slow 12s linear infinite;
}

.jsa-widget__copy {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}

.jsa-widget__title {
	font-family: var(--jsa-font-display);
	font-weight: 700;
	font-size: 1.02rem;
	color: var(--jsa-white);
	text-transform: uppercase;
	letter-spacing: .02em;
}

.jsa-widget__dates {
	font-family: var(--jsa-font-body);
	font-weight: 600;
	font-size: .8rem;
	color: var(--jsa-accent);
}

.jsa-widget__arrow {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--jsa-accent);
	color: var(--jsa-accent-ink);
	transition: transform .25s ease;
}

.jsa-widget__pill:hover .jsa-widget__arrow { transform: translateX(4px); }

@media (max-width: 640px) {
	.jsa-widget__dates { display: none; }
	.jsa-widget__title { font-size: .9rem; }
	.jsa-widget__pill { gap: 8px; padding: 8px 14px 9px 10px; }
}

@media (prefers-reduced-motion: reduce) {
	.jsa-widget, .jsa-widget__pill, .jsa-widget__rays { animation: none; }
}
