/*
 * PC Shop — стили корзины и оформления заказа.
 * Подгружается на is_cart() || is_checkout() || is_order_received_page().
 */

/* WC notices (.woocommerce-message с "Отменить?") — убираем focus-ring,
 * который появляется после AJAX-замены контейнера. Только для keyboard nav
 * (через :focus-visible) outline возвращается для доступности. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notices-wrapper,
.woocommerce {
	outline: none;
}
.woocommerce-message:focus,
.woocommerce-info:focus,
.woocommerce-error:focus,
.woocommerce-notices-wrapper:focus,
.woocommerce:focus {
	outline: none;
}
.woocommerce-message:focus-visible,
.woocommerce-info:focus-visible,
.woocommerce-error:focus-visible {
	outline: 2px solid var(--pc-accent);
	outline-offset: 2px;
}

/* === ФОРСИМ ШИРИНУ И ЦЕНТРОВКУ #primary НА WC-СТРАНИЦАХ ===
   На cart/checkout/order-received Astra-WC-стили выкидывают max-width
   у entry-content, и наша глобальная #primary-правка проигрывает.
   Дублируем здесь с большей специфичностью (html body) и !important. */
html body.woocommerce-cart #primary,
html body.woocommerce-checkout #primary,
html body.woocommerce-order-received #primary {
	max-width: 1320px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 32px 20px 60px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	float: none !important;
	display: block !important;
}

/* Astra-стандартный контейнер на этих страницах должен быть
   прозрачным проходным каркасом. */
html body.woocommerce-cart .pc-container,
html body.woocommerce-checkout .pc-container,
html body.woocommerce-order-received .pc-container {
	max-width: 100% !important;
	width: 100% !important;
	padding: 0 !important;
}

.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title,
.woocommerce-order-received .entry-title {
	color: var(--pc-text);
	font-size: 28px;
	font-weight: 800;
	margin: 0 0 24px;
}

/* === ИНФО / СООБЩЕНИЯ WOO === */

.woocommerce-info,
.woocommerce-message,
.woocommerce-error,
.woocommerce-notice {
	background: var(--pc-bg-card) !important;
	color: var(--pc-text) !important;
	border: 1px solid var(--pc-border) !important;
	border-left: 3px solid var(--pc-accent) !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 14px 18px !important;
	margin-bottom: 20px !important;
	box-shadow: none !important;
	font-size: 14px;
	list-style: none;
	outline: none !important;     /* убираем браузерный focus-ring */
}

/* WC ставит tabindex="-1" на notice и делает .focus() при появлении —
 * без этого правила появляется браузерная focus-обводка (красная рамка),
 * которая пропадает только при клике в другое место. */
.woocommerce-info:focus,
.woocommerce-message:focus,
.woocommerce-error:focus,
.woocommerce-notice:focus,
.woocommerce-info:focus-visible,
.woocommerce-message:focus-visible,
.woocommerce-error:focus-visible,
.woocommerce-notice:focus-visible {
	outline: none !important;
	box-shadow: none !important;
}

/* Прячем WC font-icon (квадрат, если шрифт не загрузился) */
.woocommerce-info::before,
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-notice::before {
	display: none !important;
}

.woocommerce-info a,
.woocommerce-message a {
	color: var(--pc-accent) !important;
	text-decoration: none;
	font-weight: 600;
}

/* Кнопки внутри WC-сообщений (например, «Просмотр корзины» в нотисе купона) —
   красные, как остальные кнопки темы. Astra по умолчанию делает их синими. */
.woocommerce-info a.button,
.woocommerce-message a.button,
.woocommerce-info a.wc-forward,
.woocommerce-message a.wc-forward,
.woocommerce-info .button.wc-forward,
.woocommerce-message .button.wc-forward {
	background: var(--pc-accent) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 10px 18px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.6px !important;
	box-shadow: none !important;
	transition: background 0.15s ease !important;
}

.woocommerce-info a.button:hover,
.woocommerce-message a.button:hover,
.woocommerce-info a.wc-forward:hover,
.woocommerce-message a.wc-forward:hover {
	background: var(--pc-accent-hover) !important;
	color: #fff !important;
}

.woocommerce-error {
	border-top-color: #ff4a4a !important;
}

/* === ТАБЛИЦА КОРЗИНЫ === */

.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
	background: var(--pc-bg-card) !important;
	color: var(--pc-text) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-md) !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
}

.woocommerce table.shop_table thead th {
	background: var(--pc-bg-elevated) !important;
	color: var(--pc-text-muted) !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	padding: 14px 18px !important;
	border-bottom: 1px solid var(--pc-border) !important;
	text-align: left;
}

.woocommerce table.shop_table tbody td,
.woocommerce table.shop_table td {
	padding: 18px !important;
	border-bottom: 1px solid var(--pc-border) !important;
	background: transparent !important;
	color: var(--pc-text) !important;
	vertical-align: middle;
}

.woocommerce table.shop_table tr:last-child td {
	border-bottom: none !important;
}

/* Картинка товара */
.woocommerce table.shop_table .product-thumbnail {
	width: 100px;
}

