.wbb-whatsapp-buy {
	margin-top: 10px;
}

.wbb-whatsapp-buy.wbb-hidden {
	display: none;
}

.wbb-whatsapp-buy .wbb-whatsapp-note {
	opacity: 0.75;
	margin: 8px 0 0;
}

/* The button reuses the theme's .button.alt / .single_add_to_cart_button
   classes so padding, border-radius, font, etc. all match the default
   button it sits below - we only override its color (official WhatsApp
   green). This version only renders on the single product page (product
   cards keep WooCommerce's default "Add to cart" untouched), so it always
   spans the full width below the default button. */
.wbb-whatsapp-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	line-height: 1.2;
	background-color: #25D366 !important; /* official WhatsApp green */
	border-color: #25D366 !important;
	color: #fff !important;
}

.wbb-whatsapp-buy .wbb-whatsapp-button {
	width: 100%;
}

.wbb-whatsapp-button:hover,
.wbb-whatsapp-button:focus {
	background-color: #1DA851 !important; /* WhatsApp's darker hover green */
	border-color: #1DA851 !important;
	color: #fff !important;
}

.wbb-whatsapp-button .wbb-external-icon {
	font-size: 0.85em;
	opacity: 0.9;
}

.wbb-whatsapp-button.wbb-loading {
	opacity: 0.7;
	cursor: wait;
	pointer-events: none; /* also covers the <a> product-card button, which has no native "disabled" state */
}

/* Thank-you page fallback box. Deliberately its OWN class, not
   .wbb-whatsapp-button - this is a plain <a href> with the WhatsApp URL
   already filled in, and must never be intercepted by the AJAX click
   handler that the product/checkout buttons use. */
.wbb-whatsapp-continue-box {
	margin: 24px 0;
	padding: 20px;
	background-color: #e9f9ee;
	border: 1px solid #25D366;
	border-radius: 8px;
	text-align: center;
}

.wbb-whatsapp-continue-box p {
	margin: 0 0 12px;
}

.wbb-whatsapp-continue-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 28px;
	background-color: #25D366;
	color: #fff;
	border-radius: 4px;
	text-decoration: none;
	font-weight: 600;
}

.wbb-whatsapp-continue-button:hover,
.wbb-whatsapp-continue-button:focus {
	background-color: #1DA851;
	color: #fff;
}