/**
 * Kairós — visual do carrinho e do checkout (mockup aprovado 04/08).
 *
 * Princípio: fundo marfim com cartões brancos — nunca branco chapado.
 * Estiliza COMPONENTES; não refaz o layout de colunas, que é do Blocksy.
 * Fonte: herda a Jost do tema.
 *
 * Respeita o que já existe:
 *  · o carrinho é EDITÁVEL quando é do cliente e travado quando veio de link do
 *    CRM (guarda `reis_cp_carrinho_travado()` no reis-carrinhos-personalizados,
 *    06/08). Por isso estilizam-se os dois casos.
 *  · snippet 6  — foto do produto no checkout (.reis-checkout-produto-com-foto)
 */

body.woocommerce-cart,
body.woocommerce-checkout {
	--k-bordo:     #9F3144;
	--k-bordo-esc: #7E2536;
	--k-bordo-luz: #FBF3F4;
	--k-tinta:     #303446;
	--k-tinta-2:   #5C6070;
	--k-tinta-3:   #868A99;
	--k-marfim:    #F7F6F4;
	--k-branco:    #FFFFFF;
	--k-linha:     rgba(48, 52, 70, .10);
	--k-linha-2:   rgba(48, 52, 70, .16);
	--k-ok:        #1E6040;
	--k-sombra:    0 1px 2px rgba(48, 52, 70, .04), 0 6px 22px rgba(48, 52, 70, .05);
}

/* ── Chão marfim ──────────────────────────────────────────────────────────── */

body.woocommerce-cart,
body.woocommerce-checkout {
	background-color: var(--k-marfim);
}

body.woocommerce-cart .site-main,
body.woocommerce-checkout .site-main,
body.woocommerce-cart .entry-content,
body.woocommerce-checkout .entry-content {
	background: transparent;
}

body.woocommerce-cart .entry-content,
body.woocommerce-checkout .entry-content {
	padding-block: 8px 40px;
}

/* ── Cartões ──────────────────────────────────────────────────────────────── */

body.woocommerce-cart .ct-woocommerce-cart-form,
body.woocommerce-cart .cart_totals,
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-checkout-review-order,
body.woocommerce-checkout #order_review {
	background: var(--k-branco);
	border: 1px solid var(--k-linha);
	border-radius: 10px;
	padding: 24px;
	box-shadow: var(--k-sombra);
}

body.woocommerce-cart .ct-woocommerce-cart-form { padding-bottom: 18px; }

/* O resumo acompanha a rolagem enquanto se preenche o formulário. */
@media (min-width: 1000px) {
	body.woocommerce-checkout #order_review,
	body.woocommerce-checkout .woocommerce-checkout-review-order {
		position: sticky;
		top: 24px;
	}
}

/* ── Títulos ──────────────────────────────────────────────────────────────── */

body.woocommerce-cart .cart_totals > h2,
body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout #order_review_heading {
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--k-linha);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -.01em;
	color: var(--k-tinta);
}

body.woocommerce-checkout #order_review_heading {
	padding: 24px 24px 12px;
	margin-bottom: 0;
	border-bottom: 0;
}

/* ── Tabela do carrinho ───────────────────────────────────────────────────── */

body.woocommerce-cart table.shop_table.cart {
	border: 0;
	border-collapse: collapse;
	margin: 0;
	background: transparent;
}

body.woocommerce-cart table.shop_table.cart thead th {
	padding: 0 8px 12px;
	border: 0;
	border-bottom: 1px solid var(--k-linha);
	background: transparent;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--k-tinta-3);
}

body.woocommerce-cart table.shop_table.cart tbody td {
	padding: 18px 8px;
	border: 0;
	border-bottom: 1px solid var(--k-linha);
	background: transparent;
	vertical-align: middle;
}

body.woocommerce-cart table.shop_table.cart tbody tr:last-child td {
	border-bottom: 0;
}

/* Foto com plinto, em vez da miniatura solta */
body.woocommerce-cart td.product-thumbnail {
	width: 88px;
	padding-right: 0 !important;
}