.woocommerce table.shop_table .product-thumbnail a img,
.woocommerce table.shop_table .product-thumbnail img {
	width: 80px !important;
	height: 80px !important;
	object-fit: cover;
	border-radius: var(--pc-radius-sm);
	border: 1px solid var(--pc-border);
	display: block;
}

/* Название товара */
.woocommerce table.shop_table .product-name a {
	color: var(--pc-text) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	font-size: 15px;
}

.woocommerce table.shop_table .product-name a:hover {
	color: var(--pc-accent) !important;
}

/* Цена */
.woocommerce table.shop_table .product-price,
.woocommerce table.shop_table .product-subtotal {
	color: var(--pc-text) !important;
	font-weight: 700 !important;
	font-size: 15px;
}

.woocommerce table.shop_table .product-price del,
.woocommerce table.shop_table .product-subtotal del {
	color: var(--pc-text-dim) !important;
	font-weight: 400 !important;
	opacity: 0.7;
}

.woocommerce table.shop_table .product-price ins,
.woocommerce table.shop_table .product-subtotal ins {
	background: none !important;
	color: var(--pc-accent) !important;
	text-decoration: none !important;
}

/* Количество */
.woocommerce table.shop_table .product-quantity .quantity {
	display: inline-flex;
	background: var(--pc-bg-elevated);
	border: 1px solid var(--pc-border);
	border-radius: var(--pc-radius-sm);
	overflow: hidden;
}

.woocommerce table.shop_table .product-quantity .quantity input.qty {
	background: transparent !important;
	color: var(--pc-text) !important;
	border: none !important;
	padding: 8px 6px !important;
	width: 60px !important;
	text-align: center;
	font-weight: 700;
}

