/* HardBrand — оформлення: блок реквізитів для оплати на рахунок і пояснення «лише повна оплата». */

.hb-req {
	margin: 0 0 32px;
	padding: 24px;
	border: 2px solid #111;
	background: #fff;
}
.hb-req__title {
	margin: 0 0 10px;
	font-size: 22px;
	line-height: 1.2;
}
.hb-req__intro,
.hb-req__note {
	margin: 0 0 16px;
	font-size: 15px;
	line-height: 1.5;
}
.hb-req__note {
	margin: 16px 0 0;
	color: #555;
}
.hb-req__list {
	margin: 0;
	border-top: 1px solid #e5e5e5;
}
.hb-req__row {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 4px 16px;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid #e5e5e5;
}
.hb-req__row dt {
	margin: 0;
	font-weight: 400;
	font-size: 14px;
	color: #666;
}
.hb-req__row dd {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0;
	min-width: 0;
}
.hb-req__value {
	min-width: 0;
	font-weight: 600;
	font-size: 16px;
	line-height: 1.35;
	color: #111;
	overflow-wrap: anywhere;
}
.hb-req__value.is-mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 15px;
	letter-spacing: 0.02em;
}
.hb-req__copy {
	flex: 0 0 auto;
	min-height: 36px;
	padding: 6px 14px;
	border: 1px solid #111;
	border-radius: 0;
	background: #fff;
	color: #111;
	font-size: 13px;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s;
}
.hb-req__copy:hover,
.hb-req__copy:focus-visible,
.hb-req__copy.is-done {
	background: #111;
	color: #fff;
}

.hb-fullpay-note {
	margin: 0 0 20px;
	padding: 14px 16px;
	border-left: 4px solid #111;
	background: #f4f4f4;
	font-size: 14px;
	line-height: 1.5;
	color: #111;
}
.hb-fullpay-note b {
	display: block;
	margin-bottom: 4px;
}

/* Поле «Країна» з єдиним варіантом «Україна» — у формі є, на екрані не показується. */
.form-row.hb-co-hidden {
	display: none !important;
}

@media (max-width: 689px) {
	.hb-req {
		padding: 16px;
	}
	.hb-req__title {
		font-size: 19px;
	}
	.hb-req__row {
		grid-template-columns: minmax(0, 1fr);
		gap: 4px;
	}
	.hb-req__value {
		font-size: 15px;
	}
	.hb-req__value.is-mono {
		font-size: 14px;
		letter-spacing: 0;
	}
}

/* ---------- Оформлення блоками (правки клієнта 20.10, п. 7–11; розмітка — templates/form-checkout.php, логіка — steps.js) ---------- */

