/* ------------------------------------------------------------------
   Cesta, pago y confirmación.
   ------------------------------------------------------------------
   Esas páginas sí traen el marcado estándar de WooCommerce, así que se
   reestilan por encima en vez de rehacerlas. Los selectores llevan la
   clase repetida por lo mismo que la hoja base: la web carga 77 hojas y
   los ocho paquetes de addons ganan a una clase suelta.
   ------------------------------------------------------------------ */

.woocommerce.woocommerce {
	--vlc-serif: "Cormorant Garamond", Garamond, "Times New Roman", serif;
	--vlc-sans: "Jost", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
	--vlc-ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- el hilo de la compra ---------- */
.vlc-pasos.vlc-pasos {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	list-style: none;
	margin: 0 0 34px;
	padding: 0 0 20px;
	border-bottom: 1px solid var(--vlc-rule-l);
	font-size: 11.5px;
	letter-spacing: .18em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--vlc-on-light-dim);
}

.vlc-pasos.vlc-pasos li {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
}

.vlc-pason.vlc-pason {
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: 11.5px;
	letter-spacing: 0;
	font-variant-numeric: tabular-nums;
}

.vlc-pasos.vlc-pasos .vlc-ahora { color: var(--vlc-on-light); }

.vlc-pasos.vlc-pasos .vlc-ahora .vlc-pason {
	background: var(--vlc-gold-ink);
	border-color: var(--vlc-gold-ink);
	color: var(--vlc-porcelain);
}

.vlc-pasos.vlc-pasos .vlc-hecho { color: var(--vlc-gold-ink); }

/* ---------- tipografía de la tienda ---------- */
/* Hasta h6: «Tu pedido» es un h3 y salía blanco sobre blanco, en Lora,
   por el mismo motivo que el resto. Cada encabezado declara lo suyo. */
.woocommerce.woocommerce h1,
.woocommerce.woocommerce h2,
.woocommerce.woocommerce h3,
.woocommerce.woocommerce h4,
.woocommerce.woocommerce h5,
.woocommerce.woocommerce h6,
.vlc-tienda .elementor-widget-heading .elementor-heading-title {
	font-family: var(--vlc-serif);
	font-weight: 300;
	letter-spacing: -.012em;
	color: var(--vlc-on-light);
}

/* ---------- tabla de la cesta ---------- */
.woocommerce.woocommerce table.shop_table {
	border: 1px solid var(--vlc-rule-l);
	border-radius: 0;
	border-collapse: collapse;
	font-family: var(--vlc-sans);
}

.woocommerce.woocommerce table.shop_table th {
	background: var(--vlc-porcelain-2);
	color: var(--vlc-on-light);
	font-weight: 500;
	font-size: 10px;
	letter-spacing: .2em;
	text-transform: uppercase;
	padding: 15px 16px;
	border-bottom: 1px solid var(--vlc-rule-l);
}

.woocommerce.woocommerce table.shop_table td {
	padding: 18px 16px;
	border-top: 1px solid var(--vlc-rule-l);
	font-size: 14.5px;
	color: var(--vlc-on-light-dim);
	vertical-align: middle;
}

.woocommerce.woocommerce table.shop_table td.product-name a {
	font-family: var(--vlc-serif);
	font-size: 18px;
	color: var(--vlc-on-light);
	text-decoration: none;
}

.woocommerce.woocommerce table.shop_table td.product-name a:hover { color: var(--vlc-gold-ink); }

.woocommerce.woocommerce table.shop_table td.product-price,
.woocommerce.woocommerce table.shop_table td.product-subtotal,
.woocommerce.woocommerce .cart_totals td {
	font-variant-numeric: tabular-nums;
	color: var(--vlc-on-light);
	white-space: nowrap;
}

.woocommerce.woocommerce td.product-thumbnail img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border: 1px solid var(--vlc-rule-l);
}

.woocommerce.woocommerce a.remove {
	color: var(--vlc-on-light-dim);
	font-weight: 400;
	border-radius: 0;
}

.woocommerce.woocommerce a.remove:hover {
	background: none;
	color: var(--vlc-on-light);
}