/* Удалить товар */
.woocommerce table.shop_table .product-remove a.remove {
	color: var(--pc-text-muted) !important;
	background: var(--pc-bg-elevated) !important;
	width: 28px !important;
	height: 28px !important;
	line-height: 28px !important;
	border-radius: 50% !important;
	border: 1px solid var(--pc-border);
	transition: color 0.15s, background 0.15s, border-color 0.15s;
	font-size: 16px !important;
	text-align: center;
	font-weight: 700 !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.woocommerce table.shop_table .product-remove a.remove:hover {
	color: #fff !important;
	background: var(--pc-accent) !important;
	border-color: var(--pc-accent) !important;
}

/* Строка с купоном и обновлением */
.woocommerce table.shop_table td.actions {
	background: var(--pc-bg-elevated) !important;
	padding: 16px 18px !important;
}

.woocommerce table.shop_table .coupon {
	display: inline-flex;
	gap: 8px;
	align-items: center;
}

.woocommerce table.shop_table .coupon label {
	display: none;
}

.woocommerce table.shop_table .coupon input[type="text"],
.woocommerce table.shop_table .coupon input.input-text {
	background: var(--pc-bg-card) !important;
	color: var(--pc-text) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 10px 14px !important;
	font-size: 14px !important;
	min-width: 200px;
}

/* Кнопка "Обновить корзину" + "Поделиться корзиной" — вторичные (outline).
 * Объединены в одно правило для ИДЕНТИЧНОГО размера/стиля. Share-кнопка
 * рендерится через woocommerce_cart_actions prio 100 (см. inc/share.php). */
.woocommerce table.shop_table td.actions button[name="update_cart"],
.woocommerce table.shop_table td.actions input[name="update_cart"],
.woocommerce table.shop_table td.actions .pc-cart-share-btn {
	background: transparent !important;
	color: var(--pc-text-muted) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 10px 18px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	line-height: 1.4 !important;
	display: inline-block !important;
	box-sizing: border-box !important;
	height: auto !important;
	min-height: 0 !important;
	box-shadow: none !important;
	transition: color 0.15s, border-color 0.15s, background 0.15s !important;
	cursor: pointer;
	float: right;
}

/* Gap между двумя кнопками когда они в одну линию */
.woocommerce table.shop_table td.actions .pc-cart-share-btn {
	margin-right: 10px;
}

.woocommerce table.shop_table td.actions button[name="update_cart"]:hover,
.woocommerce table.shop_table td.actions button[name="update_cart"]:not(:disabled):hover,
.woocommerce table.shop_table td.actions .pc-cart-share-btn:hover {
	background: var(--pc-bg-card) !important;
	color: var(--pc-text) !important;
	border-color: var(--pc-accent) !important;
}

.woocommerce table.shop_table td.actions button[name="update_cart"]:disabled,
.woocommerce table.shop_table td.actions button[name="update_cart"][disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

/* На мобиле обе вторичные кнопки — full-width блоки в стек.
 * float-right ломается на узком экране, кнопки лучше во всю ширину для тапа. */
@media ( max-width: 600px ) {
	.woocommerce table.shop_table td.actions button[name="update_cart"],
	.woocommerce table.shop_table td.actions input[name="update_cart"],
	.woocommerce table.shop_table td.actions .pc-cart-share-btn {
		float: none !important;
		display: block !important;
		width: 100% !important;
		margin: 8px 0 0 !important;
	}
}

/* Общее правило для disabled-кнопок */
.woocommerce button[disabled],
.woocommerce input[type="submit"][disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

/* === БЛОК ИТОГОВ ===
   Обёртка cart-collaterals на полную ширину (=ширина формы выше),
   внутри cart_totals (макс 460px) прижат вправо через flex. */
.cart-collaterals {
	background: transparent !important;
	float: none !important;
	clear: both !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	display: flex !important;
	justify-content: flex-end !important;
}

.cart-collaterals .cart_totals {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-md) !important;
	padding: 24px !important;
	margin: 24px 0 0 !important;
	float: none !important;
	width: 100% !important;
	max-width: 460px !important;
}

.cart-collaterals .cart_totals h2,
.woocommerce .cart_totals h2 {
	background: transparent !important;
	color: var(--pc-text) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	border: none !important;
	border-bottom: 1px solid var(--pc-border) !important;
	padding-bottom: 12px !important;
}

.cart-collaterals .cart_totals table {
	background: transparent !important;
	border: none !important;
	margin: 0 !important;
}

.cart-collaterals .cart_totals table th,
.cart-collaterals .cart_totals table td {
	background: transparent !important;
	border: none !important;
	border-bottom: 1px solid var(--pc-border) !important;
	color: var(--pc-text) !important;
	padding: 12px 0 !important;
	font-size: 15px;
	vertical-align: middle;
}

.cart-collaterals .cart_totals table th {
	color: var(--pc-text-muted) !important;
	font-weight: 600 !important;
	text-transform: none;
	letter-spacing: 0;
}

.cart-collaterals .cart_totals .order-total th,
.cart-collaterals .cart_totals .order-total td {
	font-size: 16px !important;
	font-weight: 800 !important;
	color: var(--pc-text) !important;
	border-bottom: none !important;
	padding-top: 16px !important;
}

.cart-collaterals .cart_totals .order-total td .amount {
	color: var(--pc-accent) !important;
	font-size: 22px !important;
}

.cart-collaterals .wc-proceed-to-checkout {
	margin-top: 20px;
	padding: 0;
}

.cart-collaterals .wc-proceed-to-checkout .checkout-button,
.woocommerce a.checkout-button {
	background: var(--pc-accent) !important;
	color: #fff !important;
	display: block !important;
	text-align: center !important;
	padding: 16px 24px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	border-radius: var(--pc-radius-sm) !important;
	border: none !important;
	width: 100%;
	transition: background 0.15s ease;
}

.cart-collaterals .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce a.checkout-button:hover {
	background: var(--pc-accent-hover) !important;
}

/* Пустая корзина — монолитный блок (override через woocommerce/cart/cart-empty.php) */
.pc-cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 16px;
	padding: 56px 32px;
	background: var(--pc-bg-card, #1b2027);
	border: 1px solid var(--pc-border, #232830);
	border-radius: 16px;
	max-width: 640px;
	margin: 40px auto;
}

/* Большой кружок (120px). Иконка тележки геометрически центрирована,
 * но визуально басkет+колёса смещены вправо от центра SVG. Компенсируем
 * сдвигом SVG влево на 3px. */
.pc-cart-empty__icon {
	width: 120px;
	height: 120px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 42, 42, 0.1);
	border-radius: 50%;
	color: var(--pc-accent, #ff2a2a);
	margin-bottom: -8px;
}

.pc-cart-empty__icon svg {
	transform: translateX(-3px);
}

.pc-cart-empty__title {
	font-size: 26px;
	font-weight: 800;
	margin: 0;
	color: var(--pc-text, #e8eaed);
	letter-spacing: -0.01em;
}

.pc-cart-empty__desc {
	font-size: 14px;
	line-height: 1.55;
	color: var(--pc-text-muted, #9aa0a6);
	margin: 0;
	max-width: 480px;
}

.pc-cart-empty__actions {
	display: flex;
	gap: 12px;
	margin-top: 8px;
	flex-wrap: wrap;
	justify-content: center;
}

.pc-cart-empty__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	font-size: 14px;
	min-width: 200px;
	justify-content: center;
	text-decoration: none !important; /* WC overrides .entry-content a */
}

/* Primary — белый текст на красном фоне.
   !important бьёт .woocommerce-cart .entry-content a { color: red } */
.pc-cart-empty .pc-btn--primary,
.pc-cart-empty .pc-btn--primary:hover,
.pc-cart-empty .pc-btn--primary:focus {
	color: #fff !important;
	background: var(--pc-accent, #ff2a2a);
	border-color: var(--pc-accent, #ff2a2a);
}

.pc-cart-empty .pc-btn--primary:hover,
.pc-cart-empty .pc-btn--primary:focus {
	background: var(--pc-accent-hover, #ff4a4a);
	border-color: var(--pc-accent-hover, #ff4a4a);
}

/* Outline — прозрачный фон + красный текст и рамка.
   В main.css этого варианта нет — определяем тут локально для cart-empty,
   потом вынесем в main.css при общем рефакторе кнопок. */
.pc-cart-empty .pc-btn--outline {
	background: transparent;
	color: var(--pc-accent, #ff2a2a) !important;
	border: 1.5px solid var(--pc-accent, #ff2a2a);
}

.pc-cart-empty .pc-btn--outline:hover,
.pc-cart-empty .pc-btn--outline:focus {
	background: var(--pc-accent, #ff2a2a);
	color: #fff !important;
	border-color: var(--pc-accent, #ff2a2a);
}

@media (max-width: 480px) {
	.pc-cart-empty {
		padding: 40px 20px;
		margin: 20px 12px;
	}
	.pc-cart-empty__title {
		font-size: 22px;
	}
	.pc-cart-empty__actions {
		flex-direction: column;
		width: 100%;
	}
	.pc-cart-empty__btn {
		width: 100%;
		min-width: 0;
	}
}

/* Скрываем дефолтную WC empty-cart разметку — наш override её заменяет,
   но плагины (Sourcebuster, аналитика) могут параллельно вывести p.cart-empty */
.woocommerce-cart .cart-empty.woocommerce-info,
.woocommerce-cart .return-to-shop {
	display: none !important;
}

/* === CHECKOUT === */

/* Кросс-продажи на корзине */
.woocommerce .cross-sells > h2 {
	color: var(--pc-text);
	font-size: 22px;
	font-weight: 800;
	margin: 40px 0 20px;
}

/* Заголовки секций чекаута */
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading {
	color: var(--pc-text);
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--pc-border);
}

/* Поля формы */
.woocommerce form .form-row {
	margin-bottom: 16px;
	padding: 0 !important;
}

.woocommerce form .form-row label,
.woocommerce-checkout form .form-row label {
	color: var(--pc-text) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	margin-bottom: 6px !important;
	display: block !important;
}

.woocommerce form .form-row .required,
.woocommerce form .form-row abbr.required {
	color: var(--pc-accent) !important;
	text-decoration: none !important;
	border: none !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout form .form-row input,
.woocommerce-checkout form .form-row textarea,
.woocommerce-checkout form .form-row select {
	background: var(--pc-bg-card) !important;
	color: var(--pc-text) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 12px 14px !important;
	font-size: 15px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	font-family: inherit !important;
}

.woocommerce form .form-row input:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none !important;
	border-color: var(--pc-accent) !important;
}

/* Select2 (WC использует для стран и т.д.) */
.select2-container--default .select2-selection--single {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	height: 46px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--pc-text) !important;
	line-height: 46px !important;
	padding: 0 14px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 46px !important;
	right: 8px !important;
}

.select2-dropdown {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	color: var(--pc-text) !important;
}

.select2-results__option {
	color: var(--pc-text) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--pc-accent) !important;
	color: #fff !important;
}

.select2-search--dropdown .select2-search__field {
	background: var(--pc-bg-elevated) !important;
	color: var(--pc-text) !important;
	border: 1px solid var(--pc-border) !important;
}

/* === Блок «Ваш заказ» — единая карточка БЕЗ рамки ===
 * После того как JS перемещает h3#order_review_heading ВНУТРЬ #order_review,
 * получаем один блок-карточку: heading первым ребёнком, потом таблица заказа.
 * Никаких border'ов — выделение только через фон `--pc-bg-card`. */
.woocommerce-checkout #order_review {
	background: var(--pc-bg-card);
	border: none !important;
	border-radius: var(--pc-radius-md) !important;
	padding: 0 !important;
	margin-top: 0 !important;
	overflow: hidden;
}

/* Заголовок «Ваш заказ» — явно слева, с разделительной линией под текстом.
 * Селектор покрывает оба возможных места: heading может быть внутри #order_review
 * (после JS-перемещения) или снаружи (если JS не сработал). */
.woocommerce-checkout #order_review #order_review_heading,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3#order_review_heading,
.woocommerce-checkout #order_review > h3,
body.woocommerce-checkout h3#order_review_heading {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: 22px 24px 16px 24px !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	color: var(--pc-text) !important;
	letter-spacing: 0.2px !important;
	line-height: 1.2 !important;
	text-align: left !important;
	text-transform: none !important;
	text-indent: 0 !important;
	border-bottom: 1px solid var(--pc-border) !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
	direction: ltr !important;
	float: none !important;
	clear: both !important;
}

/* Внутренние блоки таблицы и payment получают свой padding */
.woocommerce-checkout #order_review > .woocommerce-checkout-review-order-table,
.woocommerce-checkout #order_review > #payment,
.woocommerce-checkout #order_review > .woocommerce-privacy-policy-text,
.woocommerce-checkout #order_review > #place_order {
	padding-left: 22px;
	padding-right: 22px;
}
.woocommerce-checkout #order_review > .woocommerce-checkout-review-order-table {
	padding-top: 4px;
	padding-bottom: 4px;
}
.woocommerce-checkout #order_review > #payment {
	padding-bottom: 18px;
}

.woocommerce-checkout #order_review table.shop_table {
	background: transparent !important;
	border: none !important;
}

.woocommerce-checkout #order_review table.shop_table td,
.woocommerce-checkout #order_review table.shop_table th {
	padding: 12px 0 !important;
	border-bottom: 1px solid var(--pc-border) !important;
}

.woocommerce-checkout #order_review .order-total td .amount {
	color: var(--pc-accent) !important;
	font-size: 22px;
	font-weight: 800;
}

/* === Очистка zebra-striping, фонов и rounded-углов на ВСЕХ ячейках таблицы заказа ===
 * WC (и Astra поверх него) рисует rgba-фон на ячейках, в т.ч. в thead.
 * На тёмной теме это создаёт «двухколоночный» вид заголовка ТОВАР/ПОДЫТОГ
 * с разделителем посередине. Чистим всё включая thead. */
.woocommerce-checkout #order_review table.shop_table,
.woocommerce-checkout #order_review table.shop_table thead,
.woocommerce-checkout #order_review table.shop_table tbody,
.woocommerce-checkout #order_review table.shop_table tfoot,
.woocommerce-checkout #order_review table.shop_table tr,
.woocommerce-checkout #order_review table.shop_table tr.cart_item,
.woocommerce-checkout #order_review table.shop_table tr.cart-subtotal,
.woocommerce-checkout #order_review table.shop_table tr.order-total,
.woocommerce-checkout #order_review table.shop_table tr.fee,
.woocommerce-checkout #order_review table.shop_table thead tr,
.woocommerce-checkout #order_review table.shop_table thead tr th,
.woocommerce-checkout #order_review table.shop_table tbody tr,
.woocommerce-checkout #order_review table.shop_table tfoot tr,
.woocommerce-checkout #order_review table.shop_table tbody tr td,
.woocommerce-checkout #order_review table.shop_table tbody tr th,
.woocommerce-checkout #order_review table.shop_table tfoot tr td,
.woocommerce-checkout #order_review table.shop_table tfoot tr th {
	background: transparent !important;
	background-color: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* border-collapse: collapse — устраняет visible gap между ячейками */
.woocommerce-checkout #order_review table.shop_table {
	border-collapse: collapse !important;
	border-spacing: 0 !important;
}

