/* Better Homes: "Order via WhatsApp" under Add to cart (see inc/whatsapp.php).
 * Size, padding, font and radius are copied from the real Add to cart button by
 * assets/js/whatsapp-order.js; the values here are the fallback (Woodmart's own button variables). */

.bh-wa {
	width: 100%;
	margin: 0 0 16px;
}

/* "──────  or  ──────" */
.bh-wa__sep {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 14px 0;
	color: #333;
	font-size: 16px;
	line-height: 1;
}

.bh-wa__sep:before,
.bh-wa__sep:after {
	content: "";
	flex: 1 1 auto;
	border-top: 1px solid #d6d6d6;
}

.bh-wa__sep:empty {
	gap: 0;
}

.bh-wa__sep:empty:after {
	content: none;
}

/* Self-contained: no generic theme "button" class, so nothing else can restyle it.
 * Sizing uses the same Woodmart button variables Add to cart uses (correct on first paint). */
.bh-wa .bh-wa__btn {
	display: flex;
	width: 100%;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: var(--btn-height, 42px);
	padding: var(--btn-padding, 5px 20px);
	border: 1px solid #1b9e4b;
	border-radius: var(--btn-brd-radius, 4px);
	background-color: #1b9e4b;
	color: #fff;
	font-family: var(--btn-font-family, inherit);
	font-size: var(--btn-font-size, 13px);
	font-weight: 400 !important;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none; /* keep the brand spelling "WhatsApp" */
	text-decoration: none !important;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.bh-wa .bh-wa__btn:hover,
.bh-wa .bh-wa__btn:focus {
	border-color: #168a40;
	background-color: #168a40;
	color: #fff;
}

.bh-wa .bh-wa__btn:focus-visible {
	outline: 2px solid #128c7e;
	outline-offset: 2px;
}

.bh-wa__icon {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
}

.bh-wa__notice {
	margin: 10px 0 0;
	padding: 8px 12px;
	border-radius: 4px;
	background: #fff4e5;
	color: #8a4b00;
	font-size: 14px;
	line-height: 1.4;
}

.bh-wa__notice[hidden] {
	display: none;
}