.elementor-55 .elementor-element.elementor-element-a16205d{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:2em;--padding-bottom:4em;--padding-left:0em;--padding-right:0em;}.elementor-55 .elementor-element.elementor-element-ae526b8{--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:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0em;--padding-bottom:0em;--padding-left:0em;--padding-right:0em;}.elementor-55 .elementor-element.elementor-element-160823c{--update-cart-automatically-display:none;--sections-border-type:solid;--sections-border-color:#E9E9E9;--sections-border-radius:4px 4px 4px 4px;--sections-padding:0px 0px 0px 0px;--sections-title-color:var( --e-global-color-text );--sections-radio-buttons-color:var( --e-global-color-secondary );--order-summary-color:var( --e-global-color-text );--product-link-normal-color:var( --e-global-color-text );--order-summary-quantity-border-weight:1px;--order-summary-remove-icon-normal-color:var( --e-global-color-secondary );--totals-rows-gap-top:calc( 3em/2 );--totals-rows-gap-bottom:calc( 3em/2 );--checkout-button-border-radius:50px 50px 50px 50px;}.elementor-55 .elementor-element.elementor-element-160823c .woocommerce .wc-proceed-to-checkout .checkout-button{background-color:var( --e-global-color-primary );}.elementor-55 .elementor-element.elementor-element-160823c .woocommerce .wc-proceed-to-checkout .checkout-button:hover{background-color:var( --e-global-color-secondary );}.elementor-55 .elementor-element.elementor-element-160823c > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0em 0em 8em 0em;}.elementor-55 .elementor-element.elementor-element-160823c .e-cart-section{border-width:0px 0px 0px 0px;}.elementor-55 .elementor-element.elementor-element-160823c .cart_totals h2{font-family:"Roboto", Sans-serif;font-size:1rem;text-transform:uppercase;}.elementor-55 .elementor-element.elementor-element-160823c {--sections-descriptions-color:var( --e-global-color-secondary );}.elementor-55 .elementor-element.elementor-element-160823c .e-cart-content, .elementor-55 .elementor-element.elementor-element-160823c .woocommerce-shipping-destination, .elementor-55 .elementor-element.elementor-element-160823c .shipping-calculator-button{font-family:"Roboto", Sans-serif;font-size:1rem;}.elementor-55 .elementor-element.elementor-element-160823c #shipping_method li label{font-family:"Roboto", Sans-serif;font-size:1rem;}.elementor-55 .elementor-element.elementor-element-160823c .woocommerce-cart-form{--order-summary-title-color:var( --e-global-color-text );}.elementor-55 .elementor-element.elementor-element-160823c .e-shop-table .cart th, .elementor-55 .elementor-element.elementor-element-160823c .e-shop-table .cart td:before{font-family:"Roboto", Sans-serif;font-size:1rem;}.elementor-55 .elementor-element.elementor-element-160823c .checkout-button{font-family:"Roboto", Sans-serif;font-size:1rem;text-transform:uppercase;}.elementor-55 .elementor-element.elementor-element-160823c .e-cart-totals{--sections-padding:0em 2em 2em 2em;--sections-descriptions-color:var( --e-global-color-text );}.elementor-55 .elementor-element.elementor-element-160823c .cart_totals{--sections-title-color:var( --e-global-color-text );}.elementor-55 .elementor-element.elementor-element-160823c .e-cart-totals .e-cart-content, .elementor-55 .elementor-element.elementor-element-160823c .e-cart-totals .woocommerce-shipping-destination, .elementor-55 .elementor-element.elementor-element-160823c .e-cart-totals .shipping-calculator-button{font-family:"Roboto", Sans-serif;font-size:1rem;}@media(max-width:767px){.elementor-55 .elementor-element.elementor-element-a16205d{--width:100%;--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;--justify-content:center;--align-items:center;}.elementor-55 .elementor-element.elementor-element-ae526b8{--width:90%;}.elementor-55 .elementor-element.elementor-element-160823c{--totals-title-alignment:center;--totals-rows-gap-top:calc( 3em/2 );--totals-rows-gap-bottom:calc( 3em/2 );}}@media(min-width:768px){.elementor-55 .elementor-element.elementor-element-a16205d{--width:100%;}.elementor-55 .elementor-element.elementor-element-ae526b8{--width:80%;}}@media(max-width:1200px) and (min-width:768px){.elementor-55 .elementor-element.elementor-element-ae526b8{--width:90%;}}@media(min-width:2400px){.elementor-55 .elementor-element.elementor-element-160823c > .elementor-widget-container{padding:0% 0% 0% 0%;}}/* Start custom CSS for woocommerce-cart, class: .elementor-element-160823c *//* --- LIMPIEZA EXTREMA DEL CARRITO --- */

/* 1. Ocultar todos los campos de dirección (País, Estado, CP) */
.woocommerce-cart .shipping-calculator-form {
    display: none !important;
}

/* 2. Ocultar el enlace de "Cambiar dirección" o "Calcular envío" */
.woocommerce-cart .shipping-calculator-button {
    display: none !important;
}

/* 3. (Opcional) Si aparece una frase como "Enviar a..." y quieres quitarla también */
.woocommerce-cart .woocommerce-shipping-destination {
    display: none !important;
}

/* --- COLOR DE NOMBRE DE PRODUCTO EN EL CARRITO --- */

/* 1. Cambiar el texto a Naranja United Appliances */
.woocommerce-cart .product-name a {
    color: #ec7700 !important;
    text-decoration: none; /* Quita el subrayado si no te gusta */
    font-weight: 600; /* Lo hace un poco más gordito para que resalte */
}

/* 2. Color al pasar el mouse por encima (Opcional: un naranja más oscuro) */
.woocommerce-cart .product-name a:hover {
    color: #707070 !important; 
}


/* --- AGRANDAR IMAGEN DE PRODUCTO EN EL CARRITO --- */

/* 1. Ajustar la celda (el espacio donde va la imagen) */
/* Si no hacemos esto, la imagen grande se puede encimar al texto */
.woocommerce-cart table.cart td.product-thumbnail {
    min-width: 120px !important; /* Ancho mínimo de la columna */
    padding-right: 20px !important; /* Espacio entre imagen y nombre */
}

/* 2. Ajustar la imagen en sí */
.woocommerce-cart table.cart .product-thumbnail img {
    width: 120px !important;    /* <-- CAMBIA ESTE VALOR AL GUSTO (ej. 150px) */
    height: auto !important;    /* Mantiene la proporción para que no se deforme */
    max-width: none !important; /* Permite que crezca más de lo que dice el tema */
}







/* --- QUITAR LOS DOS PUNTOS SOBRANTES ENCIMA DE LA FOTO --- */
@media (max-width: 880px) {
    /* Esto borra la etiqueta automática solo de la columna de la foto */
    .woocommerce-cart table.cart .product-thumbnail::before {
        content: "" !important;
        display: none !important;
    }
}





/* --- FORZAR IMAGEN EN EL CARRITO DE MÓVIL --- */
@media (max-width: 880px) {
    /* 1. Hacer visible la columna de la foto */
    .woocommerce-cart table.cart .product-thumbnail {
        display: block !important; /* La "despierta" porque estaba oculta */
        text-align: center !important; /* Centra la foto */
        width: 100% !important;
        border: none !important; /* Quita bordes extraños */
        padding-bottom: 10px !important;
    }

    /* 2. Ajustar el tamaño de la foto para que no sea gigante */
    .woocommerce-cart table.cart .product-thumbnail img {
        width: 150px !important; /* Tamaño ideal para celular */
        height: auto !important;
        margin: 0 auto;
    }
    
    /* 3. (Opcional) Ajuste para que no se pegue al botón de borrar */
    .woocommerce-cart table.cart .product-remove {
        position: absolute; /* Mantiene la X en la esquina */
        right: 0;
        top: 0;
    }
}






/* --- MOVER LA "X" A LA DERECHA EN MÓVIL --- */
@media (max-width: 880px) {
    .woocommerce-cart table.cart .product-remove {
        position: absolute !important;
        top: 0px !important;      /* Ajuste vertical (más arriba/abajo) */
        right: 0px !important;    /* Ajuste horizontal: 0 es pegado al borde derecho */
        width: auto !important;
        border: none !important;  /* Quita bordes raros */
        padding: 1em !important; /* Un poco de área para que sea fácil de tocar con el dedo */
        background: transparent !important;
        z-index: 10;              /* Asegura que quede por encima de la foto */
    }
}


/* --- ESTILO CABECERA TABLA DE CARRITO (Gris Oscuro) --- */

/* 1. Aplicar fondo gris y texto blanco a la fila de títulos */
.woocommerce-cart .shop_table thead th {
    background-color: #707070 !important; /* El Gris Oscuro de tu referencia */
    color: #ffffff !important;            /* Texto Blanco */
    text-transform: uppercase !important; /* Todo en mayúsculas */
    font-weight: 700 !important;          /* Negrita */
    padding: 0.7em  0.7em !important;        /* Un poco de aire arriba y abajo */
    border: none !important;              /* Quitamos bordes para que se vea limpio */
    font-size: 0.7rem !important;         /* Tamaño de letra ajustado */
}





/* --- ESTILO DE LA CAJA DE TOTALES (MATCH CON TABLA) --- */

/* 1. TÍTULO "TOTALES DEL CARRITO" (Cabecera Gris) */
.cart_totals h2 {
    background-color: #707070 !important;   /* El mismo Gris Oscuro de tu tabla */
    color: #ffffff !important;             /* Texto Blanco */
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
  
 padding: 0.7em  0.7em !important;        /* Un poco de aire arriba y abajo */
    text-align: center !important;         /* Centrado para que se vea elegante */
}

/* 2. LA CAJA DE CONTENIDO (Donde están los números) */
/* Le ponemos borde para que parezca una tarjeta cerrada */

/* 3. LIMPIEZA DE LAS FILAS (Subtotal, Envío...) */
.cart_totals table.shop_table th, 
.cart_totals table.shop_table td {
padding: 0.7em  0.7em !important;        /* Un poco de aire arriba y abajo */    border-top: 1px solid #f0f0f0 !important; /* Líneas divisorias suaves */
}

/* 4. PRECIO FINAL (TOTAL) - ¡GIGANTE Y NARANJA! */
.cart_totals .order-total .amount {
    color: #ec7700 !important;      /* Naranja United Appliances */
    font-size: 1.3rem !important;   /* Bien grande */
    font-weight: 800 !important;
}

/* 5. ETIQUETA "TOTAL" */
.cart_totals .order-total th {
    font-size: 1rem !important;
    color: #333 !important;
    font-weight: 700 !important;
    vertical-align: middle !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-a16205d *//* --- MENSAJE DE CARRITO: FINAL (BOTÓN AL EXTREMO DERECHO) --- */

.woocommerce-message {
    /* 1. ACTIVAR FLEXBOX */
    display: flex !important;
    align-items: center !important; /* Centra verticalmente */
    flex-wrap: wrap !important;     /* Permite adaptarse a móvil */
    
    /* 2. DISEÑO DE LA CAJA */
    background-color: #fff !important;
    border: 0px solid transparent !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
    padding: 15px 30px !important;  /* Un poco más de espacio a los lados */
    transition: none !important;
    outline: none !important;
    width: 100% !important;         /* Asegura que ocupe todo el ancho */
    box-sizing: border-box !important;
    
    /* 3. ALINEACIÓN BASE (Para que texto e ícono estén juntos) */
    justify-content: flex-start !important; 
    gap: 15px !important;
    text-align: left !important;
}

/* --- REGLA DE ORO PARA EL BOTÓN (SOLO PC) --- */
@media (min-width: 768px) {
    .woocommerce-message .button {
        /* ESTA LÍNEA ES LA MAGIA: Empuja el botón hasta el final a la derecha */
        margin-left: auto !important; 
        margin-right: 0 !important;
        order: 2; /* Asegura visualmente que sea el último elemento */
    }
}

/* 4. EL ÍCONO (Palomita Naranja) */
.woocommerce-message::before {
    position: static !important;
    color: #ec7700 !important;
    font-size: 1.4em !important;
    content: "\e015" !important;
    margin-right: 0 !important; /* El gap del padre ya da el espacio */
}

/* 5. EL TEXTO */
.woocommerce-message {
    font-size: 15px !important;
    color: #333 !important;
}

/* 6. ESTILO DEL BOTÓN */
.woocommerce-message .button {
    float: none !important; /* Apaga el flotado antiguo de WooCommerce */
    
    /* Tu estilo */
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    color: #ec7700 !important;
    border: 1px solid #ec7700 !important;
    background: transparent !important;
    border-radius: 50px !important;
    padding: 10px 25px !important; 
    transition: all 0.3s ease;
    white-space: nowrap;
}

/* Hover del botón */
.woocommerce-message .button:hover {
    background-color: #707070 !important;
    border-color: #707070 !important;
    color: #ffffff !important;
}

/* --- MÓVIL (Para que se vea bien en celular) --- */
@media (max-width: 768px) {
    .woocommerce-message {
        justify-content: center !important; /* Todo centrado */
        text-align: center !important;
    }
    
    .woocommerce-message .button {
        margin-left: 0 !important; /* En móvil quitamos el empuje lateral */
        width: 100% !important;    /* Botón ancho completo */
        margin-top: 10px !important;
    }
}




/* --- COLOR NARANJA PARA ENLACES DE NOTIFICACIONES (Ej: ¿Deshacer?) --- */

/* 1. Cambiar el color del texto del enlace */
.woocommerce-message a:not(.button), 
.woocommerce-info a:not(.button), 
.woocommerce-error a:not(.button),
.woocommerce-message a.restore-item {
    color: #ec7700 !important;      /* Tu Naranja */
    text-decoration: underline !important; /* Subrayado para que se sepa que es clicable */
    font-weight: 700 !important;    /* Un poco más gordito */
}

/* 2. Color al pasar el mouse (Hover) */
.woocommerce-message a:not(.button):hover, 
.woocommerce-info a:not(.button):hover, 
.woocommerce-error a:not(.button):hover,
.woocommerce-message a.restore-item:hover {
    color: #333333 !important;      /* Gris oscuro elegante al tocarlo */
    text-decoration: none !important;
}





/* --- ARREGLAR "X" DE ELIMINAR (VISIBLE SIEMPRE) --- */

@media (max-width: 768px) {
    /* 1. Asegurar que la tarjeta sea la base de referencia */
    .woocommerce-cart table.cart tr {
        position: relative !important; /* Esto "atrapa" a la X dentro de la tarjeta */
    }

    /* 2. Forzar la posición de la X por encima de todo */
    .woocommerce-cart table.cart .product-remove {
        position: absolute !important;
        top: 0px !important;        /* Pegado arriba */
        right: 0px !important;      /* Pegado a la derecha */
        z-index: 999 !important;    /* ¡CLAVE! Se pone encima del texto y la foto */
        width: 40px !important;     /* Área amplia para tocar fácil */
        height: 40px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: transparent !important; 
    }

    /* 3. Estilo de la X (Color y Tamaño) */
    .woocommerce-cart table.cart .product-remove a {
        color: #ec7700 !important;  /* Tu naranja (para que la veas bien) */
        font-size: 22px !important; /* Grande y visible */
        font-weight: bold !important;
        display: block !important;  /* Asegura que no se oculte */
    }
}

/* --- CORREGIR COLOR DE LA "X" AL PASAR EL MOUSE --- */

/* 1. Estado Normal (Gris suave, como lo tienes) */
.woocommerce a.remove {
    color: #bfbfbf !important; /* Gris claro */
    background: transparent !important; /* Asegura que no tenga fondo raro */
}

/* 2. Estado Hover (Al pasar el mouse) -> CAMBIAR A NARANJA */
.woocommerce a.remove:hover {
    color: #ec7700 !important; /* Tu Naranja Corporativo */
    background: transparent !important; /* Sin círculo de fondo */
    text-decoration: none !important;
}/* End custom CSS */