/* === Способы оплаты — внутри #order_review, без лишних разрывов === */
.woocommerce-checkout #payment {
	background: transparent !important;
	border-radius: 0 !important;
	margin-top: 14px !important;
	padding-top: 14px !important;
	border-top: 1px solid var(--pc-border);
}

.woocommerce-checkout #payment ul.payment_methods {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 0 12px !important;
	list-style: none;
}

.woocommerce-checkout #payment ul.payment_methods li {
	background: var(--pc-bg-elevated) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 14px 18px !important;
	margin: 0 0 8px !important;
	transition: border-color 0.15s ease;
}

.woocommerce-checkout #payment ul.payment_methods li:hover {
	border-color: var(--pc-accent) !important;
}

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
	margin-right: 10px;
	accent-color: var(--pc-accent);
}

.woocommerce-checkout #payment ul.payment_methods li label {
	color: var(--pc-text) !important;
	font-weight: 600 !important;
	cursor: pointer;
	font-size: 15px !important;
}

.woocommerce-checkout #payment .payment_box {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-sm) !important;
	color: var(--pc-text-muted) !important;
	padding: 14px 16px !important;
	margin-top: 12px !important;
	font-size: 13px;
}

.woocommerce-checkout #payment .payment_box::before {
	border-color: transparent transparent var(--pc-bg-card) !important;
}