body.woocommerce-cart td.product-thumbnail img {
	width: 72px;
	height: 88px;
	object-fit: contain;
	border-radius: 6px;
	background: linear-gradient(160deg, #F2EFEA, #E8E3DC);
	padding: 6px;
}

/* Nome do vinho ganha hierarquia; o preço unitário vira apoio */
body.woocommerce-cart td.product-name > a {
	display: block;
	font-size: 15.5px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--k-tinta);
	text-decoration: none;
}

body.woocommerce-cart td.product-name > a:hover { color: var(--k-bordo); }

body.woocommerce-cart td.product-name .price {
	margin: 5px 0 0;
	font-size: 12.5px;
	color: var(--k-tinta-3);
}

body.woocommerce-cart td.product-name .price::after {
	content: " a garrafa";
}

/* Quantidade: o snippet 8 fixa-a, então é um selo, não um campo */
body.woocommerce-cart .quantidade-fixa-carrinho {
	display: inline-block;
	min-width: 40px;
	padding: 6px 12px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-marfim);
	font-size: 14.5px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	text-align: center;
	color: var(--k-tinta);
}

body.woocommerce-cart td.product-subtotal {
	text-align: right;
	font-size: 16px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--k-tinta);
	white-space: nowrap;
}

/* No carrinho travado a coluna de remover fica vazia — não ocupar espaço com
   ela. Quando o X existe, a coluna volta a medir-se sozinha. */
body.woocommerce-cart td.product-remove:empty {
	width: 0;
	padding: 0 !important;
}

/* ── Carrinho editável (o cliente montou) ─────────────────────────────────── */

/**
 * O Blocksy monta o `− 6 +` com as setas em `position:absolute` dentro de um
 * `div.quantity` que é `inline-block` e tem largura/altura por variável. NÃO
 * lhe mudar o `display` — a moldura vai no CONTENTOR e o campo fica sem
 * contorno lá dentro.
 */
body.woocommerce-cart td.product-quantity .quantity {
	width: 108px;
	height: 42px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-branco);
	overflow: hidden;
}

body.woocommerce-cart td.product-quantity .quantity:focus-within {
	border-color: var(--k-bordo);
	outline: 2px solid rgba(159, 49, 68, .16);
}

body.woocommerce-cart td.product-quantity input.qty {
	width: 100%;
	height: 100%;
	padding: 0 30px;
	border: 0;
	background: transparent;
	font-size: 14.5px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	text-align: center;
	color: var(--k-tinta);
}

body.woocommerce-cart td.product-quantity input.qty:focus { outline: 0; }

/* As setas herdam o bordô dos botões do tema — aqui são controlo, não CTA. */
body.woocommerce-cart td.product-quantity .ct-increase,
body.woocommerce-cart td.product-quantity .ct-decrease {
	top: 0;
	height: 100%;
	width: 30px;
	max-width: 30px;
	background: transparent;
	color: var(--k-tinta-3);
}

body.woocommerce-cart td.product-quantity .ct-increase:hover,
body.woocommerce-cart td.product-quantity .ct-decrease:hover {
	background: var(--k-marfim);
	color: var(--k-tinta);
}

/* Remover item: discreto, e nunca vermelho — a remoção é reversível. */
body.woocommerce-cart td.product-remove a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: transparent;
	color: var(--k-tinta-3) !important;
	font-size: 19px;
	line-height: 1;
	text-decoration: none;
	transition: background .15s, color .15s;
}

body.woocommerce-cart td.product-remove a.remove:hover,
body.woocommerce-cart td.product-remove a.remove:focus-visible {
	background: var(--k-marfim);
	color: var(--k-tinta) !important;
}

/**
 * "Atualizar carrinho" só ganha vida quando há algo para atualizar.
 * O tema pinta TODOS os `button` com `background-color: … !important` — a mesma
 * armadilha que pintava as setas do carrossel de bordô. Daí o !important aqui:
 * este é um botão secundário, não pode competir com «Continuar para Finalização».
 */
