/* ==========================================================================
   Candelaria — carrito, pago, cuenta y confirmación
   Se viste el marcado propio de WooCommerce con la línea del sitio, en vez
   de reescribir sus plantillas: así sobrevive a las actualizaciones.
   Innovar Soluciones Web
   ========================================================================== */

.woocommerce-cart .cnd-main,
.woocommerce-checkout .cnd-main,
.woocommerce-account .cnd-main,
.woocommerce-order-received .cnd-main {
	--cnd-borde: #e2e2e2;
}

/* --------------------------------------------------------------------------
   Avisos: fuera el verde oliva de WooCommerce
   -------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
	margin: 0 0 clamp(18px, 2.2vw, 30px);
	padding: clamp(12px, 1.5vw, 18px) clamp(14px, 1.8vw, 24px);
	background: var(--cnd-humo);
	border: 0;
	border-left: 2px solid var(--cnd-negro);
	border-radius: 0;
	color: var(--cnd-tinta);
	font-family: var(--cnd-texto);
	font-size: clamp(13px, 1.17vw, 16px);
	list-style: none;
}

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

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

.woocommerce-message .button,
.woocommerce-info .button {
	float: right;
	margin-left: 16px;
}

/* --------------------------------------------------------------------------
   Botones — uno solo para toda la tienda
   -------------------------------------------------------------------------- */

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #respond input#submit,
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt,
.woocommerce #place_order {
	display: inline-block;
	padding: .78em 2.2em;
	background: var(--cnd-blanco);
	color: var(--cnd-negro);
	border: 1px solid var(--cnd-negro);
	border-radius: 0;
	font-family: var(--cnd-texto);
	font-size: clamp(12px, 1.17vw, 16px);
	font-weight: 400;
	letter-spacing: .12em;
	text-transform: uppercase;
	line-height: 1.2;
	text-shadow: none;
	transition: background .2s var(--cnd-ease), color .2s var(--cnd-ease);
}

.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button:hover,
.woocommerce #respond input#submit:hover {
	background: var(--cnd-negro);
	color: var(--cnd-blanco);
}

/* El de continuar (pagar, hacer el pedido) va sólido. */
.woocommerce .checkout-button,
.woocommerce .wc-proceed-to-checkout .button,
.woocommerce #place_order,
.woocommerce .woocommerce-form-login .button,
.woocommerce .woocommerce-form-register .button {
	width: 100%;
	background: var(--cnd-negro);
	color: var(--cnd-blanco);
}

.woocommerce .checkout-button:hover,
.woocommerce #place_order:hover {
	background: var(--cnd-tinta);
	color: var(--cnd-blanco);
}

.woocommerce .button:disabled,
.woocommerce .button.disabled {
	opacity: .4;
	cursor: not-allowed;
}

/* --------------------------------------------------------------------------
   Campos
   -------------------------------------------------------------------------- */

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single,
.woocommerce table.cart td.actions .coupon input[type="text"],
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce input[type="number"] {
	width: 100%;
	height: auto;
	padding: .72em .9em;
	background: var(--cnd-blanco);
	border: 1px solid var(--cnd-linea);
	border-radius: 0;
	color: var(--cnd-tinta);
	font-family: var(--cnd-texto);
	font-size: clamp(13px, 1.17vw, 16px);
	line-height: 1.4;
	box-shadow: none;
	outline: none;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: var(--cnd-negro);
}

.woocommerce form .form-row label,
.woocommerce-billing-fields label,
.woocommerce-shipping-fields label {
	display: block;
	margin-bottom: .35em;
	font-size: clamp(11px, 1.02vw, 14px);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--cnd-gris);
}

.woocommerce form .form-row {
	margin-bottom: clamp(12px, 1.4vw, 18px);
	padding: 0;
}

.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1.4;
	padding: 0;
	color: var(--cnd-tinta);
}

.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100%;
	right: 8px;
}

/* --------------------------------------------------------------------------
   Tabla del carrito
   -------------------------------------------------------------------------- */

.woocommerce table.shop_table {
	width: 100%;
	margin: 0 0 clamp(24px, 3vw, 40px);
	border: 0;
	border-radius: 0;
	border-collapse: collapse;
	font-family: var(--cnd-texto);
}

