/* Layout — поле бонусов = #coupon_code (тема даёт input { border-radius:30px }). */

.ms-bonus-checkout {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	margin: 0 0 1rem;
	padding: 0;
	border: 0;
	background: transparent;
}

.ms-bonus-checkout__controls {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 12px;
}

/*
 * Тема: input[type=text] { border-radius: 30px }.
 * У промокода это снимает .coupon > *, у бонусов — явно.
 * Цвета НЕ трогаем — наследует те же #eefcf6 / --qode-main-color, что и Промокод.
 */
.ms-bonus-checkout input.input-text,
.ms-bonus-checkout .ms-bonus-checkout__input,
#ms_bonus_balance_display,
#ms_bonus_balance_display.input-text,
#ms_bonus_balance_display.input-text[readonly] {
	box-sizing: border-box !important;
	border-radius: 0 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	margin-bottom: 0 !important;
	opacity: 1 !important;
	cursor: default !important;
}

.ms-bonus-checkout .button,
.ms-bonus-checkout__btn.button {
	border-radius: 0 !important;
	margin-bottom: 0 !important;
}

.ms-bonus-checkout__message {
	margin: 0;
	font-size: 0.9rem;
	opacity: 0.85;
	line-height: 1.4;
}

.ms-bonus-checkout--cart {
	margin-left: 0;
}

/* ---- Checkout Frame 3 ---- */
.ms-checkout-actions-row {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 12px !important;
	margin: 0 0 1.5rem;
	width: 100%;
}

.ms-checkout-actions-row .ms-checkout-coupon {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 12px !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	width: auto !important;
}

.ms-checkout-actions-row .ms-checkout-coupon .form-row,
.ms-checkout-actions-row .ms-checkout-coupon > p {
	display: none !important;
}

.ms-checkout-actions-row .ms-checkout-coupon input.input-text,
.ms-checkout-actions-row .ms-checkout-coupon #coupon_code,
.ms-checkout-actions-row .ms-bonus-checkout__input,
.ms-checkout-actions-row #ms_bonus_balance_display {
	box-sizing: border-box !important;
	width: 180px !important;
	min-width: 140px !important;
	max-width: 220px !important;
	margin: 0 !important;
	float: none !important;
	border-radius: 0 !important;
}

.ms-checkout-actions-row .ms-bonus-checkout--checkout {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 12px !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	width: auto !important;
	min-width: 0;
}

.ms-checkout-actions-row .ms-bonus-checkout__controls {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 12px !important;
}

.ms-checkout-actions-row .ms-checkout-actions-row__btn.button,
.ms-checkout-actions-row .ms-frame3-btn.button {
	border: 1px solid var(--qode-main-color, #197b4f) !important;
	border-radius: 0 !important;
	color: var(--qode-main-color, #197b4f) !important;
	background-color: var(--qode-main-fade-color, #d0ede0) !important;
	background-image: none !important;
	margin: 0 !important;
	float: none !important;
	white-space: nowrap !important;
}

.ms-checkout-actions-row .ms-checkout-actions-row__btn.button:hover,
.ms-checkout-actions-row .ms-frame3-btn.button:hover {
	color: #ffffff !important;
	background-color: var(--qode-main-color, #197b4f) !important;
}

.ms-checkout-actions-row .ms-frame3-btn.button:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.woocommerce-form-coupon-toggle {
	display: none !important;
}

@media only screen and (max-width: 680px) {
	/* Mobile only — desktop Frame 3 row untouched */
	.ms-bonus-checkout,
	.ms-bonus-checkout__controls,
	.ms-checkout-actions-row,
	.ms-checkout-actions-row .ms-checkout-coupon,
	.ms-checkout-actions-row .ms-bonus-checkout--checkout,
	.ms-checkout-actions-row .ms-bonus-checkout__controls {
		display: flex !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		visibility: visible !important;
		opacity: 1 !important;
		height: auto !important;
		overflow: visible !important;
	}

	.ms-checkout-actions-row .ms-checkout-coupon input.input-text,
	.ms-checkout-actions-row .ms-checkout-actions-row__btn.button,
	.ms-checkout-actions-row .ms-frame3-btn.button,
	.ms-checkout-actions-row .ms-bonus-checkout__input,
	.ms-checkout-actions-row #ms_bonus_balance_display,
	.ms-bonus-checkout__input,
	.ms-bonus-checkout__btn.button,
	#ms_bonus_balance_display {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		justify-content: center;
	}
}

/* Header bonus widget */
.widget_ms_bonus_header {
	display: flex !important;
	align-items: center !important;
}

.widget_ms_bonus_header .qodef-ms-bonus-widget-holder,
.widget_ms_bonus_header .qodef-ms-bonus-inner {
	position: relative;
	display: flex !important;
	align-items: center !important;
	vertical-align: middle;
	height: auto !important;
	margin: 0 !important;
}

.widget_ms_bonus_header .qodef-ms-bonus-widget-link {
	display: flex !important;
	align-items: center !important;
	text-decoration: none;
	color: #000000;
	line-height: 1.2 !important;
}

.widget_ms_bonus_header .qodef-ms-bonus-widget-link:hover {
	color: #000000;
}

.widget_ms_bonus_header .qodef-ms-bonus-icon-count-holder {
	display: flex !important;
	justify-content: center;
	align-items: center !important;
	height: auto !important;
	margin: 0;
	font-family: "Work Sans", sans-serif;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.05em;
	color: #000000;
	line-height: 1.2 !important;
}

.widget_ms_bonus_header .qodef-ms-bonus-widget-icon {
	display: inline-flex;
	align-items: center;
	line-height: 0;
	color: #000000;
}

.widget_ms_bonus_header .qodef-ms-bonus-widget-icon svg {
	width: 18px;
	height: 18px;
	display: block;
}

.widget_ms_bonus_header .qodef-ms-bonus-text {
	margin-left: 6px;
	white-space: nowrap;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	color: #000000;
}