/**
 * Pontual — botão flutuante do WhatsApp.
 * Computador/tablet: ícone + texto. Celular: só o ícone (compacto).
 * Classes com prefixo "pwa-" para não colidir com o tema.
 */
.pwa-botao {
	--pwa-verde: #25d366;
	--pwa-verde-escuro: #1da851;
	--pwa-borda: 20px;
	--pwa-altura: 0px;

	position: fixed;
	z-index: 9990; /* acima do conteúdo, abaixo de modais/lightbox (normalmente 10000+) */
	bottom: calc(var(--pwa-borda) + var(--pwa-altura) + env(safe-area-inset-bottom, 0px));
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: calc(100vw - 2 * var(--pwa-borda));
	padding: 6px 18px 6px 6px;
	border-radius: 999px;
	background: var(--pwa-verde);
	color: #fff !important;
	font: 600 15px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	text-decoration: none !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .18), 0 2px 4px rgba(0, 0, 0, .12);
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
	animation: pwa-entrar .45s ease-out .6s backwards; /* "backwards": depois de entrar, libera o transform para o hover */
	-webkit-tap-highlight-color: transparent;
	box-sizing: border-box;
}
.pwa-botao *, .pwa-botao *::before, .pwa-botao *::after { box-sizing: border-box; }
.pwa-direita { right: calc(var(--pwa-borda) + env(safe-area-inset-right, 0px)); }
.pwa-esquerda { left: calc(var(--pwa-borda) + env(safe-area-inset-left, 0px)); }

.pwa-circulo {
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, .16);
}
.pwa-icone { display: block; width: 28px; height: 28px; }
.pwa-texto { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.pwa-botao:hover {
	background: var(--pwa-verde-escuro);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(0, 0, 0, .22), 0 3px 6px rgba(0, 0, 0, .14);
}
.pwa-botao:active { transform: translateY(0); }
.pwa-botao:focus-visible {
	outline: 3px solid #0b3d1f;
	outline-offset: 3px;
}

@keyframes pwa-entrar {
	from { opacity: 0; transform: translateY(16px) scale(.92); }
	to   { opacity: 1; transform: none; }
}

/* Celular: botão compacto, só o ícone (área de toque de 56px). */
@media (max-width: 640px) {
	.pwa-botao {
		--pwa-borda: 14px;
		padding: 0;
		width: 56px;
		height: 56px;
		justify-content: center;
	}
	.pwa-circulo { width: 56px; height: 56px; background: transparent; }
	.pwa-icone { width: 30px; height: 30px; }
	.pwa-texto {
		position: absolute !important;
		width: 1px; height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

/* Tablet em pé / telas médias: texto um pouco menor. */
@media (min-width: 641px) and (max-width: 1024px) {
	.pwa-botao { font-size: 14px; padding-right: 16px; }
	.pwa-circulo { width: 40px; height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.pwa-botao { animation: none; transition: none; }
	.pwa-botao:hover { transform: none; }
}

@media print {
	.pwa-botao { display: none !important; }
}

/* Pré-visualização dentro das Configurações (não é fixo na tela). */
.pwa-botao.pwa-previa {
	position: absolute;
	animation: none;
	--pwa-borda: 14px;
}
.pwa-previa-celular .pwa-botao.pwa-previa {
	padding: 0;
	width: 56px;
	height: 56px;
	justify-content: center;
}
.pwa-previa-celular .pwa-previa .pwa-circulo { width: 56px; height: 56px; background: transparent; }
.pwa-previa-celular .pwa-previa .pwa-texto { display: none; }