.woocommerce table.shop_table th {
	padding: 0 0 clamp(10px, 1.2vw, 16px);
	border: 0;
	border-bottom: 1px solid var(--cnd-negro);
	background: transparent;
	font-size: clamp(11px, 1.02vw, 14px);
	font-weight: 400;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--cnd-tinta);
	text-align: left;
}

.woocommerce table.shop_table td {
	padding: clamp(14px, 1.8vw, 24px) 0;
	border: 0;
	border-bottom: 1px solid var(--cnd-linea);
	vertical-align: middle;
	font-size: clamp(13px, 1.17vw, 16px);
}

.woocommerce table.shop_table th:not(:first-child),
.woocommerce table.shop_table td:not(:first-child) {
	padding-left: clamp(10px, 1.4vw, 20px);
}

/* La X de quitar. */
.woocommerce table.cart td.product-remove {
	width: 34px;
	padding-left: 0;
}

.woocommerce a.remove {
	display: block;
	width: 22px;
	height: 22px;
	line-height: 20px;
	border-radius: 50%;
	background: transparent;
	color: var(--cnd-gris) !important;
	font-size: 20px;
	font-weight: 300;
	text-align: center;
	transition: color .2s var(--cnd-ease);
}

.woocommerce a.remove:hover {
	background: transparent;
	color: var(--cnd-negro) !important;
}

/* Miniatura. */
.woocommerce table.cart td.product-thumbnail {
	width: clamp(70px, 8vw, 108px);
}

.woocommerce table.cart td.product-thumbnail img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	display: block;
}

/* Nombre y variación. */
.woocommerce table.cart td.product-name a {
	color: var(--cnd-tinta);
	font-size: clamp(13px, 1.24vw, 17px);
	letter-spacing: .02em;
}

.woocommerce table.cart td.product-name a:hover {
	text-decoration: underline;
}

.woocommerce table.cart td.product-name .variation {
	margin: .4em 0 0;
	font-size: clamp(11px, 1.02vw, 13px);
	color: var(--cnd-gris);
}

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

.woocommerce table.cart td.product-name .variation dd + dt::before {
	content: ' · ';
}

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

/* Cantidad. */
.woocommerce .quantity input.qty {
	width: 68px;
	padding: .5em;
	text-align: center;
	border: 1px solid var(--cnd-linea);
}

/* Cupón y acciones. */
.woocommerce table.cart td.actions {
	padding: clamp(16px, 2vw, 26px) 0 0;
	border-bottom: 0;
}

.woocommerce table.cart td.actions .coupon {
	display: flex;
	gap: 10px;
	float: none;
	max-width: 420px;
}

.woocommerce table.cart td.actions .coupon input[type="text"] {
	width: auto;
	flex: 1;
	min-width: 0;
}

.woocommerce table.cart td.actions .coupon .button {
	white-space: nowrap;
}

.woocommerce table.cart td.actions > .button {
	float: right;
	margin-top: -44px;
}

/* --------------------------------------------------------------------------
   Totales del carrito
   -------------------------------------------------------------------------- */

.woocommerce .cart-collaterals {
	display: flex;
	justify-content: flex-end;
}

.woocommerce .cart_totals,
.woocommerce-checkout .woocommerce-checkout-review-order {
	width: min(100%, 420px);
	padding: clamp(18px, 2.2vw, 30px);
	background: var(--cnd-humo);
}

.woocommerce .cart_totals h2,
.woocommerce-checkout h3#order_review_heading,
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
	margin: 0 0 clamp(12px, 1.5vw, 20px);
	font-family: var(--cnd-display);
	font-size: clamp(18px, 2.05vw, 28px);
	font-weight: 400;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--cnd-tinta);
}

.woocommerce .cart_totals table.shop_table,
.woocommerce-checkout table.shop_table {
	margin-bottom: clamp(14px, 1.8vw, 24px);
}

.woocommerce .cart_totals table.shop_table th,
.woocommerce-checkout table.shop_table tfoot th {
	border-bottom: 0;
	padding: .6em 0;
	color: var(--cnd-gris);
	letter-spacing: .1em;
}