/* ---------- cantidades ---------- */
.woocommerce.woocommerce .quantity .qty {
	appearance: textfield;
	background: none;
    border: 1px solid var(--vlc-rule-l);
	border-radius: 0;
	padding: 9px 6px;
	width: 62px;
	font-family: var(--vlc-sans);
	font-size: 14.5px;
	color: var(--vlc-on-light);
	text-align: center;
}

/* ---------- botones ---------- */

.woocommerce.woocommerce .button,
.woocommerce.woocommerce button.button,
.woocommerce.woocommerce input.button,
.woocommerce.woocommerce a.button,
.woocommerce.woocommerce #place_order {
	position: relative;
	appearance: none;
	background: var(--vlc-gold-ink);
	color: var(--vlc-porcelain);
	border: 1px solid var(--vlc-gold-ink);
	border-radius: 0;
	padding: 15px 30px;
	font-family: var(--vlc-sans);
	font-weight: 500;
	font-size: 10px;
	letter-spacing: .22em;
	text-transform: uppercase;
	line-height: 1;
	transition: background .3s var(--vlc-ease), color .3s var(--vlc-ease);
}

.woocommerce.woocommerce .button:hover,
.woocommerce.woocommerce button.button:hover,
.woocommerce.woocommerce input.button:hover,
.woocommerce.woocommerce a.button:hover,
.woocommerce.woocommerce #place_order:hover {
	background: var(--vlc-noir);
	border-color: var(--vlc-noir);
	color: var(--vlc-gold);
}

.woocommerce.woocommerce .button.alt,
.woocommerce.woocommerce .checkout-button {
	background: var(--vlc-noir);
	border-color: var(--vlc-noir);
	color: var(--vlc-gold);
}

.woocommerce.woocommerce .button.alt:hover,
.woocommerce.woocommerce .checkout-button:hover {
	background: var(--vlc-gold-ink);
	border-color: var(--vlc-gold-ink);
	color: var(--vlc-porcelain);
}

/* ---------- totales y resumen ---------- */
.woocommerce.woocommerce .cart_totals h2,
.woocommerce.woocommerce #order_review_heading {
	font-size: 26px;
	margin: 0 0 18px;
}

.woocommerce.woocommerce .cart_totals table,
.woocommerce.woocommerce #order_review table {
	border: 1px solid var(--vlc-rule-l);
}

.woocommerce.woocommerce .order-total td,
.woocommerce.woocommerce .order-total th {
	font-size: 18px;
	color: var(--vlc-on-light);
	background: var(--vlc-porcelain-2);
}

/* ---------- formulario de pago ---------- */
.woocommerce.woocommerce .woocommerce-billing-fields h3,
.woocommerce.woocommerce .woocommerce-shipping-fields h3 {
	font-family: var(--vlc-serif);
	font-weight: 300;
	font-size: 25px;
	margin: 0 0 16px;
	color: var(--vlc-on-light);
}

.woocommerce.woocommerce .form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--vlc-on-light-dim);
}

.woocommerce.woocommerce .form-row input.input-text,
.woocommerce.woocommerce .form-row textarea,
.woocommerce.woocommerce .select2-container .select2-selection--single {
	appearance: none;
	/* Crema sobre panel blanco no se veía: el campo parecía no existir.
	   Fondo un punto más oscuro y borde con suficiente cuerpo. */
	background: var(--vlc-porcelain-2);
	border: 1px solid rgba(21, 24, 26, .26);
	border-radius: 0;
	padding: 13px 14px;
	width: 100%;
	font-family: var(--vlc-sans);
	font-size: 14.5px;
	color: var(--vlc-on-light);
	height: auto;
	transition: border-color .25s var(--vlc-ease);
}

.woocommerce.woocommerce .form-row input.input-text:focus,
.woocommerce.woocommerce .form-row textarea:focus {
	border-color: var(--vlc-gold-ink);
	outline: 0;
	box-shadow: none;
}

.woocommerce.woocommerce .woocommerce-input-wrapper { width: 100%; }