body.woocommerce-cart button[name="update_cart"] {
	padding: 11px 20px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: transparent !important;
	color: var(--k-tinta-2) !important;
	font-size: 14px;
	font-weight: 400;
	transition: background .15s, color .15s, opacity .15s;
}

body.woocommerce-cart button[name="update_cart"]:disabled { opacity: .45; cursor: default; }

body.woocommerce-cart button[name="update_cart"]:not(:disabled):hover {
	background: var(--k-marfim) !important;
	color: var(--k-tinta) !important;
}

/* ── Cupom ────────────────────────────────────────────────────────────────── */

body.woocommerce-cart td.actions {
	padding: 20px 8px 4px !important;
	border-bottom: 0 !important;
}

body.woocommerce-cart .coupon {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: center;
	padding-top: 18px;
	border-top: 1px dashed var(--k-linha-2);
}

body.woocommerce-cart .coupon input#coupon_code {
	flex: 1 1 200px;
	min-width: 0;
	padding: 11px 13px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-branco);
	font-size: 14px;
	color: var(--k-tinta);
}

body.woocommerce-cart .coupon input#coupon_code::placeholder { color: var(--k-tinta-3); }

/* ── Totais ───────────────────────────────────────────────────────────────── */

body.woocommerce-cart .cart_totals table.shop_table {
	border: 0;
	border-collapse: collapse;
	margin: 0;
	background: transparent;
}

body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
	padding: 12px 0;
	border: 0;
	border-bottom: 1px solid var(--k-linha);
	background: transparent;
	font-size: 14.5px;
	font-weight: 400;
	color: var(--k-tinta-2);
}

body.woocommerce-cart .cart_totals table.shop_table td {
	text-align: right;
	font-variant-numeric: tabular-nums;
	color: var(--k-tinta);
}

/* O total é o número que se procura de relance */
body.woocommerce-cart .cart_totals tr.order-total th,
body.woocommerce-cart .cart_totals tr.order-total td {
	padding-top: 16px;
	border-bottom: 0;
	border-top: 2px solid var(--k-tinta);
	font-weight: 500;
	color: var(--k-tinta);
}

body.woocommerce-cart .cart_totals tr.order-total td .woocommerce-Price-amount {
	font-size: 25px;
	font-weight: 500;
	letter-spacing: -.01em;
	color: var(--k-bordo);
}

/* A linha do envio ocupa as duas colunas — não pode herdar o alinhamento à direita */
body.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals td,
body.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals th {
	text-align: left;
}

body.woocommerce-cart .cart_totals .ct-shipping-heading {
	margin-bottom: 6px;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--k-tinta-3);
}

body.woocommerce-cart .woocommerce-shipping-methods {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.woocommerce-cart .woocommerce-shipping-methods li {
	margin: 0 0 4px;
	font-size: 14.5px;
	color: var(--k-tinta);
}

body.woocommerce-cart .woocommerce-shipping-destination {
	margin: 6px 0 0;
	font-size: 12.5px;
	color: var(--k-tinta-3);
}

body.woocommerce-cart .shipping-calculator-button {
	display: inline-block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--k-bordo);
}

/* ── Botões ───────────────────────────────────────────────────────────────── */

body.woocommerce-cart .checkout-button,
body.woocommerce-checkout #place_order {
	display: block;
	width: 100%;
	margin-top: 18px;
	padding: 15px 20px;
	border: 0;
	border-radius: 8px;
	background: var(--k-bordo);
	color: #fff;
	font-size: 15.5px;
	font-weight: 500;
	letter-spacing: .01em;
	line-height: 1.3;
	text-align: center;
	transition: background .18s, transform .06s;
}

body.woocommerce-cart .checkout-button:hover,
body.woocommerce-checkout #place_order:hover {
	background: var(--k-bordo-esc);
	color: #fff;
}