.woocommerce .cart_totals table.shop_table td,
.woocommerce-checkout table.shop_table tfoot td {
	border-bottom: 0;
	padding: .6em 0;
	text-align: right;
}

.woocommerce .cart_totals .order-total th,
.woocommerce .cart_totals .order-total td,
.woocommerce-checkout .order-total th,
.woocommerce-checkout .order-total td {
	padding-top: clamp(10px, 1.2vw, 16px);
	border-top: 1px solid var(--cnd-linea);
	font-size: clamp(15px, 1.46vw, 20px);
	color: var(--cnd-tinta);
}

.woocommerce .cart_totals .order-total .amount,
.woocommerce-checkout .order-total .amount {
	font-weight: 500;
}

.woocommerce .woocommerce-shipping-destination,
.woocommerce .woocommerce-shipping-calculator {
	font-size: clamp(11px, 1.02vw, 14px);
	color: var(--cnd-gris);
}

.woocommerce ul#shipping_method {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: right;
}

.woocommerce ul#shipping_method li {
	margin: 0 0 .4em;
}

/* --------------------------------------------------------------------------
   Pago
   -------------------------------------------------------------------------- */

.woocommerce-checkout .col2-set {
	width: 100%;
	float: none;
}

.woocommerce-checkout #customer_details {
	margin-bottom: clamp(24px, 3vw, 40px);
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: 100%;
	float: none;
}

/* Dos columnas en pantalla grande: datos a la izquierda, resumen a la derecha. */
@media (min-width: 901px) {

	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: 1fr minmax(320px, 420px);
		gap: clamp(24px, 3.4vw, 46px);
		align-items: start;
	}

	.woocommerce-checkout form.checkout #customer_details {
		grid-column: 1;
		margin-bottom: 0;
	}

	.woocommerce-checkout form.checkout h3#order_review_heading {
		grid-column: 2;
		grid-row: 1;
		margin-bottom: 0;
	}

	.woocommerce-checkout form.checkout #order_review {
		grid-column: 2;
		grid-row: 1;
		margin-top: clamp(34px, 3.6vw, 50px);
	}
}

.woocommerce-checkout table.shop_table td.product-name {
	font-size: clamp(12px, 1.1vw, 15px);
	line-height: 1.5;
}

.woocommerce-checkout table.shop_table .product-quantity {
	color: var(--cnd-gris);
}

.woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
}

.woocommerce-checkout #payment ul.payment_methods {
	padding: 0;
	border-bottom: 1px solid var(--cnd-linea);
}

.woocommerce-checkout #payment ul.payment_methods li {
	list-style: none;
	margin-bottom: .6em;
}

.woocommerce-checkout #payment div.payment_box {
	background: var(--cnd-blanco);
	border: 1px solid var(--cnd-linea);
	border-radius: 0;
	font-size: clamp(12px, 1.1vw, 14px);
	color: var(--cnd-gris);
}

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

.woocommerce-checkout #payment .place-order {
	padding: clamp(14px, 1.8vw, 24px) 0 0;
}

.woocommerce-privacy-policy-text {
	font-size: clamp(11px, 1.02vw, 13px);
	color: var(--cnd-gris);
}

/* --------------------------------------------------------------------------
   Carrito vacío
   -------------------------------------------------------------------------- */

.woocommerce .cart-empty,
.woocommerce .return-to-shop {
	text-align: center;
}

.woocommerce .cart-empty {
	margin: clamp(40px, 6vw, 80px) 0 clamp(20px, 2.4vw, 32px);
	font-family: var(--cnd-display);
	font-size: clamp(18px, 2.05vw, 28px);
	letter-spacing: .04em;
}

.woocommerce .return-to-shop {
	margin-bottom: clamp(40px, 6vw, 80px);
}

/* --------------------------------------------------------------------------
   Confirmación del pedido y cuenta
   -------------------------------------------------------------------------- */

.woocommerce ul.order_details {
	margin: 0 0 clamp(24px, 3vw, 40px);
	padding: clamp(18px, 2.2vw, 30px);
	background: var(--cnd-humo);
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: clamp(16px, 2.4vw, 34px);
}

.woocommerce ul.order_details li {
	margin: 0;
	padding: 0;
	border: 0;
	float: none;
	font-size: clamp(11px, 1.02vw, 13px);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--cnd-gris);
}