.woocommerce-checkout #payment .payment_box p {
	color: var(--pc-text-muted) !important;
	margin: 0 !important;
}

/* Чекбоксы */
.woocommerce-checkout #payment .terms,
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 16px 0;
	color: var(--pc-text);
	font-size: 14px;
}

.woocommerce-checkout #payment .terms input[type="checkbox"],
.woocommerce-checkout input[type="checkbox"] {
	accent-color: var(--pc-accent);
	margin-top: 3px;
}

/* Кнопка «Оформить заказ» */
.woocommerce-checkout #place_order,
.woocommerce #place_order {
	background: var(--pc-accent) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var(--pc-radius-sm) !important;
	padding: 18px 32px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	width: 100% !important;
	margin-top: 16px !important;
	cursor: pointer;
	transition: background 0.15s ease;
}

.woocommerce-checkout #place_order:hover,
.woocommerce #place_order:hover {
	background: var(--pc-accent-hover) !important;
}

/* Блок логина в шапке чекаута */
.woocommerce-form-login {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-md) !important;
	padding: 24px !important;
	margin: 16px 0 !important;
}

.woocommerce-form-coupon {
	background: var(--pc-bg-card) !important;
	border: 1px solid var(--pc-border) !important;
	border-radius: var(--pc-radius-md) !important;
	padding: 24px !important;
	margin: 16px 0 !important;
}

/* === СТРАНИЦА «СПАСИБО ЗА ЗАКАЗ» === */

.woocommerce-order-received .woocommerce-order .woocommerce-thankyou-order-received,
.woocommerce-order-received .woocommerce-thankyou-order-received {
	color: var(--pc-text);
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 20px;
}

.woocommerce-order .woocommerce-order-overview {
	background: var(--pc-bg-card);
	border: 1px solid var(--pc-border);
	border-radius: var(--pc-radius-md);
	padding: 24px;
	list-style: none;
	margin: 24px 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 20px;
}

.woocommerce-order .woocommerce-order-overview li {
	color: var(--pc-text-muted);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	border: none !important;
	padding: 0 !important;
}