body.woocommerce-cart .checkout-button:active,
body.woocommerce-checkout #place_order:active { transform: translateY(1px); }

body.woocommerce-cart .checkout-button:focus-visible,
body.woocommerce-checkout #place_order:focus-visible {
	outline: 2px solid var(--k-bordo);
	outline-offset: 3px;
}

/* Botão secundário (aplicar cupom) fica discreto */
body.woocommerce-cart .coupon button.button {
	padding: 11px 20px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: transparent;
	color: var(--k-tinta-2);
	font-size: 14px;
	font-weight: 400;
	white-space: nowrap;
	transition: background .15s, color .15s;
}

body.woocommerce-cart .coupon button.button:hover {
	background: var(--k-marfim);
	color: var(--k-tinta);
	border-color: var(--k-linha-2);
}

/* ── Campos do checkout ───────────────────────────────────────────────────── */

/**
 * O WooCommerce clássico posiciona os campos com `float` (form-row-first /
 * form-row-last). Floats não são contidos pelo cartão, e por isso os campos
 * transbordavam para fora do fundo branco e os campos de conta ficavam
 * espremidos numa coluna de dois dedos. Grelha resolve os dois de uma vez.
 */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
	grid-column: 1 / -1;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first { grid-column: 1; }
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last  { grid-column: 2; }

@media (max-width: 600px) {
	body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
		grid-template-columns: 1fr;
	}
	body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first,
	body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last {
		grid-column: 1 / -1;
	}
}

/* Cinto e suspensórios: qualquer float restante fica contido no cartão. */
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-account-fields {
	display: flow-root;
}

/* Criar conta: cartão próprio, abaixo dos dados de cobrança */
body.woocommerce-checkout .woocommerce-account-fields {
	clear: both;
	margin-top: 18px;
	padding: 20px 24px;
	background: var(--k-branco);
	border: 1px solid var(--k-linha);
	border-radius: 10px;
	box-shadow: var(--k-sombra);
}

body.woocommerce-checkout .woocommerce-account-fields .form-row {
	float: none;
	width: auto;
	margin: 0 0 12px;
	padding: 0;
}

body.woocommerce-checkout .woocommerce-account-fields .form-row:last-child { margin-bottom: 0; }

body.woocommerce-checkout .woocommerce-account-fields label {
	font-size: 14px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--k-tinta-2);
}

body.woocommerce-checkout .woocommerce-account-fields input.input-text {
	width: 100%;
	padding: 12px 13px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-branco);
	font-size: 15px;
	color: var(--k-tinta);
}