/* ---------- avisos ---------- */
.woocommerce.woocommerce .woocommerce-message,
.woocommerce.woocommerce .woocommerce-info,
.woocommerce.woocommerce .woocommerce-error {
	border-top: 0;
	border-left: 2px solid var(--vlc-gold-ink);
	background: var(--vlc-porcelain-2);
	color: var(--vlc-on-light);
	font-size: 14.5px;
	border-radius: 0;
	padding: 16px 18px;
}

.woocommerce.woocommerce .woocommerce-message::before,
.woocommerce.woocommerce .woocommerce-info::before { display: none; }

.woocommerce.woocommerce .woocommerce-error { border-left-color: #A3282A; }

/* ---------- confirmación ---------- */
.woocommerce.woocommerce .woocommerce-order-overview {
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
	background: var(--vlc-rule-l);
	border: 1px solid var(--vlc-rule-l);
	list-style: none;
	padding: 0;
	margin: 26px 0;
}

.woocommerce.woocommerce .woocommerce-order-overview li {
	flex: 1 1 180px;
	background: var(--vlc-porcelain);
	border: 0;
	padding: 18px 20px;
	font-size: 10px;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--vlc-on-light-dim);
}

.woocommerce.woocommerce .woocommerce-order-overview li strong {
	display: block;
	margin-top: 8px;
	font-family: var(--vlc-serif);
	font-size: 22px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--vlc-on-light);
}

@media (max-width: 620px) {
	.vlc-pasos.vlc-pasos { gap: 8px 16px; font-size: 10px; }
	.woocommerce.woocommerce table.shop_table td { padding: 14px 10px; }
}


/* El campo tiene que leerse como campo, también al escribir dentro. */
.woocommerce.woocommerce .form-row input.input-text::placeholder,
.woocommerce.woocommerce .form-row textarea::placeholder {
	color: var(--vlc-on-light-dim);
	opacity: 1;
}

.woocommerce.woocommerce .form-row .required { color: #A3282A; }

/* La barra del cupón la pinta el tema en azul marino. */
.woocommerce.woocommerce .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce.woocommerce .checkout_coupon {
	background: var(--vlc-porcelain-2);
	color: var(--vlc-on-light);
	border-left: 2px solid var(--vlc-gold-ink);
}

.woocommerce.woocommerce .woocommerce-form-coupon-toggle .woocommerce-info a {
	color: var(--vlc-gold-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Los dos paneles del pago, con el mismo aire que el resto. */
.woocommerce.woocommerce .woocommerce-checkout .col2-set .col-1,
.woocommerce.woocommerce .woocommerce-checkout .col2-set .col-2 { float: none; width: auto; }

.woocommerce.woocommerce #payment {
	background: var(--vlc-porcelain-2);
	border: 1px solid var(--vlc-rule-l);
	border-radius: 0;
}

.woocommerce.woocommerce #payment div.payment_box {
	background: var(--vlc-porcelain);
	border-radius: 0;
	font-size: 13.5px;
	color: var(--vlc-on-light-dim);
}

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

/* ------------------------------------------------------------------
   Al apagar la cabecera del plugin Header Footer Elementor en la ficha
   de producto, Hello Elementor saca la suya. Como ahí el marco lo pone
   nuestra plantilla, se esconde. Solo en la ficha: el resto del sitio
   sigue con su cabecera hasta que se apruebe el rediseño entero.
   ------------------------------------------------------------------ */
.single-product .site-header,
.single-product .site-footer,
.single-product header.site-header,
.single-product footer.site-footer { display: none; }

@media (max-width: 820px) {
	/*
	   Nada de min-width ni de scroll horizontal aquí.

	   Cuando la cesta la pintaba el widget de Essential Addons hacía falta,
	   porque su tabla no colapsaba. La de WooCommerce sí: con
	   `shop_table_responsive` apila cada fila en pares rótulo/valor. Forzarle
	   un ancho mínimo la sacaba de la pantalla y cortaba los nombres.
	*/
	.vlc-tienda .elementor-widget-shortcode .elementor-widget-container { max-width: 100%; }

	.woocommerce.woocommerce table.shop_table_responsive tr {
		display: block;
		border-bottom: 1px solid var(--vlc-rule-l);
		padding: 6px 0;
	}

	.woocommerce.woocommerce table.shop_table_responsive td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 14px;
		width: auto;
		border: 0;
		padding: 9px 14px;
		text-align: right;
	}

	.woocommerce.woocommerce table.shop_table_responsive td::before {
		content: attr(data-title) ":";
		font-size: 10px;
		font-weight: 500;
		letter-spacing: .18em;
		text-transform: uppercase;
		color: var(--vlc-on-light-dim);
		flex: none;
	}

	/* Estas dos no necesitan rótulo ni ocupan fila propia. */
	.woocommerce.woocommerce table.shop_table_responsive td.product-remove,
	.woocommerce.woocommerce table.shop_table_responsive td.product-thumbnail {
		justify-content: flex-end;
	}

	.woocommerce.woocommerce table.shop_table_responsive td.product-thumbnail::before,
	.woocommerce.woocommerce table.shop_table_responsive td.product-remove::before {
		display: none;
	}

	.woocommerce.woocommerce table.shop_table_responsive td.product-name {
		font-family: var(--vlc-serif);
		font-size: 18px;
	}

	.woocommerce.woocommerce table.shop_table_responsive td.actions {
		display: block;
		text-align: left;
	}

	.woocommerce.woocommerce table.shop_table_responsive td.actions::before { display: none; }
}

