/* ==========================================================================
   05 · CARRITO, CHECKOUT Y PÁGINA DE GRACIAS
   ========================================================================== */

/* --------------------------------------------------------------------------
   Tabla del carrito
   -------------------------------------------------------------------------- */
.mp-tema .woocommerce-cart-form table.shop_table {
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde);
	border-radius: var(--mp-radio);
}
.mp-tema .woocommerce-cart-form table.shop_table thead th {
	padding: 14px 12px;
	background: var(--mp-superficie-2);
	font-size: .88rem;
}
.mp-tema .woocommerce-cart-form .product-thumbnail img {
	width: 76px;
	padding: 4px;
	background: #fff;
	border-radius: var(--mp-radio);
}
.mp-tema .woocommerce-cart-form .product-name a {
	font-family: var(--mp-f-ui);
	font-size: 1.08rem;
	font-weight: 600;
	color: var(--mp-blanco);
	text-decoration: none;
}
.mp-tema .woocommerce-cart-form .product-name a:hover { color: var(--mp-verde); }
.mp-tema .woocommerce-cart-form .product-subtotal .amount { color: var(--mp-verde); }

/* Botón eliminar */
.mp-tema .woocommerce a.remove,
.mp-tema a.remove {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border: 1px solid var(--mp-borde-fuerte);
	border-radius: 50%;
	color: var(--mp-texto-suave) !important;
	font-weight: 400;
	line-height: 1;
}
.mp-tema .woocommerce a.remove:hover,
.mp-tema a.remove:hover {
	background: var(--mp-rojo) !important;
	border-color: var(--mp-rojo);
	color: var(--mp-blanco) !important;
}

/* Cupón + actualizar */
.mp-tema .woocommerce-cart-form .actions .coupon { display: flex; gap: 8px; flex-wrap: wrap; }
.mp-tema .woocommerce-cart-form .actions .coupon .input-text { min-width: 180px; }
.mp-tema .woocommerce-cart-form .actions button[name="update_cart"] {
	background: transparent;
	color: var(--mp-texto);
	box-shadow: inset 0 0 0 2px var(--mp-borde-fuerte);
	clip-path: none;
}
.mp-tema .woocommerce-cart-form .actions button[name="update_cart"]:not(:disabled):hover {
	color: var(--mp-verde);
	box-shadow: inset 0 0 0 2px var(--mp-verde);
}

/* Ayuda bajo la tabla */
.mp-carrito-ayuda {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 20px;
	margin: 14px 0 2rem;
	font-family: var(--mp-f-ui);
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	font-size: .95rem;
}
.mp-carrito-ayuda a { text-decoration: none; }
.mp-link-volver { color: var(--mp-texto) !important; }
.mp-link-volver:hover { color: var(--mp-verde) !important; }
.mp-link-wa { display: inline-flex; align-items: center; gap: 8px; }
.mp-link-wa svg { width: 18px; height: 18px; }

/* Totales */
.mp-tema .cart-collaterals .cart_totals,
.mp-tema .woocommerce .cart-collaterals .cart_totals {
	padding: 22px;
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde);
	border-top: 4px solid var(--mp-verde);
}
.mp-tema .cart_totals > h2 { font-size: 1.4rem; margin-bottom: 1rem; }
.mp-tema .cart_totals table.shop_table { border: 0; }
.mp-tema .cart_totals table.shop_table th,
.mp-tema .cart_totals table.shop_table td { padding: 12px 0; background: transparent; }
.mp-tema .cart_totals .order-total .amount { font-size: 1.5rem; color: var(--mp-verde); }
.mp-tema .wc-proceed-to-checkout { padding-bottom: 0; }
.mp-tema .wc-proceed-to-checkout .checkout-button {
	width: 100%;
	min-height: 56px;
	font-size: 1.15rem !important;
}
.mp-tema .woocommerce-shipping-methods li { margin-bottom: 6px; }
.mp-tema .woocommerce-shipping-calculator .shipping-calculator-button { font-size: .9rem; }

/* Carrito vacío */
.mp-tema .cart-empty.woocommerce-info {
	padding: 28px;
	text-align: center;
	font-family: var(--mp-f-ui);
	font-size: 1.3rem;
	text-transform: uppercase;
	letter-spacing: .05em;
	border-left-width: 1px;
}
.mp-tema .cart-empty.woocommerce-info::before { display: none; }
.mp-tema .return-to-shop { text-align: center; }

/* Cross-sells */
.mp-tema .cross-sells > h2 { font-size: 1.4rem; }

/* --------------------------------------------------------------------------
   Checkout
   -------------------------------------------------------------------------- */
.mp-tema .woocommerce-form-coupon-toggle .woocommerce-info,
.mp-tema .woocommerce-form-login-toggle .woocommerce-info { font-size: .95rem; }
.mp-tema form.checkout_coupon,
.mp-tema form.woocommerce-form-login {
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde) !important;
	border-radius: var(--mp-radio);
}

.mp-tema form.checkout #customer_details h3,
.mp-tema form.checkout #order_review_heading,
.mp-tema .woocommerce-billing-fields > h3,
.mp-tema .woocommerce-shipping-fields h3,
.mp-tema .woocommerce-additional-fields > h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.35rem;
	margin-bottom: 1rem;
}
.mp-tema .woocommerce-billing-fields > h3::before,
.mp-tema #order_review_heading::before {
	content: "";
	width: 14px;
	height: 14px;
	background: var(--mp-verde);
	transform: skewX(-20deg);
	flex: none;
}
.mp-tema .woocommerce-billing-fields,
.mp-tema .woocommerce-shipping-fields,
.mp-tema .woocommerce-additional-fields {
	padding: 22px;
	margin-bottom: 18px;
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde);
}
.mp-tema .woocommerce form .form-row { margin-bottom: 14px; }
.mp-tema #ship-to-different-address label { text-transform: none; font-size: 1rem; }