body.woocommerce-checkout .woocommerce-account-fields input.input-text:focus {
	outline: 0;
	border-color: var(--k-bordo);
	box-shadow: 0 0 0 3px rgba(159, 49, 68, .12);
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper label {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--k-tinta-2);
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper label .required {
	color: var(--k-bordo);
	border: 0;
	text-decoration: none;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper input.input-text,
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper select {
	width: 100%;
	padding: 12px 13px;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-branco);
	font-size: 15px;
	color: var(--k-tinta);
	transition: border-color .15s, box-shadow .15s;
}

/**
 * O "Brasil" saía cortado ao meio: o tema fixa uma altura ao <select> e o
 * texto não cabia com o preenchimento novo. Altura automática resolve, e a
 * seta fica desenhada à mão porque `appearance:none` remove a nativa.
 */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper select {
	appearance: none;
	-webkit-appearance: none;
	height: auto;
	min-height: 0;
	line-height: 1.5;
	padding-right: 38px;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%235C6070' stroke-width='1.6' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 12px 8px;
	text-overflow: ellipsis;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper input.input-text:focus,
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper select:focus {
	outline: 0;
	border-color: var(--k-bordo);
	box-shadow: 0 0 0 3px rgba(159, 49, 68, .12);
}

/* Campo vindo do CRM: bloqueado, e que se veja que é */
body.woocommerce-checkout .cc-campo-bloqueado input[readonly] {
	background: #F4F3F1 !important;
	border-color: var(--k-linha) !important;
	color: var(--k-tinta-2) !important;
}

/* ── Resumo do pedido ─────────────────────────────────────────────────────── */

body.woocommerce-checkout table.woocommerce-checkout-review-order-table {
	border: 0;
	border-collapse: collapse;
	margin: 0;
	background: transparent;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
	padding: 0 0 10px;
	border: 0;
	border-bottom: 1px solid var(--k-linha);
	background: transparent;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--k-tinta-3);
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table td,
body.woocommerce-checkout .woocommerce-checkout-review-order-table th {
	padding: 12px 0;
	border: 0;
	border-bottom: 1px solid var(--k-linha);
	background: transparent;
	font-size: 14px;
	font-weight: 400;
	color: var(--k-tinta-2);
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name {
	color: var(--k-tinta);
	line-height: 1.4;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .product-total,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td:last-child {
	text-align: right;
	font-variant-numeric: tabular-nums;
	color: var(--k-tinta);
	white-space: nowrap;
}

/* Foto do produto (snippet 6) alinhada ao resto */
body.woocommerce-checkout .reis-checkout-foto img {
	border-radius: 5px;
	background: linear-gradient(160deg, #F2EFEA, #E8E3DC);
	object-fit: contain !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td {
	padding-top: 16px;
	border-bottom: 0;
	border-top: 2px solid var(--k-tinta);
	font-weight: 500;
	color: var(--k-tinta);
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total .woocommerce-Price-amount {
	font-size: 25px;
	font-weight: 500;
	letter-spacing: -.01em;
	color: var(--k-bordo);
}

/* ── Formas de pagamento ──────────────────────────────────────────────────── */

body.woocommerce-checkout ul.wc_payment_methods {
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 10px;
	border: 0;
}

body.woocommerce-checkout li.wc_payment_method {
	margin: 0;
	padding: 0;
	border: 1px solid var(--k-linha-2);
	border-radius: 8px;
	background: var(--k-branco);
	transition: border-color .15s, background .15s;
}

body.woocommerce-checkout li.wc_payment_method:hover {
	border-color: rgba(159, 49, 68, .4);
}

body.woocommerce-checkout li.wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 15px;
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--k-tinta);
	cursor: pointer;
}

/**
 * O círculo de escolha ficava lavado: o tema desenha-o com uma borda muito
 * clara e sem preenchimento. Aqui ganha borda visível e miolo bordô cheio.
 */
body.woocommerce-checkout li.wc_payment_method input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	margin: 0;
	flex: 0 0 auto;
	border: 2px solid #A9AEBB;
	border-radius: 50%;
	background: #fff;
	display: grid;
	place-content: center;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s;
}

body.woocommerce-checkout li.wc_payment_method input[type="radio"]::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--k-bordo);
	transform: scale(0);
	transition: transform .12s ease-in-out;
}

body.woocommerce-checkout li.wc_payment_method input[type="radio"]:checked {
	border-color: var(--k-bordo);
}

body.woocommerce-checkout li.wc_payment_method input[type="radio"]:checked::before {
	transform: scale(1);
}

body.woocommerce-checkout li.wc_payment_method input[type="radio"]:hover {
	border-color: var(--k-bordo);
}

body.woocommerce-checkout li.wc_payment_method input[type="radio"]:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 3px rgba(159, 49, 68, .22);
}

/* O rótulo da forma escolhida também ganha peso. */
body.woocommerce-checkout li.wc_payment_method:has(input:checked) > label {
	color: var(--k-bordo);
	font-weight: 600;
}

body.woocommerce-checkout li.wc_payment_method:has(input:checked) {
	border-color: var(--k-bordo);
	background: var(--k-bordo-luz);
}

body.woocommerce-checkout .payment_box {
	margin: 0 15px 15px;
	padding: 13px 15px;
	border-radius: 6px;
	background: rgba(48, 52, 70, .04);
	font-size: 13px;
	line-height: 1.55;
	color: var(--k-tinta-2);
}

body.woocommerce-checkout .payment_box::before { display: none; }

body.woocommerce-checkout .payment_box p:last-child { margin-bottom: 0; }

/* Os campos do cartão têm o seu próprio desenho — só o mínimo aqui */
body.woocommerce-checkout .payment_box input.input-text,
body.woocommerce-checkout .payment_box select {
	padding: 10px 12px;
	border: 1px solid var(--k-linha-2);
	border-radius: 6px;
	background: var(--k-branco);
	font-size: 14px;
}

/* ── Aceite dos termos ────────────────────────────────────────────────────── */

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
	margin-top: 18px;
	padding: 14px;
	border-radius: 8px;
	background: var(--k-marfim);
	font-size: 13px;
	line-height: 1.55;
	color: var(--k-tinta-2);
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
	color: var(--k-bordo);
}

