/**
 * QTech Distribution
 * Site-wide WhatsApp Enquiry Button
 *
 * Fixed, responsive and accessible.
 */

/* Floating WhatsApp button */
.qtech-whatsapp-button {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 9999;

	display: inline-flex;
	align-items: center;
	gap: 10px;

	padding: 12px 18px;

	background: #2f8f46;
	border: 1px solid #2f8f46;
	border-radius: 999px;

	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;

	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);

	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease,
		background-color 0.25s ease;
}

/* WhatsApp icon */
.qtech-whatsapp-button__icon {
	width: 22px;
	height: 22px;
	flex: 0 0 22px;

	fill: currentColor;
}

/* Button text */
.qtech-whatsapp-button__text {
	white-space: nowrap;
}

/* Hover state */
.qtech-whatsapp-button:hover {
	background: #26783a;
	border-color: #26783a;

	color: #ffffff;
	text-decoration: none;

	transform: translateY(-2px);

	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

/* Keyboard accessibility */
.qtech-whatsapp-button:focus-visible {
	outline: 3px solid rgba(47, 143, 70, 0.35);
	outline-offset: 4px;

	color: #ffffff;
}

/* Mobile */
@media screen and (max-width: 767px) {

	.qtech-whatsapp-button {
		right: 16px;
		bottom: 16px;

		padding: 13px;
		gap: 0;

		border-radius: 50%;
	}

	.qtech-whatsapp-button__icon {
		width: 24px;
		height: 24px;
		flex-basis: 24px;
	}

	/* Keep the mobile interface minimal. */
	.qtech-whatsapp-button__text {
		display: none;
	}
}