.elementor-widget-container.premium-cursor-ftext .premium-global-cursor-{{ID}} .premium-cursor-follow-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-container .premium-global-cursor-{{ID}}{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-widget-container .premium-global-badge-{{ID}} .premium-badge-text{color:var( --e-global-color-secondary );}.elementor-widget-container.pa-bg-clipped-yes.premium-gbadge-custom .premium-global-badge-{{ID}} .premium-badge-text, .elementor-widget-container:not(.premium-gbadge-custom) .premium-global-badge-{{ID}} .premium-badge-container, .elementor-widget-container.premium-gbadge-custom:not(.pa-bg-clipped-yes) .premium-global-badge-{{ID}} .premium-badge-container{background-color:var( --e-global-color-primary );}.elementor-widget-container .premium-global-badge-{{ID}} .premium-badge-icon{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-3834 .elementor-element.elementor-element-ae50351{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3834 .elementor-element.elementor-element-ae50351:not(.elementor-motion-effects-element-type-background), .elementor-3834 .elementor-element.elementor-element-ae50351 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-3834 .elementor-element.elementor-element-3499004{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-widget-heading.premium-cursor-ftext .premium-global-cursor-{{ID}} .premium-cursor-follow-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-heading .premium-global-cursor-{{ID}}{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-widget-heading .premium-global-badge-{{ID}} .premium-badge-text{color:var( --e-global-color-secondary );}.elementor-widget-heading.pa-bg-clipped-yes.premium-gbadge-custom .premium-global-badge-{{ID}} .premium-badge-text, .elementor-widget-heading:not(.premium-gbadge-custom) .premium-global-badge-{{ID}} .premium-badge-container, .elementor-widget-heading.premium-gbadge-custom:not(.pa-bg-clipped-yes) .premium-global-badge-{{ID}} .premium-badge-container{background-color:var( --e-global-color-primary );}.elementor-widget-heading .premium-global-badge-{{ID}} .premium-badge-icon{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3834 .elementor-element.elementor-element-0e25144 > .elementor-widget-container{margin:0px 0px -10px 0px;}.elementor-3834 .elementor-element.elementor-element-0e25144{text-align:start;}.elementor-3834 .elementor-element.elementor-element-0e25144 .elementor-heading-title{font-family:"Outfit", Sans-serif;font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:0.18em;color:#E8734A;}.elementor-3834 .elementor-element.elementor-element-7611f0b > .elementor-widget-container{margin:0px 0px -10px 0px;}.elementor-3834 .elementor-element.elementor-element-7611f0b{text-align:start;}.elementor-3834 .elementor-element.elementor-element-7611f0b .elementor-heading-title{font-family:"Outfit", Sans-serif;font-size:48px;font-weight:700;color:#1A1A2E;}.elementor-3834 .elementor-element.elementor-element-0de3343{width:100%;max-width:100%;text-align:start;}.elementor-3834 .elementor-element.elementor-element-0de3343 .elementor-heading-title{font-family:"Source Sans 3", Sans-serif;font-size:13px;font-weight:500;color:#58585880;}.elementor-3834 .elementor-element.elementor-element-c1c48c5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:30px;--padding-bottom:20px;--padding-left:10px;--padding-right:10px;}.elementor-3834 .elementor-element.elementor-element-c1c48c5:not(.elementor-motion-effects-element-type-background), .elementor-3834 .elementor-element.elementor-element-c1c48c5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-widget-woocommerce-cart.premium-cursor-ftext .premium-global-cursor-{{ID}} .premium-cursor-follow-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-cart .premium-global-cursor-{{ID}}{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-widget-woocommerce-cart .premium-global-badge-{{ID}} .premium-badge-text{color:var( --e-global-color-secondary );}.elementor-widget-woocommerce-cart.pa-bg-clipped-yes.premium-gbadge-custom .premium-global-badge-{{ID}} .premium-badge-text, .elementor-widget-woocommerce-cart:not(.premium-gbadge-custom) .premium-global-badge-{{ID}} .premium-badge-container, .elementor-widget-woocommerce-cart.premium-gbadge-custom:not(.pa-bg-clipped-yes) .premium-global-badge-{{ID}} .premium-badge-container{background-color:var( --e-global-color-primary );}.elementor-widget-woocommerce-cart .premium-global-badge-{{ID}} .premium-badge-icon{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-3834 .elementor-element.elementor-element-e8232b7 .woocommerce-cart-form{--update-cart-button-alignment:start;--update-cart-button-width:auto;}.elementor-3834 .elementor-element.elementor-element-e8232b7{--sections-background-color:#FFFFFF00;--sections-border-type:none;--sections-padding:0px 0px 0px 0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3834 .elementor-element.elementor-element-3499004{--width:80%;}}/* Start custom CSS for woocommerce-cart, class: .elementor-element-e8232b7 *//*
* MAKTIVA — Carrito WooCommerce para Elementor · v7.6
* Añade la clase mk-cart-area al contenedor Elementor que envuelve
* el widget/shortcode del carrito antes de pegar este CSS.
*
* Cambios v2:
* - El resumen ya no oculta el primer pago ni el IVA: se muestran
* «pagas hoy» y la renovación mensual, diferenciados.
* - Cada fila de producto queda siempre en una sola línea en escritorio.
* - Separación entre productos estable (sin border-spacing).
* - Se oculta «Actualizar carrito» (no hay cantidades que cambiar).
* - Botón de eliminar más visible y con más área táctil en móvil.
*
* Cambios v3 (widget Carrito de Elementor Pro):
* - «Actualizar el carrito» se oculta esté donde esté.
* - Tipografías y botón de pago con prioridad sobre los estilos del widget.
* - Línea de confianza bajo el botón de pago.
* - Estilo para la línea «Pago único / Cada mes» del snippet opcional.
*
* Cambios v4:
* - Resumen en tarjeta clara: las dos columnas pesan lo mismo y solo
* destaca el botón de pago.
* - Caja «Qué pasa después» bajo el producto (snippet maktiva-carrito-tipo-pago.php).
*
* Cambios v5:
* - Tipografías con prioridad sobre el widget de Elementor (precio, etiqueta, pasos).
* - «Actualizar el carrito» oculto también en el marcado del widget de Elementor.
* - Resumen sin repeticiones: total de hoy completo y, debajo, solo
* «Después, cada mes» con el total periódico y la fecha de renovación.
* - La variación del plan («Inversión: 70€–450€») va debajo del nombre.
*
* Cambios v6 (bloque final «Colores»):
* - Tarjeta del producto blanca (ahora sí, sin quedar transparente).
* - Pasos con números en coral sólido y total de hoy resaltado.
* - Orden fijo bajo el nombre: variación y después la etiqueta de pago.
* - «Actualizar el carrito» oculto con más prioridad.
*
* Cambios v7 (bloque final «Resumen»):
* - Tarjeta del resumen con brillo cálido, título «Tu pedido», total en
* bloque destacado con «Pagas hoy», renovación en franja propia,
* botón con degradado y sello de pago seguro.
*/
.mk-cart-area {
--mk-cart-ink: #1A1A2E;
--mk-cart-coral: #E8734A;
--mk-cart-coral-dark: #C85D39;
--mk-cart-muted: rgba(26,26,46,0.58);
--mk-cart-line: rgba(26,26,46,0.10);
color: var(--mk-cart-ink);
font-family: "Source Sans 3", Arial, sans-serif;
}
/* Si la clase se añadió al propio contenedor Elementor, se elimina su caja visual. */
body .mk-cart-area,
body .mk-cart-area.elementor-element,
body .mk-cart-area > .elementor-widget-container,
body .mk-cart-area > .e-con-inner {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
outline: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
/* El widget puede heredar una caja de Astra/Elementor: se deja neutra. */
.mk-cart-area .elementor-widget-woocommerce-cart .elementor-widget-container,
.mk-cart-area .elementor-widget-woocommerce-cart .woocommerce,
.mk-cart-area .woocommerce-cart-form {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
/* ---------- Tabla convertida en tarjetas ---------- */
.mk-cart-area .woocommerce-cart-form__contents thead { display: none; }
.mk-cart-area .woocommerce-cart-form__contents,
.mk-cart-area .woocommerce-cart-form__contents tbody {
display: block;
width: 100%;
border: 0 !important;
background: transparent !important;
}
.mk-cart-area .woocommerce-cart-form__contents tr,
.mk-cart-area .woocommerce-cart-form__contents td {
border: 0 !important;
background: transparent !important;
}
.mk-cart-area .woocommerce-cart-form__cart-item {
display: grid;
grid-template-columns: 64px minmax(0, 1fr) auto 36px;
align-items: center;
column-gap: 16px;
min-height: 108px;
margin: 0 0 16px;
padding: 18px 22px !important;
border: 1px solid rgba(26,26,46,0.06) !important;
border-radius: 22px;
background: #FFFFFF !important;
box-shadow: 0 18px 42px rgba(26,26,46,0.075), inset 0 1px 0 rgba(255,255,255,0.98);
}
.mk-cart-area .woocommerce-cart-form__cart-item td {
display: block;
margin: 0 !important;
padding: 0 !important;
}
/* Todas en la fila 1: la «×» va primero en el HTML y, sin esto, parte la tarjeta en dos filas. */
.mk-cart-area .woocommerce-cart-form__cart-item .product-thumbnail { grid-column: 1; grid-row: 1; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name { grid-column: 2; grid-row: 1; min-width: 0; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal { grid-column: 3; grid-row: 1; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove { grid-column: 4; grid-row: 1; text-align: right; }
/* El plan es una contratación individual: sin precio unitario ni cantidad duplicados. */
.mk-cart-area .woocommerce-cart-form__cart-item .product-price,
.mk-cart-area .woocommerce-cart-form__cart-item td.product-quantity { display: none !important; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-thumbnail img {
display: block;
width: 56px !important;
height: 56px !important;
border-radius: 17px;
object-fit: cover;
background: linear-gradient(145deg, #FFF5F0, #FBE0D4);
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-name > a {
display: block;
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: clamp(20px, 1.5vw, 24px) !important;
font-weight: 780 !important;
letter-spacing: -0.04em;
line-height: 1.12;
text-decoration: none !important;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation,
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .subscription-details {
margin: 5px 0 0;
color: var(--mk-cart-muted);
font-size: 14px;
line-height: 1.35;
}
/* La variación queda en una línea debajo del nombre, sin la etiqueta. */
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation { display: block !important; clear: both; width: 100%; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation dt,
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation dd {
display: inline !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
color: var(--mk-cart-muted) !important;
font-family: "Source Sans 3", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation dd { margin-left: 4px !important; color: var(--mk-cart-ink) !important; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation dd p { display: inline; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation dd p { margin: 0; }
/* Línea «Pago único» / «Cada mes · sin permanencia» (snippet opcional). */
.mk-cart-area .mk-cart-item-meta {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 8px;
padding: 4px 10px;
border-radius: 999px;
background: rgba(232,115,74,0.10);
color: var(--mk-cart-coral-dark) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 12.5px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal,
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal .amount,
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal bdi {
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: clamp(21px, 1.7vw, 27px) !important;
font-weight: 800 !important;
letter-spacing: -0.04em;
text-align: right;
white-space: nowrap;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal .amount { color: var(--mk-cart-ink) !important; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal .subscription-details {
display: inline;
margin-left: 4px;
color: var(--mk-cart-muted) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 650 !important;
letter-spacing: -0.02em;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove {
display: inline-grid !important;
place-items: center;
width: 32px;
height: 32px;
border-radius: 10px;
background: transparent !important;
color: rgba(26,26,46,0.45) !important;
font-family: Arial, sans-serif !important;
font-size: 25px !important;
font-weight: 300 !important;
line-height: 1 !important;
text-decoration: none !important;
transition: color 180ms ease, background-color 180ms ease;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove::before,
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove::after { display: none !important; content: none !important; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove:hover,
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove:focus-visible {
background: rgba(232,115,74,0.10) !important;
color: var(--mk-cart-coral) !important;
}
/* ---------- Qué pasa después (snippet) ---------- */
.mk-cart-area .mk-cart-next {
margin: 0 0 16px;
padding: 22px 24px;
border: 1px solid rgba(232,115,74,0.18);
border-radius: 22px;
background: #FFF9F6;
}
.mk-cart-area .mk-cart-next small {
display: block;
color: var(--mk-cart-coral);
font-family: "Outfit", Arial, sans-serif;
font-size: 11px;
font-weight: 850;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.mk-cart-area .mk-cart-next ol {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
margin: 14px 0 0;
padding: 0;
list-style: none;
counter-reset: mknext;
}
.mk-cart-area .mk-cart-next li {
position: relative;
padding: 0 0 0 36px;
color: var(--mk-cart-muted) !important;
font-family: "Source Sans 3", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.45 !important;
counter-increment: mknext;
}
.mk-cart-area .mk-cart-next li::before {
position: absolute;
top: 0;
left: 0;
display: grid;
place-items: center;
width: 24px;
height: 24px;
border-radius: 50%;
background: rgba(232,115,74,0.14);
color: var(--mk-cart-coral);
font-family: "Outfit", Arial, sans-serif;
font-size: 12px;
font-weight: 800;
content: counter(mknext);
}
.mk-cart-area .mk-cart-next li strong {
display: block;
margin-bottom: 2px;
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 750 !important;
line-height: 1.3 !important;
}
/* ---------- Cupón ---------- */
.mk-cart-area .woocommerce-cart-form__contents tr:has(> td.actions) { display: block; }
.mk-cart-area .woocommerce-cart-form__contents .actions { display: block; padding: 4px 0 0 !important; }
/* Sin cantidades editables, «Actualizar carrito» no hace nada (esté dentro o fuera de la tabla). */
.mk-cart-area [name="update_cart"],
.mk-cart-area button[value*="ctualizar"],
.mk-cart-area input[value*="ctualizar"],
.mk-cart-area .e-cart__update-cart,
.mk-cart-area .e-update-cart { display: none !important; }
.mk-cart-area .woocommerce-cart-form__contents .actions .coupon { display: flex; flex-wrap: wrap; gap: 8px; }
.mk-cart-area .woocommerce-cart-form__contents .actions .coupon input {
min-height: 44px;
border: 1px solid var(--mk-cart-line);
border-radius: 12px;
background: rgba(255,255,255,0.72);
}
.mk-cart-area .woocommerce-cart-form__contents .actions button {
min-height: 44px;
padding: 10px 16px;
border: 1px solid var(--mk-cart-line);
border-radius: 12px;
background: #fff;
color: var(--mk-cart-ink);
font-family: "Outfit", Arial, sans-serif;
font-size: 13px;
font-weight: 700;
}
/* ---------- Resumen ---------- */
.mk-cart-area .cart-collaterals { margin-top: 18px; }
.mk-cart-area .cart-collaterals .cart_totals {
box-sizing: border-box;
float: none !important;
width: 100% !important;
padding: 26px;
border: 1px solid rgba(26,26,46,0.06);
border-radius: 24px;
background: #FFFFFF !important;
box-shadow: 0 18px 42px rgba(26,26,46,0.075);
}
/* El título visible pasa a «Resumen»; los lectores de pantalla siguen leyendo el original. */
.mk-cart-area .cart-collaterals .cart_totals h2 {
margin: 0 0 15px;
color: transparent !important;
font-size: 0;
}
.mk-cart-area .cart-collaterals .cart_totals h2::after {
display: block;
color: var(--mk-cart-coral);
font-family: "Outfit", Arial, sans-serif;
font-size: 11px;
font-weight: 850;
letter-spacing: 0.18em;
line-height: 1.2;
text-transform: uppercase;
content: "Resumen";
}
.mk-cart-area .cart-collaterals .cart_totals table,
.mk-cart-area .cart-collaterals .cart_totals th,
.mk-cart-area .cart-collaterals .cart_totals td { border-color: var(--mk-cart-line) !important; }
.mk-cart-area .cart-collaterals .cart_totals table { width: 100%; margin: 0; border-collapse: collapse; }
.mk-cart-area .cart-collaterals .cart_totals th { text-align: left; }
.mk-cart-area .cart-collaterals .cart_totals td { text-align: right; }
.mk-cart-area .cart-collaterals .cart_totals th,
.mk-cart-area .cart-collaterals .cart_totals td {
padding: 12px 0 !important;
color: var(--mk-cart-muted) !important;
font-family: "Source Sans 3", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 600 !important;
}
.mk-cart-area .cart-collaterals .cart_totals td .amount,
.mk-cart-area .cart-collaterals .cart_totals td .woocommerce-Price-amount { color: var(--mk-cart-ink) !important; }
/* Lo que se paga hoy: destacado. */
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) .amount {
padding-top: 18px !important;
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 24px !important;
font-weight: 800 !important;
letter-spacing: -0.035em;
}
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) .includes_tax { display: block; font-size: 12px; font-weight: 500; color: var(--mk-cart-muted) !important; }
/* Renovación: sin repetir subtotal e IVA; solo el total periódico, con su etiqueta. */
.mk-cart-area .cart-collaterals .cart_totals tr.recurring-totals,
.mk-cart-area .cart-collaterals .cart_totals tr.cart-subtotal.recurring-total,
.mk-cart-area .cart-collaterals .cart_totals tr.tax-rate.recurring-total,
.mk-cart-area .cart-collaterals .cart_totals tr.tax-total.recurring-total { display: none !important; }
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total td {
padding-top: 16px !important;
color: var(--mk-cart-muted) !important;
font-family: "Source Sans 3", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
vertical-align: top;
}
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th { font-size: 0 !important; }
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th::before {
display: block;
color: var(--mk-cart-coral);
font-family: "Outfit", Arial, sans-serif;
font-size: 11px;
font-weight: 850;
letter-spacing: 0.14em;
line-height: 1.6;
text-transform: uppercase;
content: "Después, cada mes";
}
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total td .amount,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total td bdi {
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 17px !important;
font-weight: 800 !important;
}
.mk-cart-area .cart-collaterals .cart_totals tr.recurring-total small,
.mk-cart-area .cart-collaterals .cart_totals tr.recurring-total .first-payment-date {
display: block;
margin-top: 3px;
color: var(--mk-cart-muted) !important;
font-size: 12.5px !important;
font-weight: 400 !important;
}
/* El total de hoy, con la etiqueta en tinta (el widget la pone gris). */
body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th { color: var(--mk-cart-ink) !important; }
/* ---------- Botón de pago ---------- */
.mk-cart-area .wc-proceed-to-checkout { margin: 22px 0 0 !important; padding: 0 !important; }
.mk-cart-area .wc-proceed-to-checkout a.checkout-button,
.mk-cart-area .wc-proceed-to-checkout .checkout-button.button {
display: flex !important;
align-items: center;
justify-content: center;
gap: 8px;
box-sizing: border-box;
min-height: 54px;
margin: 0 !important;
padding: 14px 22px !important;
border: 0 !important;
border-radius: 999px !important;
background: var(--mk-cart-coral) !important;
color: #fff !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 760 !important;
letter-spacing: -0.02em;
box-shadow: 0 14px 25px rgba(232,115,74,0.23);
text-decoration: none !important;
transition: transform 180ms ease, background-color 180ms ease;
}
.mk-cart-area .wc-proceed-to-checkout a.checkout-button::after { content: "→"; font-weight: 700; }
.mk-cart-area .wc-proceed-to-checkout a.checkout-button:hover {
background: var(--mk-cart-coral-dark) !important;
transform: translateY(-2px);
}
/* Línea de confianza bajo el botón. */
.mk-cart-area .wc-proceed-to-checkout::after {
display: block;
margin-top: 14px;
color: var(--mk-cart-muted);
font-family: "Source Sans 3", Arial, sans-serif;
font-size: 13px;
line-height: 1.4;
text-align: center;
content: "🔒 Pago seguro con Stripe · Factura en tu área de cliente";
}
/* ---------- Carrito vacío ---------- */
.mk-cart-area .cart-empty,
.mk-cart-area .return-to-shop {
max-width: 680px;
margin-right: auto;
margin-left: auto;
text-align: center;
}
.mk-cart-area .cart-empty {
padding: 34px 24px 10px;
color: var(--mk-cart-ink);
font-family: "Outfit", Arial, sans-serif;
font-size: 22px;
font-weight: 730;
}
.mk-cart-area .return-to-shop .button {
display: inline-flex;
align-items: center;
min-height: 50px;
padding: 13px 21px;
border-radius: 999px;
background: var(--mk-cart-coral);
color: #fff;
font-family: "Outfit", Arial, sans-serif;
font-weight: 730;
text-decoration: none;
}
/* ---------- Móvil ---------- */
@media (max-width: 767px) {
.mk-cart-area .woocommerce-cart-form__cart-item {
grid-template-columns: 62px minmax(0, 1fr) 40px;
column-gap: 14px;
row-gap: 9px;
min-height: 0;
padding: 20px !important;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-thumbnail { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name { grid-column: 2; grid-row: 1; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-subtotal { grid-column: 2; grid-row: 2; font-size: 24px; text-align: left; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove { grid-column: 3; grid-row: 1; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-thumbnail img {
width: 58px !important;
height: 58px !important;
border-radius: 18px;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-name > a { font-size: 21px; }
/* Área táctil de 40 px para eliminar. */
.mk-cart-area .woocommerce-cart-form__cart-item .product-remove a.remove { width: 40px; height: 40px; }
.mk-cart-area .cart-collaterals .cart_totals { padding: 23px 20px; border-radius: 22px; }
.mk-cart-area .mk-cart-next { padding: 20px; }
.mk-cart-area .mk-cart-next ol { grid-template-columns: 1fr; }
}
/* =====================================================================
v6 · COLORES Y ACABADO
===================================================================== */
/* «Actualizar el carrito»: máxima prioridad frente al widget. */
html body .mk-cart-area button[name="update_cart"],
html body .mk-cart-area input[name="update_cart"],
html body .mk-cart-area .elementor-widget-woocommerce-cart button[name="update_cart"] { display: none !important; }
/* El símbolo € al mismo tamaño que la cifra. */
.mk-cart-area .woocommerce-Price-currencySymbol { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; }
/* Etiqueta «Total» en tinta, por encima del gris del widget. */
html body .mk-cart-area .cart_totals tr.order-total:not(.recurring-total) th { color: var(--mk-cart-ink) !important; }
/* ---------- Tarjeta del producto: blanca ---------- */
/* «tr.» da la prioridad necesaria frente a la regla que deja las filas transparentes. */
.mk-cart-area .woocommerce-cart-form__contents tr.woocommerce-cart-form__cart-item {
border: 1px solid rgba(26,26,46,0.06) !important;
background: #FFFFFF !important;
box-shadow: 0 18px 42px rgba(26,26,46,0.075) !important;
}
/* Columna del nombre: nombre → variación → etiqueta, siempre en ese orden. */
.mk-cart-area .woocommerce-cart-form__cart-item .product-name {
display: flex !important;
flex-direction: column;
align-items: flex-start;
gap: 6px;
}
.mk-cart-area .woocommerce-cart-form__cart-item .product-name > br { display: none; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name > a { order: 0; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .variation { order: 1; margin: 0 !important; }
.mk-cart-area .woocommerce-cart-form__cart-item .product-name .mk-cart-item-meta { order: 2; margin-top: 4px; }
/* ---------- Qué pasa después ---------- */
.mk-cart-area .mk-cart-next {
border-color: rgba(232,115,74,0.22);
background: linear-gradient(135deg, #FFF8F4 0%, #FFEFE7 100%);
}
.mk-cart-area .mk-cart-next li::before {
background: var(--mk-cart-coral);
color: #FFFFFF;
box-shadow: 0 6px 14px rgba(232,115,74,0.30);
}
/* ---------- Resumen ---------- */
.mk-cart-area .cart-collaterals .cart_totals {
border-top: 4px solid var(--mk-cart-coral) !important;
}
/* Total de hoy dentro de una franja cálida. */
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td {
padding: 16px 16px !important;
border: 0 !important;
background: #FFF4EE !important;
}
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th { border-radius: 14px 0 0 14px; }
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td { border-radius: 0 14px 14px 0; }
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td .amount,
.mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td bdi { color: var(--mk-cart-coral-dark) !important; }
/* Separación clara antes del pago periódico. */
.mk-cart-area .cart-collaterals .cart_totals tr.recurring-total th,
.mk-cart-area .cart-collaterals .cart_totals tr.recurring-total td { border-top: 0 !important; }
/* =====================================================================
v7 · RESUMEN MÁS ATRACTIVO
===================================================================== */
html body .mk-cart-area .cart-collaterals .cart_totals {
position: relative;
overflow: hidden;
padding: 30px 28px 26px !important;
border: 1px solid rgba(232,115,74,0.18) !important;
border-top: 1px solid rgba(232,115,74,0.18) !important;
border-radius: 28px !important;
background:
radial-gradient(90% 70% at 100% 0%, rgba(232,115,74,0.16) 0%, rgba(232,115,74,0) 60%),
radial-gradient(70% 60% at 0% 100%, rgba(59,130,246,0.06) 0%, rgba(59,130,246,0) 60%),
linear-gradient(180deg, #FFFFFF 0%, #FFFAF7 100%) !important;
box-shadow: 0 24px 54px rgba(26,26,46,0.10), inset 0 1px 0 #FFFFFF !important;
}
/* Cabecera: «Resumen» pequeño + «Tu pedido» grande. */
html body .mk-cart-area .cart-collaterals .cart_totals h2 { margin: 0 0 18px !important; }
html body .mk-cart-area .cart-collaterals .cart_totals h2::before {
display: block;
margin-bottom: 6px;
color: var(--mk-cart-coral);
font-family: "Outfit", Arial, sans-serif;
font-size: 11px;
font-weight: 850;
letter-spacing: 0.18em;
line-height: 1.2;
text-transform: uppercase;
content: "Resumen";
}
html body .mk-cart-area .cart-collaterals .cart_totals h2::after {
color: var(--mk-cart-ink) !important;
font-family: "Outfit", Arial, sans-serif;
font-size: 26px !important;
font-weight: 780;
letter-spacing: -0.045em !important;
line-height: 1.1;
text-transform: none !important;
content: "Tu pedido" !important;
}
/* Filas: separadores punteados suaves. */
html body .mk-cart-area .cart-collaterals .cart_totals tr.cart-subtotal:not(.recurring-total) th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.cart-subtotal:not(.recurring-total) td,
html body .mk-cart-area .cart-collaterals .cart_totals tr.tax-total:not(.recurring-total) th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.tax-total:not(.recurring-total) td,
html body .mk-cart-area .cart-collaterals .cart_totals tr.tax-rate:not(.recurring-total) th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.tax-rate:not(.recurring-total) td {
border: 0 !important;
border-bottom: 1px dashed rgba(26,26,46,0.12) !important;
}
/* Total de hoy: bloque coral con «Pagas hoy». */
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td {
padding: 18px 18px !important;
background: #FFE9DE !important;
vertical-align: middle;
}
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th { border-radius: 16px 0 0 16px !important; }
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td { border-radius: 0 16px 16px 0 !important; }
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) th::before {
display: block;
margin-bottom: 2px;
color: var(--mk-cart-coral-dark);
font-family: "Outfit", Arial, sans-serif;
font-size: 10.5px;
font-weight: 850;
letter-spacing: 0.16em;
line-height: 1.2;
text-transform: uppercase;
content: "Pagas hoy";
}
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td .amount,
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total:not(.recurring-total) td bdi {
color: var(--mk-cart-coral-dark) !important;
font-size: 30px !important;
}
/* Renovación: franja propia, discreta. */
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total td {
padding: 14px 18px !important;
border: 0 !important;
background: rgba(26,26,46,0.04) !important;
}
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th { border-radius: 14px 0 0 14px !important; }
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total th { white-space: nowrap; }
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total.recurring-total td { border-radius: 0 14px 14px 0 !important; }
/* Separación entre el total de hoy y la renovación. */
html body .mk-cart-area .cart-collaterals .cart_totals table { border-collapse: separate !important; border-spacing: 0 8px !important; }
/* Botón con degradado y brillo. */
html body .mk-cart-area .wc-proceed-to-checkout a.checkout-button,
html body .mk-cart-area .wc-proceed-to-checkout .checkout-button.button {
background: linear-gradient(135deg, #F08A5D 0%, #E8734A 45%, #D25F38 100%) !important;
box-shadow: 0 16px 30px rgba(232,115,74,0.32), inset 0 1px 0 rgba(255,255,255,0.28) !important;
}
html body .mk-cart-area .wc-proceed-to-checkout a.checkout-button:hover {
background: linear-gradient(135deg, #E8734A 0%, #D25F38 100%) !important;
}
/* Sello de pago seguro en una píldora. */
html body .mk-cart-area .wc-proceed-to-checkout::after {
width: fit-content;
margin: 16px auto 0 !important;
padding: 7px 14px;
border-radius: 999px;
background: rgba(34,197,94,0.09);
color: #168A4A !important;
font-family: "Outfit", Arial, sans-serif !important;
font-size: 12.5px !important;
font-weight: 700;
content: "🔒 Pago seguro con Stripe · Factura al instante" !important;
}
/* =====================================================================
v7.1 · ALINEACIÓN
La tarjeta del producto y el resumen empiezan a la misma altura.
===================================================================== */
html body .mk-cart-area .cart-collaterals,
html body .mk-cart-area .cart-collaterals .cart_totals,
html body .mk-cart-area .e-cart-totals,
html body .mk-cart-area .woocommerce-cart-form,
html body .mk-cart-area .woocommerce-cart-form__contents { margin-top: 0 !important; }
html body .mk-cart-area .e-cart__column > :first-child,
html body .mk-cart-area .e-cart__column-inner > :first-child,
html body .mk-cart-area .e-cart-section:first-child { margin-top: 0 !important; padding-top: 0 !important; }
/* En móvil, cuando el resumen baja debajo del producto, se mantiene la separación. */
@media (max-width: 1024px) {
html body .mk-cart-area .cart-collaterals { margin-top: 18px !important; }
}
/* =====================================================================
v7.2 · RESUMEN ALINEADO CON EL TÍTULO DE LA PÁGINA (solo escritorio)
Ajusta --mk-summary-lift si el resumen queda alto o bajo.
===================================================================== */
.mk-cart-area { --mk-summary-lift: 135px; }
@media (min-width: 1280px) {
/* Solo en la tarjeta del resumen, para no sumar el desplazamiento dos veces. */
html body .mk-cart-area .cart-collaterals .cart_totals {
position: relative;
z-index: 2;
margin-top: calc(var(--mk-summary-lift) * -1) !important;
}
}
/* =====================================================================
v7.3 · PRECIOS ALINEADOS
Subtotal e IVA con el mismo margen lateral que los bloques de Total y
«Después, cada mes», para que etiquetas y cifras queden en la misma línea.
===================================================================== */
html body .mk-cart-area .cart-collaterals .cart_totals tr:not(.order-total):not(.recurring-totals) th,
html body .mk-cart-area .cart-collaterals .cart_totals tr:not(.order-total):not(.recurring-totals) td {
padding-right: 18px !important;
padding-left: 18px !important;
}
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total th,
html body .mk-cart-area .cart-collaterals .cart_totals tr.order-total td {
padding-right: 18px !important;
padding-left: 18px !important;
}
/* =====================================================================
v7.6 · ESQUINAS DEL TOTAL Y DE «DESPUÉS, CADA MES»
En el widget Carrito de Elementor la celda | está oculta y la etiqueta
(«Total», «Después, cada mes») la pinta la propia | con ::before.
Por eso la | es el bloque entero y lleva el redondeo en las 4 esquinas.
===================================================================== */
html body .mk-cart-area .cart-collaterals .cart_totals:not(#mk-a):not(#mk-b) tr.order-total:not(.recurring-total) > td { border-radius: 16px !important; }
html body .mk-cart-area .cart-collaterals .cart_totals:not(#mk-a):not(#mk-b) tr.order-total.recurring-total > td { border-radius: 14px !important; }/* End custom CSS */ |