.woocommerce ul.order_details li strong {
	display: block;
	margin-top: .3em;
	font-size: clamp(13px, 1.24vw, 17px);
	letter-spacing: 0;
	text-transform: none;
	color: var(--cnd-tinta);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--cnd-linea);
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: .8em 0;
	color: var(--cnd-gris);
	font-size: clamp(12px, 1.1vw, 15px);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	color: var(--cnd-negro);
}

/* --------------------------------------------------------------------------
   Teléfono
   -------------------------------------------------------------------------- */

@media (max-width: 700px) {

	.woocommerce table.shop_table_responsive tr td::before,
	.woocommerce-page table.shop_table_responsive tr td::before {
		font-size: clamp(11px, 3vw, 13px);
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--cnd-gris);
	}

	.woocommerce table.cart td.actions .coupon {
		flex-direction: column;
		max-width: 100%;
	}

	.woocommerce table.cart td.actions > .button {
		float: none;
		width: 100%;
		margin-top: 12px;
	}

	.woocommerce .cart-collaterals,
	.woocommerce .cart_totals {
		width: 100%;
	}
}

/* --------------------------------------------------------------------------
   WooCommerce pinta algunos botones con sus propias variables de color.
   Se anulan para que manden los del tema.
   -------------------------------------------------------------------------- */

.woocommerce,
.woocommerce-page,
:root {
	--wc-primary: var(--cnd-negro);
	--wc-primary-text: var(--cnd-blanco);
	--wc-secondary: var(--cnd-humo);
	--wc-secondary-text: var(--cnd-negro);
	--wc-highlight: var(--cnd-negro);
	--wc-content-bg: var(--cnd-blanco);
}

.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce .wc-proceed-to-checkout a.button.alt {
	font-size: clamp(12px, 1.17vw, 16px);
	letter-spacing: .12em;
	text-transform: uppercase;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button:hover {
}
.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce .wc-proceed-to-checkout a.button.alt {
	background-color: var(--cnd-negro) !important;
	color: var(--cnd-blanco) !important;
	border: 1px solid var(--cnd-negro) !important;
	border-radius: 0 !important;
}
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover {
	background-color: var(--cnd-tinta) !important;
}

/* --------------------------------------------------------------------------
   El carrito y el pago no necesitan todo el ancho del lienzo: se acotan
   y se bajan las alturas para que no se vean desproporcionados.
   -------------------------------------------------------------------------- */

.woocommerce-cart .cnd-seccion,
.woocommerce-checkout .cnd-seccion,
.woocommerce-order-received .cnd-seccion {
	max-width: 1080px;
	margin-inline: auto;
}

.woocommerce table.shop_table td {
	padding-top: clamp(10px, 1.2vw, 16px);
	padding-bottom: clamp(10px, 1.2vw, 16px);
}

.woocommerce table.cart td.product-thumbnail {
	width: 76px;
}

.woocommerce table.cart td.product-thumbnail img {
	width: 76px;
}

.woocommerce table.shop_table th {
	font-size: clamp(10px, .95vw, 12px);
}

.woocommerce table.shop_table td {
	font-size: clamp(12px, 1.1vw, 15px);
}

.woocommerce table.cart td.product-name a {
	font-size: clamp(12px, 1.1vw, 15px);
}

.woocommerce .cart_totals h2 {
	font-size: clamp(16px, 1.76vw, 24px);
}

.woocommerce .cart_totals,
.woocommerce-checkout .woocommerce-checkout-review-order {
	width: min(100%, 380px);
	padding: clamp(16px, 1.8vw, 24px);
}

.woocommerce .quantity input.qty {
	width: 58px;
	padding: .4em;
}

/* El titulo de 50 px es el de las secciones de la home; en el carrito
   y el pago se baja, sin tocar el resto del sitio. */

.woocommerce-cart .cnd-titulo-seccion,
.woocommerce-checkout .cnd-titulo-seccion,
.woocommerce-account .cnd-titulo-seccion,
.woocommerce-order-received .cnd-titulo-seccion {
	font-size: clamp(20px, 2.34vw, 32px);
	margin-bottom: clamp(16px, 2vw, 28px);
}