body.woocommerce-checkout .form-row.validate-required .woocommerce-terms-and-conditions-checkbox-text {
	font-size: 13px;
}

body.woocommerce-checkout .woocommerce-privacy-policy-text p {
	margin: 0 0 10px;
	font-size: 12.5px;
	color: var(--k-tinta-3);
}

/* ── Avisos ───────────────────────────────────────────────────────────────── */

/**
 * O banner vermelho de erro do tema fica como está — o Gustavo aprovou-o
 * expressamente («ficou um visual bom e interativo»). Não se mexe.
 * Aqui só se tratam as mensagens informativas e de sucesso.
 */
body.woocommerce-cart .woocommerce-message,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-cart .woocommerce-info:not(.cart-empty),
body.woocommerce-checkout .woocommerce-info {
	border-radius: 8px;
	border: 1px solid var(--k-linha);
	border-left: 3px solid var(--k-bordo);
	background: var(--k-branco);
	box-shadow: var(--k-sombra);
	font-size: 14px;
	color: var(--k-tinta-2);
}

/* ── Carrinho vazio ───────────────────────────────────────────────────────── */

/**
 * Era uma tela quase toda branca com um aviso cinzento perdido no topo.
 * Passa a ser um cartão centrado que convida a voltar à loja.
 */
body.woocommerce-cart .woocommerce:has(> .cart-empty) {
	max-width: 560px;
	margin: 30px auto 60px;
	padding: 44px 32px 36px;
	background: var(--k-branco);
	border: 1px solid var(--k-linha);
	border-radius: 12px;
	box-shadow: var(--k-sombra);
	text-align: center;
}

body.woocommerce-cart .cart-empty {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	font-size: 19px;
	font-weight: 400;
	color: var(--k-tinta);
}

/* O tema mete um ícone de sino; num carrinho vazio uma taça diz mais. */
body.woocommerce-cart .cart-empty svg { display: none; }

body.woocommerce-cart .cart-empty::before {
	content: "🍷";
	display: block;
	margin-bottom: 16px;
	font-size: 42px;
	line-height: 1;
}

body.woocommerce-cart .cart-empty::after {
	content: "Vinhos franceses selecionados na origem, já no Brasil.";
	display: block;
	margin-top: 10px;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--k-tinta-2);
}

body.woocommerce-cart .return-to-shop {
	margin: 24px 0 0;
	text-align: center;
}

body.woocommerce-cart .return-to-shop .button {
	display: inline-block;
	width: auto;
	padding: 14px 30px;
	border: 0;
	border-radius: 8px;
	background: var(--k-bordo);
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	transition: background .18s;
}

body.woocommerce-cart .return-to-shop .button:hover {
	background: var(--k-bordo-esc);
	color: #fff;
}

/* ── Telemóvel ────────────────────────────────────────────────────────────── */

/**
 * Telemóvel e tablet.
 *
 * O Blocksy já trata a tabela: abaixo de 1000px esconde as colunas de preço,
 * quantidade, subtotal e remover, e mostra `.product-mobile-actions` debaixo do
 * nome. Isso já funciona — aqui só se ajusta o acabamento, sem refazer o layout.
 */