/* ------------------------------------------------------------------
   Ahora la cesta y el pago son el shortcode de WooCommerce, no widgets
   de terceros, así que el marcado es el estándar y se puede maquetar
   de verdad en vez de pelearse con la hoja de un addon.
   ------------------------------------------------------------------ */

/* La caja donde va el shortcode, con el aire de las demás páginas. */
.woocommerce.woocommerce {
	color: var(--vlc-on-light);
	font-family: var(--vlc-sans);
}

/* ---------- cesta: la tabla y los totales, uno al lado del otro ---------- */
@media (min-width: 900px) {
	.woocommerce.woocommerce .woocommerce-cart-form { float: none; width: auto; }

	/* Los totales, pegados a la derecha y con ancho de lectura. Antes iban
	   en una rejilla de dos columnas y la de la izquierda se quedaba con
	   400 px de nada al lado del importe. */
	.woocommerce.woocommerce .cart-collaterals {
		float: none;
		width: auto;
		margin-top: 30px;
		display: flex;
		justify-content: flex-end;
	}

	.woocommerce.woocommerce .cart_totals {
		float: none;
		width: 100%;
		max-width: 420px;
	}
}

.woocommerce.woocommerce .cart_totals {
	background: var(--vlc-porcelain-2);
	border: 1px solid var(--vlc-rule-l);
	padding: 24px 26px;
}

.woocommerce.woocommerce .cart_totals h2 { font-size: 25px; }

.woocommerce.woocommerce .cart_totals table {
	border: 0;
	margin: 0;
}

.woocommerce.woocommerce .cart_totals th,
.woocommerce.woocommerce .cart_totals td {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--vlc-rule-l);
	padding: 14px 0;
	font-size: 14.5px;
}

.woocommerce.woocommerce .cart_totals .order-total th,
.woocommerce.woocommerce .cart_totals .order-total td {
	border-bottom: 0;
	padding-top: 18px;
	font-size: 18px;
	background: none;
}

.woocommerce.woocommerce .wc-proceed-to-checkout { padding: 18px 0 0; }

.woocommerce.woocommerce .wc-proceed-to-checkout .checkout-button {
	display: block;
	width: 100%;
	text-align: center;
}

