/*
 * WhatsApp Flotante - Estilos del botón.
 * Todas las clases usan el prefijo "drwf-" para evitar conflictos con el tema.
 */

.drwf-button {
	position: fixed;
	bottom: 20px;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background-color: #25d366;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
	color: #ffffff;
	text-decoration: none;
	line-height: 0;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.drwf-button:hover,
.drwf-button:focus {
	transform: scale(1.05);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
	color: #ffffff;
}

.drwf-position-right {
	right: 20px;
}

.drwf-position-left {
	left: 20px;
}

.drwf-icon {
	width: auto;
	height: 29px;
	display: block;
}

@media (max-width: 480px) {
	.drwf-button {
		width: 50px;
		height: 50px;
		bottom: 16px;
	}

	.drwf-position-right {
		right: 16px;
	}

	.drwf-position-left {
		left: 16px;
	}

	.drwf-icon {
		width: auto;
		height: 26px;
	}
}