/* Resumen del pedido */
.mp-tema #order_review,
.mp-tema .woocommerce-checkout-review-order {
	padding: 22px;
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde);
	border-top: 4px solid var(--mp-verde);
}
.mp-tema .woocommerce-checkout-review-order-table th,
.mp-tema .woocommerce-checkout-review-order-table td {
	padding: 12px 0 !important;
	background: transparent !important;
}
.mp-tema .woocommerce-checkout-review-order-table .product-name { color: var(--mp-blanco); }
.mp-tema .woocommerce-checkout-review-order-table .order-total .amount { font-size: 1.5rem; color: var(--mp-verde); }

/* Aviso de pago seguro */
.mp-pago-seguro {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 18px 0 12px;
	padding: 14px;
	background: var(--mp-verde-suave);
	border: 1px solid rgba(11, 219, 45, .35);
}
.mp-pago-seguro svg { width: 24px; height: 24px; color: var(--mp-verde); flex: none; }
.mp-pago-seguro p { margin: 0; font-size: .92rem; color: var(--mp-texto); }
.mp-pago-seguro strong { color: var(--mp-blanco); }

/* Medios de pago (Webpay, Mercado Pago) */
.mp-tema #payment,
.mp-tema .woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
}
.mp-tema #payment ul.payment_methods {
	padding: 0;
	border: 0;
}
.mp-tema #payment ul.payment_methods li {
	margin-bottom: 8px;
	padding: 14px 16px;
	background: var(--mp-superficie-2);
	border: 1px solid var(--mp-borde-fuerte);
	list-style: none;
	transition: border-color var(--mp-trans);
}
.mp-tema #payment ul.payment_methods li:has(input:checked) {
	border-color: var(--mp-verde);
	box-shadow: inset 3px 0 0 var(--mp-verde);
}
.mp-tema #payment ul.payment_methods li > label {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-family: var(--mp-f-ui);
	font-size: 1.05rem;
	text-transform: none;
	color: var(--mp-blanco);
	cursor: pointer;
}
.mp-tema #payment ul.payment_methods li img {
	max-height: 28px;
	width: auto;
	padding: 3px 6px;
	background: #fff;
	border-radius: 3px;
	margin-left: 4px;
}
.mp-tema #payment div.payment_box {
	margin: 12px 0 0;
	padding: 12px 14px;
	background: var(--mp-negro);
	color: var(--mp-texto);
	font-size: .92rem;
	border-radius: 0;
}
.mp-tema #payment div.payment_box::before { border-bottom-color: var(--mp-negro); }
.mp-tema #payment .place-order { padding: 16px 0 0 !important; }
.mp-tema .woocommerce-terms-and-conditions-wrapper { font-size: .9rem; color: var(--mp-texto-suave); }
.mp-tema #place_order {
	width: 100%;
	min-height: 58px;
	font-size: 1.2rem !important;
}

/* --------------------------------------------------------------------------
   Página de gracias / pedido recibido
   -------------------------------------------------------------------------- */
.mp-gracias {
	margin: 0 0 2rem;
	padding: 32px 28px;
	background:
		linear-gradient(120deg, var(--mp-verde-suave), transparent 55%),
		var(--mp-superficie);
	border: 1px solid var(--mp-borde);
	border-left: 5px solid var(--mp-verde);
}
.mp-gracias h2 { font-size: clamp(1.6rem, 4vw, 2.4rem); margin-bottom: .4em; }
.mp-gracias p { color: var(--mp-texto); }
.mp-gracias__acciones { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 1.25rem; }

/* Ocultamos el texto por defecto de WooCommerce (ya lo dice la caja verde) */
.mp-tema .woocommerce-thankyou-order-received { display: none; }

.mp-tema ul.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1px;
	margin: 0 0 2rem;
	padding: 0;
	background: var(--mp-borde);
	border: 1px solid var(--mp-borde);
}
.mp-tema ul.woocommerce-order-overview li {
	margin: 0 !important;
	padding: 14px 16px !important;
	border: 0 !important;
	background: var(--mp-superficie);
	font-family: var(--mp-f-ui);
	font-size: .8rem !important;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--mp-texto-suave);
}
.mp-tema ul.woocommerce-order-overview li strong {
	display: block;
	margin-top: 4px;
	font-size: 1.1rem;
	letter-spacing: 0;
	text-transform: none;
	color: var(--mp-blanco);
}
.mp-tema .woocommerce-order-details,
.mp-tema .woocommerce-customer-details {
	padding: 22px;
	margin-bottom: 1.5rem;
	background: var(--mp-superficie);
	border: 1px solid var(--mp-borde);
}
.mp-tema .woocommerce-customer-details address {
	border: 0;
	padding: 0;
	color: var(--mp-texto);
}

@media (max-width: 768px) {
	.mp-tema .woocommerce-cart-form table.shop_table_responsive tr td::before {
		color: var(--mp-texto-suave);
		font-family: var(--mp-f-ui);
		text-transform: uppercase;
		letter-spacing: .06em;
	}
	.mp-tema .woocommerce-cart-form table.shop_table_responsive tr {
		border-bottom: 1px solid var(--mp-borde);
	}
	.mp-tema .woocommerce-billing-fields,
	.mp-tema .woocommerce-shipping-fields,
	.mp-tema .woocommerce-additional-fields,
	.mp-tema #order_review { padding: 16px; }
}