/* Cupón y «actualizar cesta», en su sitio y sin gritar. */
.woocommerce.woocommerce .actions .coupon {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.woocommerce.woocommerce .actions .coupon .input-text {
	flex: 1 1 180px;
	min-width: 0;
	background: var(--vlc-porcelain-2);
	border: 1px solid var(--vlc-rule-l);
	padding: 13px 14px;
	font-family: var(--vlc-sans);
	font-size: 14.5px;
	color: var(--vlc-on-light);
}

.woocommerce.woocommerce .actions button[name="update_cart"] {
	background: none;
	color: var(--vlc-on-light-dim);
	border-color: var(--vlc-rule-l);
}

.woocommerce.woocommerce .actions button[name="update_cart"]:hover {
	background: none;
	color: var(--vlc-on-light);
	border-color: var(--vlc-on-light);
}

.woocommerce.woocommerce .actions button[name="update_cart"]:disabled {
	opacity: .4;
	cursor: default;
}

/* ---------- pago: formulario y resumen ---------- */
@media (min-width: 900px) {
	/*
	   Dos columnas con floats, no con rejilla.

	   Con rejilla el bloque de datos ocupaba entero la primera fila (1.300 px
	   de alto) y el resumen, puesto en la segunda, arrancaba ahi abajo. El
	   marcado de WooCommerce esta pensado para flotar: el titulo y el resumen
	   a la derecha, los datos a la izquierda, y cada columna crece por su
	   cuenta.
	*/
	.woocommerce.woocommerce form.checkout.woocommerce-checkout::after {
		content: "";
		display: table;
		clear: both;
	}

	.woocommerce.woocommerce form.checkout #customer_details {
		float: left;
		width: 56%;
	}

	.woocommerce.woocommerce form.checkout #order_review_heading,
	.woocommerce.woocommerce form.checkout #order_review {
		float: right;
		width: 40%;
		clear: right;
	}

	.woocommerce.woocommerce form.checkout .woocommerce-additional-fields {
		float: left;
		width: 56%;
		clear: left;
	}
}

.woocommerce.woocommerce form.checkout .col2-set { width: auto; }

.woocommerce.woocommerce .col2-set .col-1,
.woocommerce.woocommerce .col2-set .col-2 {
	float: none;
	width: auto;
	margin-bottom: 26px;
}

.woocommerce.woocommerce #order_review {
	background: var(--vlc-porcelain-2);
	border: 1px solid var(--vlc-rule-l);
	padding: 24px 26px;
}

.woocommerce.woocommerce #order_review table.shop_table {
	border: 0;
	margin: 0;
}

.woocommerce.woocommerce #order_review table.shop_table th,
.woocommerce.woocommerce #order_review table.shop_table td {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--vlc-rule-l);
	padding: 13px 0;
}

.woocommerce.woocommerce #order_review .order-total th,
.woocommerce.woocommerce #order_review .order-total td {
	border-bottom: 0;
	font-size: 18px;
	background: none;
}

.woocommerce.woocommerce #payment {
	background: none;
	border: 0;
	padding: 0;
	margin-top: 6px;
}

.woocommerce.woocommerce #payment ul.payment_methods {
	border: 0;
	border-top: 1px solid var(--vlc-rule-l);
	padding: 18px 0 0;
	margin: 0;
}

.woocommerce.woocommerce #payment ul.payment_methods li { list-style: none; }

.woocommerce.woocommerce #payment .form-row.place-order { padding: 18px 0 0; margin: 0; }

.woocommerce.woocommerce #place_order {
	display: block;
	width: 100%;
	text-align: center;
	float: none;
}

.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper {
	font-size: 13px;
	line-height: 1.6;
	color: var(--vlc-on-light-dim);
}

/* Los dos campos de nombre, uno al lado del otro también en pantallas medianas. */
.woocommerce.woocommerce .form-row-first,
.woocommerce.woocommerce .form-row-last { width: calc(50% - 7px); }

.woocommerce.woocommerce .form-row { margin-bottom: 16px; }

/* Selectores de país y provincia, con el mismo traje que los campos. */
.woocommerce.woocommerce .select2-container--default .select2-selection--single {
	background: var(--vlc-porcelain-2);
	border: 1px solid rgba(21, 24, 26, .26);
	border-radius: 0;
	height: auto;
	padding: 11px 12px;
}

.woocommerce.woocommerce .select2-container--default .select2-selection--single
	.select2-selection__rendered {
	color: var(--vlc-on-light);
	line-height: 1.4;
	padding: 0;
	font-size: 14.5px;
}