.woocommerce-order .woocommerce-order-overview li strong {
	display: block;
	color: var(--pc-text);
	font-size: 16px;
	text-transform: none;
	letter-spacing: 0;
	margin-top: 6px;
	font-weight: 700;
}

/* === АДАПТИВ === */

@media (max-width: 800px) {
	.woocommerce table.shop_table thead {
		display: none;
	}

	.woocommerce table.shop_table tr {
		display: block;
		border-bottom: 1px solid var(--pc-border);
	}

	.woocommerce table.shop_table td {
		display: flex !important;
		justify-content: space-between;
		align-items: center;
		padding: 10px 16px !important;
		border: none !important;
		border-bottom: 1px solid var(--pc-border) !important;
	}

	.woocommerce table.shop_table td::before {
		content: attr(data-title);
		font-weight: 700;
		color: var(--pc-text-muted);
		text-transform: uppercase;
		font-size: 11px;
		letter-spacing: 0.5px;
	}

	/* Кнопка × удаления — в правом верхнем углу карточки, без бордера */
	.woocommerce table.shop_table td.product-remove {
		justify-content: flex-end !important;
		padding: 10px 14px 0 !important;
		border-bottom: none !important;
	}
	.woocommerce table.shop_table td.product-remove::before {
		display: none !important;
	}

	/* Картинка товара — простой и предсказуемый паттерн
	   `display: block + text-align: center` (вместо flex, который
	   капризничает с вложенным <a>). */
	html body .woocommerce table.shop_table td.product-thumbnail {
		display: block !important;
		text-align: center !important;
		padding: 8px 16px 16px !important;
		border-bottom: none !important;
	}
	html body .woocommerce table.shop_table td.product-thumbnail::before {
		display: none !important;
		content: none !important;
	}
	html body .woocommerce table.shop_table td.product-thumbnail a {
		display: inline-block !important;
		margin: 0 auto !important;
		float: none !important;
	}
	html body .woocommerce table.shop_table td.product-thumbnail img {
		width: 140px !important;
		height: 140px !important;
		max-width: 140px !important;
		object-fit: cover !important;
		border-radius: var(--pc-radius-sm) !important;
		margin: 0 auto !important;
		display: inline-block !important;
		vertical-align: middle !important;
	}

	/* Название товара — на всю ширину по центру, без подписи «ТОВАР» */
	.woocommerce table.shop_table td.product-name {
		justify-content: center !important;
		text-align: center !important;
		padding: 0 16px 16px !important;
		font-size: 14.5px !important;
		font-weight: 600 !important;
		line-height: 1.4 !important;
		border-bottom: 1px solid var(--pc-border) !important;
	}
	.woocommerce table.shop_table td.product-name::before {
		display: none !important;
	}
	.woocommerce table.shop_table td.product-name a {
		color: var(--pc-text) !important;
	}

	/* Кнопки в actions — стек на всю ширину */
	.woocommerce table.shop_table td.actions {
		display: flex !important;
		flex-direction: column !important;
		gap: 10px !important;
		padding: 16px !important;
	}
	.woocommerce table.shop_table td.actions::before {
		display: none !important;
	}
	.woocommerce table.shop_table td.actions .coupon {
		display: flex !important;
		flex-direction: column !important;
		gap: 8px !important;
		width: 100% !important;
		margin: 0 !important;
	}
	.woocommerce table.shop_table td.actions .coupon input,
	.woocommerce table.shop_table td.actions .coupon button,
	.woocommerce table.shop_table td.actions button[name="update_cart"] {
		width: 100% !important;
		flex: 1 1 100% !important;
	}

	.cart-collaterals {
		display: block !important;
		max-width: 100% !important;
		width: 100% !important;
	}

	/* Сужаем cart_totals на мобиле — иначе space-between даёт
	   огромный gap между label и value. 360px центрировано. */
	.cart-collaterals .cart_totals {
		max-width: 360px !important;
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	/* На мобиле в .cart_totals прячем TH (дублирует label, который уже
	   есть в td::before через data-title). Высокая специфичность
	   через html body, чтобы пробить WC-default. */
	html body .cart-collaterals .cart_totals table tr th,
	html body .cart-collaterals .cart_totals .order-total th,
	html body .cart-collaterals .cart_totals .cart-subtotal th {
		display: none !important;
	}

	/* Каждый td в cart_totals — flex с одинаковым padding-left = 0,
	   чтобы label «Подытог» / «Итого» были на одной вертикали. */
	html body .cart-collaterals .cart_totals table td {
		display: flex !important;
		justify-content: space-between !important;
		align-items: center !important;
		gap: 16px !important;
		padding: 14px 4px !important;
		text-align: left !important;
	}

	/* WC-default `td::before { float: left }` ломает flex layout.
	   Принудительно отключаем float и нормализуем pseudo. */
	html body .cart-collaterals .cart_totals table td::before {
		float: none !important;
		display: inline-block !important;
		margin: 0 !important;
		text-align: left !important;
	}

	/* Для строки «Итого» — крупнее и с нужным акцентом */
	html body .cart-collaterals .cart_totals .order-total td {
		padding: 16px 4px !important;
		font-size: 16px !important;
	}

	/* На мобиле уменьшаем padding у #primary */
	html body.woocommerce-cart #primary,
	html body.woocommerce-checkout #primary,
	html body.woocommerce-order-received #primary {
		padding: 24px 16px 48px !important;
	}

	/* Мобильная таблица корзины — обёртка не должна растягиваться */
	.woocommerce table.shop_table {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.woocommerce table.shop_table .coupon {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 8px !important;
		width: 100% !important;
	}

	.woocommerce table.shop_table .coupon input[type="text"],
	.woocommerce table.shop_table .coupon input.input-text {
		flex: 1 1 100% !important;
		min-width: 0 !important;
	}

	.woocommerce-checkout .col2-set {
		display: block !important;
	}

	.woocommerce-checkout .col2-set .col-1,
	.woocommerce-checkout .col2-set .col-2 {
		width: 100% !important;
		float: none !important;
		margin-bottom: 24px;
	}
}

/* ============================================================
 *  CHECKOUT — финальная полировка (v1.7.14+)
 *  Двухколоночные поля, фикс «Итого» с nowrap, чище заголовки.
 * ============================================================ */

/* Заголовок страницы — без излишеств */
.woocommerce-checkout .entry-title {
	font-size: 28px;
	font-weight: 700;
	color: var(--pc-text);
	margin: 0 0 24px;
}

/* Заголовки секций — без красной полосы и аккуратнее */
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading {
	font-size: 17px !important;
	font-weight: 700 !important;
	color: var(--pc-text) !important;
	margin: 0 0 18px !important;
	padding-bottom: 12px !important;
	border-bottom: 1px solid var(--pc-border) !important;
	letter-spacing: 0.2px;
}

/* === Двухколоночная раскладка через FLEX-родителя ===
 * inline-block + width:calc(50%-N) ненадёжный (HTML-пробелы съедают gap).
 * Делаем родителя .woocommerce-billing-fields__field-wrapper flex-контейнером
 * с явным gap. */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 18px 18px !important;
}

