/* =========================================================
   VM Brinquedos — Checkout e Carrinho
   Carregado só em is_checkout() / is_cart() (functions.php, prio 30,
   dependendo de storefront-woocommerce-style para vencer os empates).

   Checkout em 2 colunas: dados/frete à esquerda, resumo fixo à direita.
   O grid é montado por linhas explícitas porque os três blocos do
   WooCommerce (#customer_details, #order_review_heading, #order_review)
   são irmãos diretos do <form> — assim o resumo ocupa a coluna 2 nas
   duas linhas e o "sticky" cola ao rolar.
   ========================================================= */

.woocommerce-checkout .site-main,
.woocommerce-cart .site-main {
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
}

/* Título da página */
.woocommerce-checkout .entry-title,
.woocommerce-cart .entry-title {
	font-family: var(--vm-font);
	font-weight: 800;
	color: var(--vm-navy);
}

/* ── Passos de topo (opcional, decorativo) ────────────────────── */
/* Mensagens/avisos legíveis */
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-message {
	border-radius: 12px;
	border-top-color: var(--vm-amarelo);
	background: var(--vm-card);
	color: var(--vm-texto);
	font-weight: 600;
}

/* =========================================================
   CHECKOUT — grade em 2 colunas
   ========================================================= */

@media (min-width: 900px) {
	form.checkout.woocommerce-checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		column-gap: 40px;
		align-items: start;
	}

	.woocommerce-checkout form.checkout #customer_details {
		grid-column: 1;
		grid-row: 1 / span 2;
		width: auto;
		float: none;
	}

	.woocommerce-checkout form.checkout #order_review_heading {
		grid-column: 2;
		grid-row: 1;
		width: auto;
		float: none;
		margin-top: 0;
	}

	.woocommerce-checkout form.checkout #order_review {
		grid-column: 2;
		grid-row: 2;
		width: auto;
		float: none;
		position: sticky;
		top: 24px;
	}
}

/* Colunas billing/shipping empilhadas (o resumo já está do lado) */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: auto;
	float: none;
	margin: 0 0 var(--vm-s-24);
}

/* ── Cartões de seção ─────────────────────────────────────────── */

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2,
.woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-additional-fields {
	background: var(--vm-card);
	border: 1px solid var(--vm-card-borda);
	border-radius: var(--vm-radius);
	box-shadow: var(--vm-shadow);
	padding: var(--vm-s-24);
}

.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: var(--vm-s-24);
}

/* Títulos de cada bloco */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
	font-family: var(--vm-font);
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--vm-navy);
	margin: 0 0 var(--vm-s-16);
	padding-bottom: var(--vm-s-12);
	border-bottom: 2px solid var(--vm-card-borda);
}

.woocommerce-checkout #order_review_heading {
	border-bottom: none;
	padding-bottom: 0;
}

/* Checkbox "Entregar em endereço diferente" */
.woocommerce-checkout h3#ship-to-different-address {
	font-size: 1.05rem;
	border-bottom: none;
	padding-bottom: 0;
}

/* ── Campos do formulário ─────────────────────────────────────── */

.woocommerce-checkout .form-row {
	margin: 0 0 var(--vm-s-16);
	padding: 0;
}

.woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: var(--vm-s-8);
	font-weight: 700;
	font-size: 0.92rem;
	color: var(--vm-texto);
}

.woocommerce-checkout .form-row .required {
	color: var(--vm-coral-deep);
	text-decoration: none;
	border: 0;
}

.woocommerce-checkout .input-text,
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-container .select2-selection--single {
	width: 100%;
	min-height: 48px;
	padding: 0.7rem 0.9rem;
	border: 1.5px solid var(--vm-card-borda);
	border-radius: 12px;
	background: var(--vm-branco);
	color: var(--vm-ink);
	font-family: var(--vm-font);
	font-size: 1rem;
	line-height: 1.4;
	transition: border-color var(--vm-transition), box-shadow var(--vm-transition);
	box-sizing: border-box;
}

.woocommerce-checkout .select2-container .select2-selection--single {
	display: flex;
	align-items: center;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 46px;
}

.woocommerce-checkout .input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout select:focus {
	outline: none;
	border-color: var(--vm-navy);
	box-shadow: 0 0 0 3px rgba(15, 39, 73, 0.12);
}

.woocommerce-checkout .form-row textarea {
	min-height: 90px;
}

/* Duas colunas em campos curtos quando couber (nome/sobrenome etc.) */
@media (min-width: 560px) {
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last {
		width: calc(50% - 8px);
		float: left;
	}
	.woocommerce-checkout .form-row-first { margin-right: 16px; }
	.woocommerce-checkout .form-row-last { margin-right: 0; }
	.woocommerce-checkout .col-1::after,
	.woocommerce-checkout .col-2::after,
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper::after,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper::after {
		content: "";
		display: table;
		clear: both;
	}
}

/* ── Resumo do pedido (coluna direita) ────────────────────────── */

