/* PCT WhatsApp Contextual */

:root {
	--pct-wa: #25d366;
	--pct-wa-oscuro: #1da851;
}

/* ---------- Botón flotante ---------- */
.pct-wa-flotante {
	position: fixed;
	bottom: 22px;
	right: 22px;
	z-index: 99990;
	display: inline-flex;
	align-items: center;
	background: var(--pct-wa);
	color: #fff;
	border-radius: 50px;
	box-shadow: 0 10px 30px -8px rgba(37, 211, 102, .6);
	text-decoration: none;
	overflow: hidden;
	max-width: 60px;
	transition: background .2s ease, transform .2s ease, box-shadow .2s ease, max-width .25s ease;
	animation: pct-wa-latido 2.6s ease-in-out infinite;
}

.pct-wa-flotante--izq {
	right: auto;
	left: 22px;
}

.pct-wa-flotante:hover,
.pct-wa-flotante:focus {
	background: var(--pct-wa-oscuro);
	color: #fff;
	text-decoration: none;
	transform: translateY(-2px);
	max-width: 420px;
	box-shadow: 0 14px 34px -8px rgba(29, 168, 81, .7);
	animation: none;
}

.pct-wa-flotante__icono {
	flex: none;
	width: 60px;
	height: 60px;
	display: grid;
	place-items: center;
}

.pct-wa-flotante__texto {
	white-space: nowrap;
	font-size: .95rem;
	font-weight: 600;
	padding-right: 24px;
	opacity: 0;
	transition: opacity .2s ease .05s;
}

.pct-wa-flotante:hover .pct-wa-flotante__texto,
.pct-wa-flotante:focus .pct-wa-flotante__texto {
	opacity: 1;
}

@keyframes pct-wa-latido {
	0%, 100% { box-shadow: 0 10px 30px -8px rgba(37, 211, 102, .6); }
	50% { box-shadow: 0 10px 30px -8px rgba(37, 211, 102, .6), 0 0 0 10px rgba(37, 211, 102, .18); }
}

/* ---------- Botón inline ---------- */
.pct-wa-inline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	width: 100%;
	background: #fff;
	color: var(--pct-wa-oscuro);
	border: 2px solid var(--pct-wa);
	border-radius: 8px;
	padding: 12px 18px;
	font-size: .95rem;
	font-weight: 700;
	text-decoration: none;
	margin-top: 12px;
	box-sizing: border-box;
	transition: background .18s ease, color .18s ease;
}

.pct-wa-inline:hover,
.pct-wa-inline:focus {
	background: var(--pct-wa);
	color: #fff;
	text-decoration: none;
}

.pct-wa-inline__icono {
	display: inline-flex;
	line-height: 0;
}

@media (max-width: 640px) {
	.pct-wa-flotante { bottom: 16px; right: 16px; }
	.pct-wa-flotante--izq { left: 16px; right: auto; }
	.pct-wa-flotante__icono { width: 54px; height: 54px; }
}

@media (prefers-reduced-motion: reduce) {
	.pct-wa-flotante { animation: none; }
}