/* Field, status and button stacked vertically, all full width. */
.variations_button:has(.hbt-voucher-extension),
form.cart:has(.hbt-voucher-amount),
.hbt-stack {
	display: flex !important;
	/* Elementor's add-to-cart widget sets `flex-flow: row` with a high-specificity selector. */
	flex-flow: column nowrap !important;
	align-items: stretch !important;
	gap: 0;
	max-width: 420px;
}

.hbt-voucher-extension,
.hbt-voucher-amount {
	width: 100%;
	margin: 0 0 16px !important;
	padding: 0 !important;
}

.hbt-voucher-extension .form-row,
.hbt-voucher-amount {
	margin: 0;
	padding: 0;
}

.hbt-voucher-extension label,
.hbt-voucher-amount label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
}

.hbt-voucher-extension input.input-text,
.hbt-voucher-amount input.input-text {
	width: 100% !important;
	max-width: 100%;
	height: 50px;
	box-sizing: border-box;
	font-size: 16px;
	letter-spacing: .04em;
}

#hbt-voucher-code {
	text-transform: uppercase;
}

.hbt-stack .single_add_to_cart_button,
.variations_button:has(.hbt-voucher-extension) .single_add_to_cart_button,
form.cart:has(.hbt-voucher-amount) .single_add_to_cart_button {
	width: 100%;
	margin: 0 !important;
}

.hbt-hint {
	margin: 6px 0 0;
	font-size: 13px;
	opacity: .75;
}

/* Status box between the code field and the button. */
.hbt-status {
	margin-top: 12px;
	border: 1px solid #d9dccf;
	border-left-width: 4px;
	border-radius: 4px;
	padding: 12px 14px;
	font-size: 14px;
	line-height: 1.45;
	background: #f7f8f4;
}

.hbt-status:empty {
	display: none;
}

.hbt-status--ok {
	border-left-color: #2e7d32;
}

.hbt-status--warn {
	border-left-color: #b26a00;
	background: #fff8ec;
}

.hbt-status--error {
	border-left-color: #c62828;
	background: #fdf2f2;
	color: #8e1c1c;
}

.hbt-status--loading {
	border-left-color: #9aa08a;
	color: #666;
}

.hbt-status__row {
	display: flex;
	align-items: center;
	gap: 10px;
}

.hbt-status__row + .hbt-status__row {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px dashed #d9dccf;
}

.hbt-status__icon {
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
}

.hbt-status__label {
	flex: 1 1 auto;
}

.hbt-status__value {
	font-weight: 700;
	white-space: nowrap;
}

.hbt-status--ok .hbt-status__row--new .hbt-status__value {
	color: #2e7d32;
}

.hbt-status__note {
	margin-top: 8px;
	font-size: 13px;
	opacity: .8;
}