.woocommerce.woocommerce .select2-container--default .select2-selection--single
	.select2-selection__arrow { top: 50%; transform: translateY(-50%); right: 10px; }

.woocommerce.woocommerce select.country_select,
.woocommerce.woocommerce select.state_select,
.woocommerce.woocommerce .form-row select {
	appearance: none;
	background: var(--vlc-porcelain-2);
	border: 1px solid rgba(21, 24, 26, .26);
	border-radius: 0;
	padding: 13px 14px;
	font-family: var(--vlc-sans);
	font-size: 14.5px;
	color: var(--vlc-on-light);
	width: 100%;
}

/* ---------- cesta vacía ---------- */
.woocommerce.woocommerce .cart-empty {
	font-family: var(--vlc-serif);
	font-size: 25px;
	font-weight: 300;
	color: var(--vlc-on-light);
	margin: 30px 0 18px;
}

.woocommerce.woocommerce .return-to-shop { margin-bottom: 40px; }

@media (max-width: 899px) {
	.woocommerce.woocommerce .form-row-first,
	.woocommerce.woocommerce .form-row-last { width: 100%; }

	.woocommerce.woocommerce #order_review,
	.woocommerce.woocommerce .cart_totals { padding: 20px 18px; }
}

/* ---------- remates de la cesta ---------- */

/* La barra va justo debajo de la tabla, a todo lo ancho: habla del pedido
   entero, no del bloque de totales. */
.woocommerce.woocommerce .vlc-progreso { margin: 22px 0 0; }

/* La fila del cupón, en una sola línea y con el rótulo donde toca. */
.woocommerce.woocommerce td.actions {
	padding: 18px 16px;
	background: var(--vlc-porcelain-2);
}

.woocommerce.woocommerce td.actions .coupon label { display: none; }

.woocommerce.woocommerce td.actions .coupon::before {
	content: "¿Tienes un código?";
	flex: 0 0 100%;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--vlc-on-light-dim);
	margin-bottom: 4px;
}

.woocommerce.woocommerce td.actions .coupon .input-text::placeholder {
	color: var(--vlc-on-light-dim);
	opacity: 1;
}

/* Cantidad: que se vea que es un campo y se pueda tocar con el dedo. */
.woocommerce.woocommerce td.product-quantity .quantity { display: inline-flex; }

.woocommerce.woocommerce .quantity input.qty {
	appearance: textfield;
	-moz-appearance: textfield;
	background: var(--vlc-porcelain-2);
	border: 1px solid rgba(21, 24, 26, .26);
	border-radius: 0;
	width: 68px;
	min-height: 44px;
	padding: 10px 6px;
	text-align: center;
	font-family: var(--vlc-sans);
	font-size: 15px;
	font-variant-numeric: tabular-nums;
	color: var(--vlc-on-light);
}

.woocommerce.woocommerce .quantity input.qty:focus {
	border-color: var(--vlc-gold-ink);
	outline: 0;
}

/* La equis de quitar, que se lea. */
.woocommerce.woocommerce td.product-remove a.remove {
	font-size: 22px;
	line-height: 1;
	width: auto;
	height: auto;
	color: var(--vlc-on-light-dim);
}

.woocommerce.woocommerce td.product-remove a.remove:hover { color: #A3282A; }

/* Nombre del producto y su variante, con jerarquía. */
.woocommerce.woocommerce td.product-name dl.variation {
	margin: 4px 0 0;
    font-size: 11.5px;
	letter-spacing: .06em;
	color: var(--vlc-on-light-dim);
}

.woocommerce.woocommerce td.product-name dl.variation dt,
.woocommerce.woocommerce td.product-name dl.variation dd {
	display: inline;
	margin: 0;
	font-weight: 400;
}

.woocommerce.woocommerce td.product-name dl.variation dd p { display: inline; margin: 0; }

/* ---------- remates del pago ---------- */

/* «¿Enviar a una dirección diferente?» se quedaba en una casilla suelta
   sin rótulo, porque la regla general de .form-row label lo escondía. */
.woocommerce.woocommerce #ship-to-different-address {
	margin: 6px 0 18px;
	font-family: var(--vlc-sans);
}