.woocommerce-checkout #order_review table.shop_table {
	border: none;
	margin: 0 0 var(--vm-s-16);
}

.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
	padding: var(--vm-s-12) 0;
	border-top: 1px solid var(--vm-card-borda);
	color: var(--vm-texto);
}

.woocommerce-checkout #order_review table.shop_table thead th {
	border-top: none;
	font-weight: 800;
	color: var(--vm-navy);
	text-transform: none;
}

.woocommerce-checkout #order_review .cart_item .product-name {
	font-weight: 700;
	color: var(--vm-texto);
}

.woocommerce-checkout #order_review .cart_item .product-total {
	text-align: right;
	white-space: nowrap;
}

.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td {
	border-top: 2px solid var(--vm-card-borda);
	font-size: 1.15rem;
}

.woocommerce-checkout #order_review .order-total .amount {
	font-weight: 800;
	color: var(--vm-navy);
}

/* ── Pagamento (Mercado Pago e outros gateways) ───────────────── */

.woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
	margin-top: var(--vm-s-16);
}

.woocommerce-checkout #payment ul.payment_methods {
	border: none;
	padding: 0;
	margin: 0 0 var(--vm-s-16);
	list-style: none;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
	margin: 0 0 var(--vm-s-12);
	padding: var(--vm-s-16);
	border: 1.5px solid var(--vm-card-borda);
	border-radius: 12px;
	background: var(--vm-branco);
	transition: border-color var(--vm-transition), box-shadow var(--vm-transition);
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:has(input:checked) {
	border-color: var(--vm-navy);
	box-shadow: 0 0 0 3px rgba(15, 39, 73, 0.1);
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
	display: inline-flex;
	align-items: center;
	gap: var(--vm-s-8);
	font-weight: 700;
	color: var(--vm-texto);
	cursor: pointer;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method img {
	max-height: 28px;
	width: auto;
	vertical-align: middle;
}

.woocommerce-checkout #payment div.payment_box {
	margin: var(--vm-s-12) 0 0;
	padding: var(--vm-s-16);
	background: var(--vm-creme);
	border-radius: 10px;
	color: var(--vm-texto);
	font-size: 0.92rem;
	line-height: 1.5;
}

.woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

/* Termos e botão finalizar */
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper {
	margin: var(--vm-s-16) 0;
	font-size: 0.9rem;
}

.woocommerce-checkout #payment #place_order,
.woocommerce-checkout #payment .place-order .button {
	display: block;
	width: 100%;
	margin-top: var(--vm-s-8);
	padding: var(--vm-s-16);
	font-size: 1.05rem;
	font-weight: 800;
	border-radius: 12px;
	background: var(--vm-amarelo);
	color: var(--vm-navy);
}

.woocommerce-checkout #payment #place_order:hover {
	background: var(--vm-navy);
	color: var(--vm-branco);
}

/* Cupom / login no topo do checkout */
.woocommerce-checkout .checkout_coupon,
.woocommerce-checkout .woocommerce-form-login {
	background: var(--vm-card);
	border: 1px solid var(--vm-card-borda);
	border-radius: var(--vm-radius);
	padding: var(--vm-s-24);
}

/* =========================================================
   CARRINHO — página cheia
   ========================================================= */

.woocommerce-cart table.cart {
	border: none;
}

.woocommerce-cart table.cart thead th {
	border-bottom: 2px solid var(--vm-card-borda);
	font-weight: 800;
	color: var(--vm-navy);
}

.woocommerce-cart table.cart td {
	border-top: 1px solid var(--vm-card-borda);
	vertical-align: middle;
}

.woocommerce-cart table.cart img {
	border-radius: 10px;
	border: 1px solid var(--vm-card-borda);
}

.woocommerce-cart table.cart td.product-name a {
	font-weight: 700;
	color: var(--vm-texto);
	text-decoration: none;
}

.woocommerce-cart .cart_totals {
	background: var(--vm-card);
	border: 1px solid var(--vm-card-borda);
	border-radius: var(--vm-radius);
	box-shadow: var(--vm-shadow);
	padding: var(--vm-s-24);
}

.woocommerce-cart .cart_totals h2 {
	font-family: var(--vm-font);
	font-weight: 800;
	color: var(--vm-navy);
	margin: 0 0 var(--vm-s-16);
}

.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	border-top: 1px solid var(--vm-card-borda);
	color: var(--vm-texto);
}

.woocommerce-cart .cart_totals .order-total .amount {
	font-weight: 800;
	color: var(--vm-navy);
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	background: var(--vm-amarelo);
	color: var(--vm-navy);
	font-weight: 800;
	border-radius: 12px;
	padding: var(--vm-s-16);
	text-align: center;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
	background: var(--vm-navy);
	color: var(--vm-branco);
}

/* Botão "Atualizar carrinho" e aplicar cupom secundários */
.woocommerce-cart .actions .button,
.woocommerce-cart .coupon .button {
	border-radius: 10px;
}