@media (max-width: 999.98px) {
	body.woocommerce-cart td.product-thumbnail img {
		width: 64px;
		height: 78px;
	}

	body.woocommerce-cart .product-mobile-actions {
		font-size: 14.5px;
		font-variant-numeric: tabular-nums;
		color: var(--k-tinta);
	}

	body.woocommerce-cart .product-mobile-actions .quantity {
		width: 96px;
		height: 38px;
	}

	body.woocommerce-cart .product-mobile-actions input.qty {
		padding: 0 27px;
		font-size: 13.5px;
	}

	body.woocommerce-cart .product-mobile-actions .quantidade-fixa-carrinho {
		min-width: 34px;
		padding: 4px 9px;
		font-size: 13.5px;
	}
}

@media (max-width: 767px) {
	body.woocommerce-cart .ct-woocommerce-cart-form,
	body.woocommerce-cart .cart_totals,
	body.woocommerce-checkout .woocommerce-billing-fields,
	body.woocommerce-checkout .woocommerce-account-fields,
	body.woocommerce-checkout .woocommerce-checkout-review-order,
	body.woocommerce-checkout #order_review {
		padding: 18px 16px;
		border-radius: 8px;
	}

	body.woocommerce-cart table.shop_table.cart tbody td { padding: 14px 6px; }

	body.woocommerce-cart .coupon { flex-direction: column; align-items: stretch; }
	body.woocommerce-cart .coupon button.button { width: 100%; }

	/* O total continua a ser o número que se procura, mesmo em ecrã pequeno */
	body.woocommerce-cart .cart_totals tr.order-total td .woocommerce-Price-amount,
	body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total .woocommerce-Price-amount {
		font-size: 22px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.woocommerce-cart *,
	body.woocommerce-checkout * { transition: none !important; }
}

/* ── Aviso de frete ───────────────────────────────────────────────────────── */

body.woocommerce-cart .kairos-frete-aviso,
body.woocommerce-checkout .kairos-frete-aviso {
	margin: 0 0 6px;
	padding: 11px 13px;
	font-size: 13px;
	line-height: 1.5;
	border-radius: 8px;
	background: var(--k-marfim);
	border: 1px solid var(--k-linha);
	border-left: 3px solid var(--k-bordo);
	box-shadow: none;
	color: var(--k-tinta-2);
}

/* O telefone estava a partir-se ao meio entre linhas. */
.kairos-nowrap {
	white-space: nowrap;
	color: var(--k-bordo);
}

/* Etiqueta do método de entrega escolhido */
body.woocommerce-cart .woocommerce-shipping-methods li label,
body.woocommerce-checkout .woocommerce-shipping-methods li label {
	font-size: 14.5px;
	color: var(--k-tinta);
}

body.woocommerce-cart .woocommerce-shipping-methods .amount,
body.woocommerce-checkout .woocommerce-shipping-methods .amount {
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}

/* ── Página de pedido recebido ────────────────────────────────────────────── */

body.woocommerce-order-received {
	background-color: var(--k-marfim);
}

.kairos-pedido {
	max-width: 620px;
	margin: 20px auto 34px;
	padding: 40px 32px 32px;
	background: var(--k-branco);
	border: 1px solid var(--k-linha);
	border-top: 4px solid var(--k-tinta-3);
	border-radius: 12px;
	box-shadow: var(--k-sombra);
	text-align: center;
}