.woocommerce.woocommerce #ship-to-different-address label {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	font-size: 13.5px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--vlc-on-light);
	cursor: pointer;
}

.woocommerce.woocommerce #ship-to-different-address input[type="checkbox"],
.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper input[type="checkbox"],
.woocommerce.woocommerce #payment input[type="radio"] {
	appearance: none;
	width: 17px;
	height: 17px;
	flex: none;
	margin: 0;
	border: 1px solid rgba(21, 24, 26, .4);
	background: var(--vlc-porcelain);
	position: relative;
	cursor: pointer;
}

.woocommerce.woocommerce #payment input[type="radio"] { border-radius: 999px; }

.woocommerce.woocommerce #ship-to-different-address input[type="checkbox"]:checked,
.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper input[type="checkbox"]:checked,
.woocommerce.woocommerce #payment input[type="radio"]:checked {
	background: var(--vlc-gold-ink);
	border-color: var(--vlc-gold-ink);
}

.woocommerce.woocommerce #ship-to-different-address input[type="checkbox"]:checked::after,
.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 1px;
	width: 5px;
	height: 10px;
	border: solid var(--vlc-porcelain);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.woocommerce.woocommerce #payment input[type="radio"]:checked::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 999px;
	background: var(--vlc-porcelain);
}

/* El resumen del pedido, legible. */
.woocommerce.woocommerce #order_review_heading { margin: 0 0 16px; font-size: 25px; }

.woocommerce.woocommerce #order_review table.shop_table td,
.woocommerce.woocommerce #order_review table.shop_table th { font-size: 14px; }

.woocommerce.woocommerce #order_review .product-name { color: var(--vlc-on-light); }

.woocommerce.woocommerce #order_review .product-name .variation {
	font-size: 11.5px;
	color: var(--vlc-on-light-dim);
}

.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper .form-row {
	margin-bottom: 0;
}

.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper label {
	display: inline-flex;
	align-items: flex-start;
	gap: 9px;
	font-size: 12.5px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--vlc-on-light-dim);
	line-height: 1.5;
}

.woocommerce.woocommerce .woocommerce-terms-and-conditions-wrapper a {
	color: var(--vlc-gold-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* La pasarela, con su logo a tamaño razonable. */
.woocommerce.woocommerce #payment ul.payment_methods li img {
	max-height: 30px;
	width: auto;
	margin-left: 8px;
	vertical-align: middle;
}

.woocommerce.woocommerce #payment ul.payment_methods label {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	font-size: 13.5px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--vlc-on-light);
	cursor: pointer;
}

/* ------------------------------------------------------------------
   Alineación con el resto del sitio.
   ------------------------------------------------------------------
   El problema de los «márgenes raros» no estaba en la cesta: estaba en
   el contenedor. Elementor la metía en un `e-con-inner` con
   `max-width: 1280px` y `margin: 0 52.5px`, mientras que la cabecera,
   el pie y todas las demás páginas usan `.vlc-wrap`, que es
   `max-width: 1320px` con un padding fluido. Resultado: la tabla no
   cuadraba con nada.

   Ahora el contenedor va a ancho completo, como en las demás páginas, y
   el contenido de tienda se encaja aquí con exactamente las mismas
   medidas que `.vlc-wrap`. Así la columna de la tabla arranca en la
   misma vertical que el logotipo.
   ------------------------------------------------------------------ */
.vlc-tienda .elementor-widget-shortcode > .elementor-widget-container,
.vlc-tienda > .e-con-inner > .elementor-widget-heading > .elementor-widget-container,
.vlc-tienda > .elementor-widget-heading > .elementor-widget-container,
.vlc-tienda .elementor-widget-text-editor > .elementor-widget-container {
	max-width: 1320px;
	margin-inline: auto;
	padding-inline: var(--vlc-pad);
	box-sizing: border-box;
	width: 100%;
}