.hb-co-steps { display: flex; flex-direction: column; gap: 16px; }
.hb-co-step { border: 1px solid #e3e3e3; background: #fff; padding: 22px 24px; }
.hb-co-step__head { display: flex; align-items: center; gap: 12px; }
.hb-co-step__num {
	flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	background: #111; color: #fff; font-size: 14px; font-weight: 600;
}
.hb-co-step__title { margin: 0 !important; flex: 1; font-size: 18px; }
.hb-co-step__edit {
	display: none; padding: 0; border: 0; background: none; color: #111;
	font-size: 14px; text-decoration: underline; cursor: pointer;
}
.hb-co-step__summary { margin: 8px 0 0 40px; color: #555; font-size: 14px; line-height: 1.5; }
.hb-co-step__summary:empty { display: none; }
.hb-co-step__body { margin-top: 18px; }
.hb-co-step__next { margin-top: 18px; min-width: 200px; }

/* Поки скрипт кроків не запрацював — усі кроки відкриті, як звичайна форма; кнопки «Продовжити» не потрібні. */
.hb-co-form:not(.hb-co-steps-ready) .hb-co-step__next { display: none; }
.hb-co-form.hb-co-steps-ready .hb-co-step:not(.is-open) .hb-co-step__body { display: none; }
.hb-co-form.hb-co-steps-ready .hb-co-step.is-done .hb-co-step__edit { display: inline; }
.hb-co-form.hb-co-steps-ready .hb-co-step.is-next { background: #fafafa; }
.hb-co-form.hb-co-steps-ready .hb-co-step.is-next .hb-co-step__num { background: #bdbdbd; }
.hb-co-form.hb-co-steps-ready .hb-co-step.is-next .hb-co-step__title { color: #9a9a9a; }
.hb-co-form.hb-co-steps-ready .hb-co-step.is-done .hb-co-step__num { background: #fff; color: #111; border: 1px solid #111; }

/* Заголовки WooCommerce усередині кроків — зайві, назва кроку вже є. */
.hb-co-step .woocommerce-billing-fields > h3,
.hb-co-step .woocommerce-additional-fields > h3,
.hb-co-step .woocommerce-shipping-fields:empty { display: none; }
.hb-co-step .woocommerce-billing-fields__field-wrapper > .form-row:last-child { margin-bottom: 0; }

/* Способи доставки в кроці 2. */
.hb-co-ship ul#shipping_method { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.hb-co-ship ul#shipping_method li {
	display: flex; align-items: center; gap: 10px; margin: 0;
	padding: 12px 14px; border: 1px solid #e3e3e3; cursor: pointer;
}
.hb-co-ship ul#shipping_method li:has(input:checked) { border-color: #111; }
.hb-co-ship ul#shipping_method li label { margin: 0; cursor: pointer; flex: 1; }
.hb-co-ship__none { margin: 0 0 16px; color: #555; }

/* Сума до сплати над кнопкою (з 23.10 — праворуч під замовленням). */
.hb-co-paytotal { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 14px; font-size: 16px; }
.hb-co-paytotal b { font-size: 18px; }
.hb-co-paytotal span { width: 100%; color: #555; font-size: 14px; }
.hb-co-place .woocommerce-privacy-policy-text p { font-size: 13px; color: #555; margin: 0 0 14px; }

/* Праворуч: товари з фото, стара й нова ціна (п. 8). */
.hb-co-review .cart_item td { vertical-align: top; }
.hb-co-item { display: flex; gap: 12px; align-items: flex-start; }
.hb-co-item__img { flex: 0 0 56px; }
.hb-co-item__img img { width: 56px; height: 56px; object-fit: cover; display: block; }
.hb-co-item__text { font-size: 14px; line-height: 1.4; }
.hb-co-review .product-total { text-align: right; white-space: nowrap; }
.hb-co-review .product-total .hb-price { flex-direction: column; align-items: flex-end; gap: 0; }

/* Промокод — рядком після «Вартість товарів» (23.10). */
.hb-co-coupon { margin: 0; }
.hb-co-coupon__toggle { padding: 0; border: 0; background: none; color: #111; font-size: 15px; font-weight: 500; cursor: pointer; }
.hb-co-coupon__form { display: flex; gap: 8px; margin-top: 10px; }
.hb-co-coupon__form[hidden] { display: none; }
.hb-co-coupon__form .input-text { flex: 1; min-width: 0; }
.hb-co-coupon.is-busy { opacity: 0.6; pointer-events: none; }
.hb-co-coupon__msg .woocommerce-error,
.hb-co-coupon__msg .woocommerce-message { margin: 10px 0 0; font-size: 14px; }

@media (max-width: 689px) {
	.hb-co-step { padding: 18px 16px; }
	.hb-co-step__next { width: 100%; }
}

/* Тема тягне блок оплати на 26 px за краї (margin-inline: -26px — під свою рамку підсумку праворуч); у кроці 3 — без цього. */
.hb-co-step .woocommerce-checkout-payment { margin-inline: 0; }

/* Поля Нової Пошти (клієнт 21.10 14:23: «Зменшити пробіли»). Модуль між містом і відділенням / поштоматом ставить
   службові рядки лише з прихованими полями (назва й код міста, область, код відділення, номер) — кожен порожній, але з
   відступом 24 px, разом 50–80 px дірки. Такі рядки ховаємо; значення в них лишаються й ідуть із формою. */
.mrkv_ua_shipping_checkout_fields .form-row:not(:has(input:not([type="hidden"]), select, textarea)) { display: none; }

/* ---------- Правки клієнта 23.10 ---------- */

/* Сірий фон сторінки, блоки — білі («заливка заднього фону для більшої читаності блоків»). */
body.woocommerce-checkout:not(.woocommerce-order-received):not(.woocommerce-order-pay) { background: #f3f3f3; }
body.woocommerce-checkout .ct-order-review { background: #fff; }

/* Підсумок праворуч щільніше: кнопка тепер теж праворуч, блок вищий («можна зменшити відступи від Вартість товарів до Разом»). */
.hb-co-review.shop_table tfoot th,
.hb-co-review.shop_table tfoot td { padding-top: 10px !important; padding-bottom: 10px !important; }
.hb-co-review.shop_table tbody td { padding-top: 12px !important; padding-bottom: 12px !important; }
.hb-co-review .hb-co-coupon-row td { text-align: left !important; }
/* «Вже замовляли у нас? Натисніть, щоб увійти» — теж білим блоком, інакше сіре на сірому. */
body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
body.woocommerce-checkout .woocommerce-form-login { background: #fff; }

/* Текст згоди, сума до сплати й кнопка праворуч під замовленням. */
.hb-co-place { margin: 20px 0 0 !important; padding: 0 !important; }
.hb-co-place #place_order { width: 100%; }

/* Нотатки до замовлення за кнопкою. */
.hb-co-notes-add {
	display: inline-block; margin: 4px 0 0; padding: 0; border: 0; background: none;
	color: #111; font-size: 15px; font-weight: 500; cursor: pointer;
}

/* Аудит 23.10: на телефоні довга назва способу оплати («Передоплата карткою, решта — при отриманні») переносилась цілим
   рядком під кружечок вибору — кружечок висів сам над текстом. Тепер кружечок і назва в одному рядку, логотип — під назвою праворуч. */
@media (max-width: 689px) {
	#payment ul.payment_methods > li.wc_payment_method > label { display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: center; column-gap: 10px; row-gap: 6px; }
	#payment ul.payment_methods > li.wc_payment_method > label img { grid-column: 2; justify-self: end; }
}