.kairos-pedido--ok     { border-top-color: #1E6040; }
.kairos-pedido--espera { border-top-color: #C9892F; }
.kairos-pedido--erro   { border-top-color: var(--k-bordo); }

.kairos-pedido__icone {
	width: 78px;
	height: 78px;
	margin: 0 auto 20px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-size: 40px;
	line-height: 1;
	color: #fff;
	background: var(--k-tinta-3);
}

.kairos-pedido--ok     .kairos-pedido__icone { background: #1E6040; }
.kairos-pedido--espera .kairos-pedido__icone { background: #C9892F; }
.kairos-pedido--erro   .kairos-pedido__icone { background: var(--k-bordo); }

.kairos-pedido__titulo {
	margin: 0 0 12px;
	font-size: 27px;
	font-weight: 500;
	letter-spacing: -.01em;
	color: var(--k-tinta);
}

.kairos-pedido__texto {
	margin: 0 auto;
	max-width: 46ch;
	font-size: 15px;
	line-height: 1.65;
	color: var(--k-tinta-2);
}

.kairos-pedido__dados {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 30px;
	margin: 26px 0 0;
	padding-top: 22px;
	border-top: 1px solid var(--k-linha);
}

.kairos-pedido__dados div { text-align: center; }

.kairos-pedido__dados dt {
	margin: 0 0 3px;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--k-tinta-3);
}

.kairos-pedido__dados dd {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--k-tinta);
}

.kairos-pedido__botao {
	display: inline-block;
	margin-top: 22px;
	padding: 14px 30px;
	border-radius: 8px;
	background: var(--k-bordo);
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background .18s;
}

.kairos-pedido__botao:hover { background: var(--k-bordo-esc); color: #fff; }

/* O resto da página (detalhes do pedido, QR do Pix) fica em cartão também. */
body.woocommerce-order-received .woocommerce-order > *:not(.kairos-pedido) {
	max-width: 760px;
	margin-inline: auto;
}

body.woocommerce-order-received .woocommerce-order-details,
body.woocommerce-order-received .woocommerce-customer-details,
body.woocommerce-order-received .woocommerce-order-overview {
	padding: 24px;
	background: var(--k-branco);
	border: 1px solid var(--k-linha);
	border-radius: 10px;
	box-shadow: var(--k-sombra);
	margin-bottom: 18px;
}

@media (max-width: 600px) {
	.kairos-pedido { padding: 30px 20px 26px; margin-inline: 4px; }
	.kairos-pedido__titulo { font-size: 22px; }
	.kairos-pedido__icone { width: 64px; height: 64px; font-size: 32px; }
}

/* ── Campos do cartão de crédito (Cielo) ─────────────────────────────────── */
/**
 * O plugin desenha os campos como um sublinhado fininho sobre fundo cinzento —
 * no telemóvel mal se vê onde escrever. Aqui viram caixas brancas com borda.
 */
body.woocommerce-checkout .payment_box.payment_method_lkn_cielo_credit {
	background: #fff;
	border: 1px solid var(--k-linha-2);
}

body.woocommerce-checkout .payment_method_lkn_cielo_credit .form-row {
	margin-bottom: 14px;
}

body.woocommerce-checkout .payment_method_lkn_cielo_credit label {
	display: block;
	margin-bottom: 6px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--k-tinta);
}

body.woocommerce-checkout .payment_method_lkn_cielo_credit input,
body.woocommerce-checkout .payment_method_lkn_cielo_credit select {
	width: 100%;
	padding: 12px 13px !important;
	border: 1px solid #A9AEBB !important;
	border-radius: 8px !important;
	background: #fff !important;
	font-size: 15px !important;
	color: var(--k-tinta) !important;
	box-shadow: none !important;
	transition: border-color .15s, box-shadow .15s;
}

body.woocommerce-checkout .payment_method_lkn_cielo_credit input::placeholder {
	color: var(--k-tinta-3);
}

body.woocommerce-checkout .payment_method_lkn_cielo_credit input:focus,
body.woocommerce-checkout .payment_method_lkn_cielo_credit select:focus {
	outline: 0;
	border-color: var(--k-bordo) !important;
	box-shadow: 0 0 0 3px rgba(159, 49, 68, .14) !important;
}

/* O aviso "Pagamento processado pela Cielo" é apoio, não título. */
body.woocommerce-checkout .payment_method_lkn_cielo_credit .credit-card-description {
	margin-bottom: 16px;
	font-size: 12px;
	color: var(--k-tinta-3);
}