/* La cabecera y el pie se quedan a sangre, que para eso son el marco. */
.vlc-tienda [class*="elementor-widget-volcanium-header"] > .elementor-widget-container,
.vlc-tienda [class*="elementor-widget-volcanium-footer"] > .elementor-widget-container {
	max-width: none;
	padding-inline: 0;
}

/* Aire vertical propio, que el del contenedor se ha ido a cero. */
.vlc-tienda .elementor-widget-shortcode { padding-bottom: clamp(48px, 7vw, 96px); }

.vlc-tienda > .elementor-widget-heading,
.vlc-tienda > .e-con-inner > .elementor-widget-heading { padding-top: clamp(28px, 4vw, 56px); }

/* ---------- columna de envío ---------- */
.woocommerce.woocommerce th.product-vlc-envio,
.woocommerce.woocommerce td.product-vlc-envio {
	white-space: nowrap;
	text-align: left;
}

.vlc-envio-si.vlc-envio-si,
.vlc-envio-no.vlc-envio-no {
	display: inline-block;
	padding: 4px 9px;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	line-height: 1.4;
	white-space: nowrap;
}

.vlc-envio-si.vlc-envio-si {
	background: var(--vlc-gold-ink);
	color: var(--vlc-porcelain);
}

.vlc-envio-no.vlc-envio-no {
	background: var(--vlc-porcelain-3);
	color: var(--vlc-on-light-dim);
}

@media (max-width: 899px) {
	/* En la tabla apilada de móvil, la etiqueta va con su rótulo. */
	.woocommerce.woocommerce td.product-vlc-envio { text-align: right; }
}

/* ------------------------------------------------------------------
   Progreso hacia el envío gratuito.
   ------------------------------------------------------------------
   Antes ponía «Faltan 34,10 €» y ya está, sin decir para qué ni cuánto
   se llevaba. Ahora se ve de un vistazo: titular con lo que falta,
   barra con lo recorrido y una línea que explica la regla.
   ------------------------------------------------------------------ */
.vlc-progreso.vlc-progreso {
	background: var(--vlc-porcelain-2);
	border-left: 2px solid var(--vlc-acento);
	padding: 16px 20px 18px;
	font-family: var(--vlc-sans);
}

.vlc-progreso__t.vlc-progreso__t {
	margin: 0;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--vlc-on-light);
}

.vlc-progreso__pista.vlc-progreso__pista {
	position: relative;
	height: 6px;
	margin: 11px 0 9px;
	background: var(--vlc-porcelain-3);
	overflow: hidden;
}

.vlc-progreso__pista.vlc-progreso__pista span {
	display: block;
	height: 100%;
	background: var(--vlc-gold-ink);
	transition: width .5s var(--vlc-ease);
}

.vlc-progreso__d.vlc-progreso__d {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.55;
	color: var(--vlc-on-light-dim);
}

.vlc-progreso.vlc-logrado.vlc-logrado {
	border-left-color: var(--vlc-gold-ink);
	background: var(--vlc-porcelain-2);
}

.vlc-progreso.vlc-logrado .vlc-progreso__pista span { background: var(--vlc-gold-ink); }

/* ------------------------------------------------------------------
   Garantías: frío, plazos y pago. Iban sueltas al final de la página,
   sin estilos. Aquí sirven para algo, justo antes de decidir.
   ------------------------------------------------------------------ */
.vlc-garantias.vlc-garantias {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1px;
	margin: 40px 0 0;
	background: var(--vlc-rule-l);
	border: 1px solid var(--vlc-rule-l);
	font-family: var(--vlc-sans);
}

.vlc-garantias.vlc-garantias > div {
	background: var(--vlc-porcelain);
	padding: 20px 22px;
}

.vlc-garantias.vlc-garantias b {
	display: block;
	margin-bottom: 6px;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--vlc-acento);
}

.vlc-garantias.vlc-garantias span {
	display: block;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--vlc-on-light-dim);
}

/* En el pago va dentro de la columna del resumen, más estrecha. */
#order_review .vlc-garantias.vlc-garantias {
	grid-template-columns: 1fr;
	margin-top: 22px;
}

@media (max-width: 620px) {
	.vlc-garantias.vlc-garantias { grid-template-columns: 1fr; }
}