/* Metacrilato Gestor — página del CARRITO (is_cart()). Lienzo gris a todo el ancho, dos columnas blancas, bentos por producto, totales, selector de transporte, botonera y avisos. Los iconos llegan como variables CSS (--mc-ico-*) de Gestor → Textos e iconos; aquí no hay ninguna ruta escrita a mano. */ /* Botones: geometría, colores y tipos en assets/css/buttons.css (bloque I). */ /* Contenido a todo el ancho: anulamos el padding lateral del contenedor del tema */ /* (que metía 24px por lado) y ponemos el lienzo gris con 15px EXACTOS de margen, */ /* sin usar 100vw (que arrastraría el ancho de la barra de desplazamiento). */ .woocommerce-cart .content-container.site-container{padding-left: 0;padding-right: 0;max-width: none;} .woocommerce-cart .entry-content-wrap{background: transparent;box-shadow: none;padding: 0;max-width: none;} .woocommerce-cart article.content-bg,.woocommerce-cart .single-entry.content-bg{background: transparent;box-shadow: none;border: 0;} .woocommerce-cart .entry-content,.woocommerce-cart .entry-content.single-content{max-width: none;} .woocommerce-cart .woocommerce{background:var(--mc-fondo-suave);box-sizing:border-box;padding:15px 15px 40px;margin:0;color:var(--mc-texto);width:auto;} .woocommerce-cart .woocommerce::before,.woocommerce-cart .woocommerce::after{display: none;} /* Avisos (notices) dentro del gris, a ancho completo. Cuando está vacío no */ /* debe empujar (así el gap cabecera->columnas queda en 15px, el del lienzo). */ .woocommerce-cart .woocommerce-notices-wrapper{margin:0 0 15px;} .woocommerce-cart .woocommerce-notices-wrapper:empty{margin: 0;} /* Dos columnas: productos (izq) + totales (der), separadas 15px. */ .woocommerce-cart .kadence-woo-cart-form-wrap{display:flex;gap:15px;align-items:flex-start;margin:0;} /* El clearfix del tema (::before/::after) se vuelve ítem fantasma en flex y mete hueco. Fuera. */ .woocommerce-cart .kadence-woo-cart-form-wrap::before,.woocommerce-cart .kadence-woo-cart-form-wrap::after{display: none;} @media (max-width:1024px){.woocommerce-cart .kadence-woo-cart-form-wrap{flex-direction:column;}} /* Columna izquierda: productos (base blanca). */ .woocommerce-cart .woocommerce-cart-form{order:1;flex:0 0 calc(75% - 7.5px);min-width:0;background:var(--mc-fondo);border-radius:var(--mc-radio-tarjeta);box-shadow:var(--mc-sombra-tarjeta);padding:20px;margin:0;box-sizing:border-box;} /* Columna derecha: totales (base blanca). */ .woocommerce-cart .cart-collaterals{order:2;flex:0 0 calc(25% - 7.5px);min-width:0;background:var(--mc-fondo);border-radius:var(--mc-radio-tarjeta);box-shadow:var(--mc-sombra-tarjeta);padding:20px;margin:0;box-sizing:border-box;} .woocommerce-cart .cart-collaterals .cart_totals{width: 100%;float: none;margin:0;} @media (max-width:1024px){.woocommerce-cart .cart-collaterals{flex:1 1 auto;width:100%;max-width:none;}} /* Sticky como en el configurador: en escritorio, la columna más corta se queda */ /* fija al hacer scroll mientras la otra sigue teniendo contenido debajo. */ @media (min-width:1025px){.woocommerce-cart .woocommerce-cart-form,.woocommerce-cart .cart-collaterals{position:sticky;top:15px;align-self:flex-start;}} /* 14-09-2026: las reglas del bento de artículo (.mc-cart-bento, .mc-cb-*) están en cart-bento.css, compartido con la página de gracias y "Ver pedido". */ /* Fila de acciones del carrito (cupón / actualizar). */ .woocommerce-cart .mc-cart-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:flex-end;margin:5px 0 0;} /* Cupones ocultos (no se usan por ahora). */ .woocommerce-cart .mc-cart-actions .coupon{display:none !important;} /* "Actualizar carrito": enlace negro subrayado (sin botón) con icono arrows-clockwise. */ .woocommerce-cart .mc-cart-actions button[name="update_cart"]::before{content:"";display:inline-block;width:16px;height:16px;flex:0 0 auto;background-color:currentColor;-webkit-mask:var(--mc-ico-cart-actualizar) no-repeat center / contain;mask:var(--mc-ico-cart-actualizar) no-repeat center / contain;} /* "Actualizar carrito" siempre en negro (WooCommerce lo deja deshabilitado -> opacity .5). */ .woocommerce-cart .mc-cart-actions button[name="update_cart"],.woocommerce-cart .mc-cart-actions button[name="update_cart"]:disabled,.woocommerce-cart .mc-cart-actions button[name="update_cart"][disabled]{opacity:1 !important;color:var(--mc-texto) !important;} /* ====================== COLUMNA DERECHA: TOTALES ====================== */ /* Encabezado de la columna. */ /* Cabeceras de columna: mismo tamaño y grosor, alineadas (izquierda y derecha). */ .woocommerce-cart .cart-summary h2,.woocommerce-cart .cart_totals h2{font-size: var(--mc-fs-titulo);font-weight: var(--mc-peso-titulo);line-height: 1.2;color:var(--mc-texto);margin: 0 0 15px;padding: 0;text-align:left;text-transform:none;} /* Tabla de totales dentro de un BENTO (gris), como los artículos de la izquierda. */ /* Convertimos la tabla en bloque/flex para controlar anchos con normalidad */ /* (así la fila de envío puede ocupar todo el ancho sin el reparto de columnas). */ .woocommerce-cart .cart_totals .shop_table{background: var(--mc-fondo-suave);border: 1px solid var(--mc-borde);border-radius: var(--mc-radio-bento);padding:14px 16px !important;margin:0 !important;width:100%;box-sizing:border-box;display:block;border-collapse:collapse;} .woocommerce-cart .cart_totals .shop_table tbody{display:block;width:100%;} .woocommerce-cart .cart_totals .shop_table tr{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;width:100%;box-sizing:border-box;} .woocommerce-cart .cart_totals .shop_table th,.woocommerce-cart .cart_totals .shop_table td{border:0 !important;padding:0;background: transparent;} .woocommerce-cart .cart_totals .shop_table th{font-weight:var(--mc-peso-titulo);color:var(--mc-texto-2);text-align:left;white-space:nowrap;} .woocommerce-cart .cart_totals .shop_table td{text-align:right;color:var(--mc-texto);} .woocommerce-cart .cart_totals .order-total th{font-weight:var(--mc-peso-fuerte);color:var(--mc-texto);} .woocommerce-cart .cart_totals .order-total td strong{font-weight:var(--mc-peso-fuerte);color:var(--mc-texto);font-size:1.1em;} /* Fila de envío a ancho completo: título arriba, opciones apiladas debajo. */ .woocommerce-cart .cart_totals .shop_table tr.woocommerce-shipping-totals{display:block !important;width:100%;padding:8px 0;} .woocommerce-cart .cart_totals .woocommerce-shipping-totals th,.woocommerce-cart .cart_totals .woocommerce-shipping-totals td{display:block;width:100%;box-sizing:border-box;text-align:left;padding:0;} .woocommerce-cart .cart_totals .woocommerce-shipping-totals th{font-size:var(--mc-fs-mini);text-transform:uppercase;letter-spacing:.04em;color:var(--mc-texto-2);font-weight:var(--mc-peso-fuerte);padding:0 0 8px;} /* 04-10-2026 · Totales en móvil. Por debajo de 768px WooCommerce esconde el rótulo de cada fila (th), lo repite */ /* dentro de la celda (td::before, en negrita y con dos puntos) y sombrea filas alternas. Con nuestras filas en */ /* flex la celda se quedaba a la izquierda, con el importe pegado al rótulo. Se deja como en escritorio: */ /* rótulo a la izquierda, importe a la derecha, sin rótulo repetido ni franjas. */ @media (max-width:768px){.woocommerce-cart .cart_totals .shop_table tr th{display:block !important;}.woocommerce-cart .cart_totals .shop_table tr td::before{content:none !important;display:none !important;}.woocommerce-cart .cart_totals .shop_table tr td{background:transparent !important;}.woocommerce-cart .cart_totals .shop_table tr:not(.woocommerce-shipping-totals) td{text-align:right !important;}} /* Selector de transporte: tarjetas apiladas, igual que el configurador de planchas. */ .woocommerce-cart .cart_totals #shipping_method{list-style:none !important;margin:0 !important;padding:0 !important;display:flex !important;flex-direction:column;gap:8px;width:100%;} .woocommerce-cart .cart_totals #shipping_method li{margin:0 !important;padding:0 !important;width:100%;list-style:none !important;} .woocommerce-cart .cart_totals #shipping_method li::before{display:none !important;} .woocommerce-cart .cart_totals #shipping_method li input.shipping_method{position:absolute !important;opacity:0 !important;width:0 !important;height:0 !important;margin:0 !important;pointer-events:none;} .woocommerce-cart .cart_totals #shipping_method li label{display:flex !important;align-items:center;gap:10px;width:100% !important;box-sizing:border-box;margin:0 !important;padding:8px 10px !important;border-radius:var(--mc-radio-bento);cursor:pointer;font-weight:var(--mc-peso-titulo);color:var(--mc-texto);transition:background-color .15s ease,box-shadow .15s ease;} .woocommerce-cart .cart_totals #shipping_method li label:hover{background:var(--mc-fondo-hover);} .woocommerce-cart .cart_totals #shipping_method li:has(input.shipping_method:checked) label{background:var(--mc-fondo);box-shadow:var(--mc-sombra-seleccion);} .woocommerce-cart .cart_totals #shipping_method .mc-ship-name{flex:1 1 auto;font-size:var(--mc-fs-compacto);font-weight:var(--mc-peso-titulo);} .woocommerce-cart .cart_totals #shipping_method .mc-ship-cost{margin-left:auto;flex:0 0 auto;font-size:var(--mc-fs-compacto);font-weight:var(--mc-peso-fuerte);color:var(--mc-texto-2);white-space:nowrap;} /* Botonera: Finalizar compra (píldora) + Guardar presupuesto (texto). */ .woocommerce-cart .wc-proceed-to-checkout{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-top:16px;padding:0;} /* "Finalizar compra": píldora gemela del configurador (antracita), icono seal-check a la izquierda, texto centrado. */ /* ====================== AVISOS (notices) ====================== */ /* Tarjeta OSCURA con letras blancas e icono coloreado segun el tipo */ /* (exito=verde seal-check, info=azul info, error=rojo warning), con el */ /* mismo aspecto que el aviso de dimensiones (.mc-aviso: fondo #374151, */ /* radio 8px, sin borde). Sustituye las barras de color del tema. */ .woocommerce-cart .woocommerce-message,.woocommerce-cart .woocommerce-info,.woocommerce-cart .woocommerce-error{position:relative !important;background:var(--mc-aviso) !important;border:0 !important;border-radius:var(--mc-radio-bento) !important;box-shadow:none !important;margin:0 0 15px !important;padding:14px 16px 14px 46px !important;color:var(--mc-boton-texto) !important;font-size:var(--mc-fs-compacto) !important;line-height:1.5 !important;list-style:none !important;overflow:hidden;} /* Icono comun (mask recoloreable), arriba a la izquierda alineado con la 1a linea. */ .woocommerce-cart .woocommerce-message::before,.woocommerce-cart .woocommerce-info::before,.woocommerce-cart .woocommerce-error::before{content:"" !important;position:absolute !important;left:16px !important;top:15px !important;width:20px !important;height:20px !important;margin:0 !important;background:none;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;} .woocommerce-cart .woocommerce-message::before{background-color:var(--mc-ok) !important;-webkit-mask-image:var(--mc-ico-aviso-ok);mask-image:var(--mc-ico-aviso-ok);} .woocommerce-cart .woocommerce-info::before{background-color:var(--mc-enlace-claro) !important;-webkit-mask-image:var(--mc-ico-aviso-info);mask-image:var(--mc-ico-aviso-info);} .woocommerce-cart .woocommerce-error::before{background-color:var(--mc-error-claro) !important;-webkit-mask-image:var(--mc-ico-aviso-error);mask-image:var(--mc-ico-aviso-error);} /* El tipo error es