/* Скрываем h3 «Комментарий к заказу» в блоке примечаний — он дублирует
   label самого textarea «Примечание к заказу (необязательно)» и сидит вне
   flex-grid колонок, ломая визуальную линию. */
.woocommerce-checkout .woocommerce-additional-fields > h3 {
	display: none !important;
}

/* Раз h3 убран — добавляем отступ сверху блоку примечаний, чтобы он не
   слипался с полем «Индекс» из блока биллинга над ним. */
.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: 28px;
}
.woocommerce-checkout .form-row {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	display: block !important;
	clear: none !important;
}
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
	flex: 1 1 calc(50% - 9px) !important;
	min-width: 0 !important;
	width: calc(50% - 9px) !important;
	max-width: calc(50% - 9px) !important;
}
.woocommerce-checkout .form-row-wide,
.woocommerce-checkout .form-row:not(.form-row-first):not(.form-row-last) {
	flex: 1 1 100% !important;
	max-width: 100% !important;
}

/* Лейблы — компактнее */
.woocommerce-checkout form .form-row label {
	font-size: 12.5px !important;
	font-weight: 600 !important;
	margin-bottom: 5px !important;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	color: var(--pc-text-muted) !important;
}

/* Инпуты — чуть тоньше padding, не такие массивные */
.woocommerce-checkout form .form-row input,
.woocommerce-checkout form .form-row textarea,
.woocommerce-checkout form .form-row select {
	padding: 11px 13px !important;
	font-size: 14px !important;
}

/* === ФИКС «Итого» — больше не переносится на 2 строки ===
 * WC по умолчанию ставит amount как block внутри узкого td.
 * Делаем nowrap + меньше шрифт чтобы не переносилось. */
.woocommerce-checkout #order_review .order-total td {
	white-space: nowrap !important;
	text-align: right !important;
}
.woocommerce-checkout #order_review .order-total td .amount,
.woocommerce-checkout #order_review .order-total td bdi {
	font-size: 20px !important;
	font-weight: 800 !important;
	white-space: nowrap !important;
	display: inline !important;
}
.woocommerce-checkout #order_review .order-total th {
	font-size: 13px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: var(--pc-text-muted) !important;
	white-space: nowrap !important;
	width: 1% !important; /* th сжимается, td забирает всю ширину */
}

/* Подытог тоже nowrap */
.woocommerce-checkout #order_review .cart-subtotal td,
.woocommerce-checkout #order_review .cart-subtotal th {
	white-space: nowrap !important;
}
.woocommerce-checkout #order_review .cart-subtotal td .amount {
	font-weight: 600 !important;
	color: var(--pc-text) !important;
}

/* Шапка таблицы заказов */
.woocommerce-checkout #order_review table.shop_table thead th {
	font-size: 11.5px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.6px !important;
	color: var(--pc-text-muted) !important;
	padding-bottom: 10px !important;
}

/* === Coupon notice — в стиле темы === */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	background: var(--pc-bg-elevated) !important;
	border: 1px solid var(--pc-border) !important;
	border-left: 3px solid var(--pc-accent) !important;
	border-radius: var(--pc-radius-sm) !important;
	color: var(--pc-text-muted) !important;
	padding: 12px 16px !important;
	font-size: 13.5px !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle a.showcoupon {
	color: var(--pc-accent) !important;
	font-weight: 600;
}

/* Фикс плавающей раскладки col-1/col-2 — clearfix */
.woocommerce-checkout .col2-set::after {
	content: '';
	display: table;
	clear: both;
}

/* === Двухколоночный layout чекаута через CSS Grid ===
 * Раньше пытались float — не сработало, потому что Astra/WC ставит display:flex
 * на форму. Grid жёстко расставляет элементы по позициям независимо от DOM-порядка.
 *
 * Структура:
 *   - Coupon notice            → grid-column 1 / -1 (на всю ширину)
 *   - #customer_details (форма) → колонка 1, занимает 2 строки
 *   - #order_review_heading     → колонка 2, строка 2
 *   - #order_review (товары)    → колонка 2, строка 3 */
@media (min-width: 901px) {
	.woocommerce-checkout form.checkout {
		display: grid !important;
		grid-template-columns: minmax(0, 55fr) minmax(0, 42fr);
		gap: 18px 32px;
		align-items: start;
	}
	.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle,
	.woocommerce-checkout form.checkout > .woocommerce-form-coupon,
	.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup,
	.woocommerce-checkout form.checkout > .woocommerce-error,
	.woocommerce-checkout form.checkout > .woocommerce-info {
		grid-column: 1 / -1 !important;
	}
	.woocommerce-checkout form.checkout > #customer_details {
		grid-column: 1 !important;
		grid-row: 2 / span 2 !important;
		float: none !important;
		width: auto !important;
	}
	/* heading и order_review объединены JS'ом (heading вставляется внутрь #order_review).
	 * В grid стоит только #order_review во второй колонке. */
	.woocommerce-checkout form.checkout > #order_review_heading {
		/* На случай если JS не отработал — heading ещё снаружи. Прячем его — он будет
		 * отрендерен внутри #order_review JS'ом. */
		display: none !important;
	}
	.woocommerce-checkout form.checkout > #order_review {
		grid-column: 2 !important;
		grid-row: 2 !important;
		float: none !important;
		width: auto !important;
		margin-top: 0 !important;
	}
	/* Когда JS переместил heading внутрь #order_review — показываем его снова. */
	.woocommerce-checkout #order_review #order_review_heading {
		display: block !important;
	}
	/* Все остальные элементы (например terms, place_order) — на всю ширину под основными колонками */
	.woocommerce-checkout form.checkout > .woocommerce-terms-and-conditions-wrapper,
	.woocommerce-checkout form.checkout > #place_order {
		grid-column: 1 / -1 !important;
	}
}

/* Mobile (<= 900px) — отключаем grid, всё друг под другом естественно */
@media (max-width: 900px) {
	.woocommerce-checkout form.checkout {
		display: block !important;
	}
	.woocommerce-checkout form.checkout > #customer_details,
	.woocommerce-checkout form.checkout > #order_review_heading,
	.woocommerce-checkout form.checkout > #order_review {
		float: none !important;
		width: 100% !important;
		margin-bottom: 24px;
	}
}

/* === Таблица заказа: НЕ ломаем названия по словам ===
 * WC шаблон cart-totals имеет узкую колонку Подытог справа, и название товара
 * слева сжимается, начиная переносить каждое слово отдельно. Чиним:
 *   - table-layout: auto (не фиксируем колонки)
 *   - продуктовая колонка: word-break: keep-all + overflow-wrap: normal
 *   - подытог колонка: width: 1% + nowrap (сжимается до контента) */
.woocommerce-checkout #order_review table.shop_table {
	table-layout: auto !important;
	width: 100% !important;
}
.woocommerce-checkout #order_review .product-name,
.woocommerce-checkout #order_review td.product-name,
.woocommerce-checkout #order_review th.product-name {
	width: auto !important;
	word-break: keep-all !important;
	overflow-wrap: normal !important;
	white-space: normal;
	padding-right: 12px !important;
	color: var(--pc-text) !important;
	font-size: 14px;
	line-height: 1.4;
}
.woocommerce-checkout #order_review .product-total,
.woocommerce-checkout #order_review td.product-total,
.woocommerce-checkout #order_review th.product-total {
	width: 1% !important;
	white-space: nowrap !important;
	text-align: right !important;
	color: var(--pc-text) !important;
}
.woocommerce-checkout #order_review .product-total bdi,
.woocommerce-checkout #order_review .product-total .amount {
	white-space: nowrap !important;
}

/* Уменьшаем внутренний padding контейнера #order_review,
 * чтобы таблица получила больше места для названий товаров. */
.woocommerce-checkout #order_review {
	padding: 20px 18px !important;
}

/* Mobile — двухколоночные поля становятся одной колонкой */
@media (max-width: 600px) {
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last {
		width: 100% !important;
		display: block;
		margin-right: 0;
	}
	.woocommerce-checkout #order_review .order-total td .amount,
	.woocommerce-checkout #order_review .order-total td bdi {
		font-size: 18px !important;
	}
	.woocommerce-checkout #order_review {
		padding: 16px 14px !important;
	}
}