.elementor-287 .elementor-element.elementor-element-4ed17ce{--display:flex;--min-height:30vh;--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;--justify-content:flex-end;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:2rem;--padding-left:2rem;--padding-right:0rem;}.elementor-287 .elementor-element.elementor-element-4ed17ce:not(.elementor-motion-effects-element-type-background), .elementor-287 .elementor-element.elementor-element-4ed17ce > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://resicleand.cl/wp-content/uploads/2026/05/WhatsApp-Image-2026-05-22-at-01.58.21.jpeg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-287 .elementor-element.elementor-element-d7ff6ea .elementor-heading-title{font-size:50px;color:var( --e-global-color-blocksy_palette_8 );}.elementor-287 .elementor-element.elementor-element-6b6ee2e .woocommerce-breadcrumb{color:var( --e-global-color-203f2b4 );}.elementor-287 .elementor-element.elementor-element-6b6ee2e .woocommerce-breadcrumb > a{color:var( --e-global-color-accent );}.elementor-287 .elementor-element.elementor-element-a2f1e9b{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0rem 0rem 0rem 0rem;color:var( --e-global-color-203f2b4 );}.elementor-287 .elementor-element.elementor-element-8c1407b{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 32px;--row-gap:0px;--column-gap:32px;border-style:solid;--border-style:solid;border-width:1px 0px 0px 0px;--border-top-width:1px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:#2872FA4D;--border-color:#2872FA4D;--margin-top:90px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:2rem;--padding-bottom:2rem;--padding-left:2rem;--padding-right:2rem;}.elementor-287 .elementor-element.elementor-element-8c1407b:not(.elementor-motion-effects-element-type-background), .elementor-287 .elementor-element.elementor-element-8c1407b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-203f2b4 );}.elementor-287 .elementor-element.elementor-element-5412760{--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;}.elementor-287 .elementor-element.elementor-element-5412760.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-287 .elementor-element.elementor-element-96edd44 .elementor-heading-title{font-size:18px;}.elementor-287 .elementor-element.elementor-element-59cfacc > .elementor-widget-container{background-color:var( --e-global-color-blocksy_palette_8 );margin:0px 0px 0px 0px;padding:1rem 1rem 1rem 1rem;border-style:solid;border-width:1px 1px 1px 1px;border-color:#0468BF33;border-radius:16px 16px 16px 16px;}.elementor-287 .elementor-element.elementor-element-7689166{width:var( --container-widget-width, 110.657% );max-width:110.657%;--container-widget-width:110.657%;--container-widget-flex-grow:0;}.elementor-287 .elementor-element.elementor-element-7689166 > .elementor-widget-container{background-color:var( --e-global-color-blocksy_palette_8 );margin:0px 0px 0px 0px;padding:1rem 1rem 1rem 1rem;border-style:solid;border-width:1px 1px 1px 1px;border-color:#0468BF33;border-radius:16px 16px 16px 16px;}.elementor-287 .elementor-element.elementor-element-7689166.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-287 .elementor-element.elementor-element-458cd63 > .elementor-widget-container{background-color:var( --e-global-color-blocksy_palette_8 );margin:0px 0px 0px 0px;padding:1rem 1rem 1rem 1rem;border-style:solid;border-width:1px 1px 1px 1px;border-color:#0468BF33;border-radius:16px 16px 16px 16px;}.elementor-287 .elementor-element.elementor-element-e871540 > .elementor-widget-container{background-color:var( --e-global-color-blocksy_palette_8 );margin:0px 0px 0px 0px;padding:1rem 1rem 1rem 1rem;border-style:solid;border-width:1px 1px 1px 1px;border-color:#0468BF33;border-radius:16px 16px 16px 16px;}.elementor-287 .elementor-element.elementor-element-920486b > .elementor-widget-container{background-color:var( --e-global-color-blocksy_palette_8 );margin:0px 0px 0px 0px;padding:1rem 1rem 1rem 1rem;border-style:solid;border-width:1px 1px 1px 1px;border-color:#0468BF33;border-radius:16px 16px 16px 16px;}.elementor-287 .elementor-element.elementor-element-a6022e1{--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;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products ul.products li.product{--button-align-display:flex;--button-align-direction:column;--button-align-justify:space-between;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products  ul.products{grid-column-gap:30px;grid-row-gap:40px;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products ul.products li.product .button{border-radius:12px 12px 12px 12px;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button{background-color:#0284C7;font-family:"Inter", Sans-serif;font-size:16px;font-weight:500;line-height:150%;fill:#FFFFFF;color:#FFFFFF;transition-duration:0.5s;border-style:none;border-radius:8px 8px 8px 8px;padding:8px 24px 8px 24px;}.elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button:hover, .elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button:focus{background-color:var( --e-global-color-f2cf528 );color:#FFFFFF;}.elementor-287 .elementor-element.elementor-element-3c32b05{margin:10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button:hover svg, .elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button:focus svg{fill:#FFFFFF;}@media(max-width:1024px){.elementor-287 .elementor-element.elementor-element-4ed17ce{--padding-top:2rem;--padding-bottom:2rem;--padding-left:2rem;--padding-right:20rem;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button{font-size:16px;line-height:150%;border-radius:8px 8px 8px 8px;padding:10px 18px 10px 18px;}}@media(max-width:767px){.elementor-287 .elementor-element.elementor-element-4ed17ce:not(.elementor-motion-effects-element-type-background), .elementor-287 .elementor-element.elementor-element-4ed17ce > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://resicleand.cl/wp-content/uploads/2026/05/Proyecto-nuevo-8.webp");background-position:center center;}.elementor-287 .elementor-element.elementor-element-4ed17ce{--min-height:41vh;--justify-content:flex-end;--padding-top:2rem;--padding-bottom:2rem;--padding-left:2rem;--padding-right:2rem;}.elementor-287 .elementor-element.elementor-element-8c1407b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-287 .elementor-element.elementor-element-49474dc.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-287 .elementor-element.elementor-element-3c32b05 .elementor-button{font-size:16px;line-height:150%;border-radius:8px 8px 8px 8px;padding:10px 18px 10px 18px;}}@media(min-width:768px){.elementor-287 .elementor-element.elementor-element-4ed17ce{--width:100%;}.elementor-287 .elementor-element.elementor-element-8c1407b{--width:100%;}.elementor-287 .elementor-element.elementor-element-5412760{--width:22%;}.elementor-287 .elementor-element.elementor-element-a6022e1{--width:75%;}}/* Start custom CSS for wc-archive-products, class: .elementor-element-49474dc *//* =======================================================
   ESTILO DE TIENDA PREMIUM (INSPIRADO EN LIDER.CL)
   VERSIÓN 100% RESPONSIVE (MÓVIL, TABLET Y DESKTOP)
   ======================================================= */

:root {
    /* Colores base */
    --lider-blue: #0071ce;            
    --lider-button-bg: #0071ce;       /* Cambia esto por tu color verde si lo prefieres */
    --lider-button-hover: #00569d;    

    /* Ajustes por defecto para DESKTOP (Escritorio) */
    --lider-img-box-height: 190px;    
    --lider-img-padding: 14px;        
    --lider-card-padding: 16px;       
    --lider-title-size: 13px;         
    --lider-price-size: 15px;         
    --lider-button-padding: 10px 16px;
    --lider-button-size: 12px;
}

/* Ajustes automáticos para TABLET (Pantallas medianas) */
@media (max-width: 1024px) {
    :root {
        --lider-img-box-height: 150px;
        --lider-img-padding: 10px;
        --lider-card-padding: 12px;
        --lider-title-size: 12px;
        --lider-price-size: 14px;
        --lider-button-padding: 8px 12px;
        --lider-button-size: 11px;
    }
}

/* Ajustes automáticos para MÓVIL (Pantallas pequeñas) */
@media (max-width: 767px) {
    :root {
        --lider-img-box-height: 120px; /* Imagen más pequeña para que la tarjeta no sea gigante */
        --lider-img-padding: 8px;
        --lider-card-padding: 10px;    /* Tarjeta más compacta */
        --lider-title-size: 11px;
        --lider-price-size: 13px;
        --lider-button-padding: 8px 4px; /* Menos padding lateral para dar espacio al texto */
        --lider-button-size: 11px;
    }
}

/* 1. ESTRUCTURA DE GRILLES SEGÚN DISPOSITIVO */

/* Desktop: 5 Columnas */
@media (min-width: 1025px) {
    .woocommerce ul.products {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

/* Tablet: 3 Columnas */
@media (min-width: 768px) and (max-width: 1024px) {
    .woocommerce ul.products {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

/* Móvil: 2 Columnas */
@media (max-width: 767px) {
    .woocommerce ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
}

/* Limpieza de floats obsoletos de WooCommerce */
.woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    clear: none !important;
}


/* 2. DISEÑO DE LA TARJETA DE PRODUCTO */
.woocommerce ul.products li.product {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: var(--lider-card-padding) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    height: 100% !important; 
}

.woocommerce ul.products li.product:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05) !important;
    border-color: #cbd5e1 !important;
}


/* 3. CONTROL DE IMAGEN (EVITA CORTES Y CENTRA VERTICALMENTE) */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
    display: flex !important;
    flex-direction: column !important;
    text-decoration: none !important;
    margin-bottom: 10px !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__link img {
    height: var(--lider-img-box-height) !important;
    width: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    padding: var(--lider-img-padding) !important;
    box-sizing: border-box !important; /* Impide que la imagen desborde el ancho */
    background-color: #ffffff !important;
    margin: 0 auto 10px auto !important;
    display: block !important;
    transition: transform 0.3s ease !important;
}

.woocommerce ul.products li.product:hover .woocommerce-loop-product__link img {
    transform: scale(1.04) !important;
}


/* 4. TEXTOS Y ALTURAS DE TÍTULO */

/* Título limitado a 2 líneas para un look simétrico */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: var(--lider-title-size) !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    line-height: 1.3 !important;
    text-align: left !important;
    margin: 0 0 6px 0 !important;
    
    /* Mantiene los botones alineados forzando máximo 2 líneas */
    height: 2.6em !important; 
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
}

/* =======================================================
   OCULTACIÓN TOTAL DE CATEGORÍAS/ETIQUETAS (DEFINITIVO)
   ======================================================= */
.woocommerce ul.products li.product .woocommerce-loop-category,
.woocommerce ul.products li.product .posted_in,
.woocommerce ul.products li.product .categories,
.woocommerce ul.products li.product .category,
.woocommerce ul.products li.product .product-category,
.woocommerce ul.products li.product .product-categories,
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .elementor-product-categories,
.woocommerce ul.products li.product .elementor-woo-loop-product-categories,
.woocommerce ul.products li.product .elementor-woo-loop-product-category,
.woocommerce ul.products li.product [class*="category"],
.woocommerce ul.products li.product [class*="categories"] {
    display: none !important;
}

/* Precios */
.woocommerce ul.products li.product .price {
    font-size: var(--lider-price-size) !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    text-align: left !important;
    margin-bottom: 10px !important;
    display: block !important;
}

/* Ofertas */
.woocommerce ul.products li.product .price del {
    font-size: 11px !important;
    color: #94a3b8 !important;
    font-weight: 400 !important;
    margin-right: 4px !important;
    display: inline-block !important;
}

.woocommerce ul.products li.product .price ins {
    text-decoration: none !important;
    color: #ef4444 !important;
    display: inline-block !important;
}


/* 5. BOTÓN EN FORMA DE PÍLDORA (CORREGIDO PARA TEXTOS LARGOS EN MÓVIL) */
.woocommerce ul.products li.product .button {
    background-color: var(--lider-button-bg) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    padding: var(--lider-button-padding) !important;
    font-size: var(--lider-button-size) !important;
    font-weight: 600 !important;
    text-align: center !important;
    text-transform: none !important;
    border: none !important;
    margin-top: auto !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    
    /* Solución de desborde de texto en móvil */
    white-space: normal !important;   /* Permite saltar de línea si la palabra es muy larga */
    line-height: 1.2 !important;      /* Altura de línea cómoda para doble línea */
    height: auto !important;          
    
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.woocommerce ul.products li.product .button:hover {
    background-color: var(--lider-button-hover) !important;
    color: #ffffff !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-3c32b05 *//* =======================================================
   ESTILO DE TIENDA PREMIUM (INSPIRADO EN LIDER.CL)
   OPTIMIZADO PARA 5 COLUMNAS EN DESKTOP
   ======================================================= */

:root {
    /* 1. Variables de Control (Ajusta colores y tamaños aquí) */
    --lider-blue: #0071ce;            /* Azul corporativo de Líder */
    --lider-button-bg: #0071ce;       /* Cambia esto por tu color de marca si lo deseas */
    --lider-button-hover: #00569d;    /* Color hover del botón */
    --lider-img-box-height: 190px;    /* Altura ideal para grillas de 5 columnas */
    --lider-img-padding: 14px;        /* Espaciado para que no se corten las fotos laterales */
}

/* 2. GRILLA SIMÉTRICA DE 5 COLUMNAS EN ESCRITORIO (DESKTOP) */
@media (min-width: 1025px) {
    .woocommerce ul.products {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important; /* Forza 5 columnas */
        gap: 18px !important;                                        /* Espaciado entre tarjetas */
        width: 100% !important;
        padding: 0 !important;
    }
    
    .woocommerce ul.products li.product {
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
        clear: none !important;
    }
}

/* 3. TARJETA DE PRODUCTO MODERNA Y SIMÉTRICA */
.woocommerce ul.products li.product {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important; /* Borde suave */
    border-radius: 12px !important;       /* Bordes curvos modernos */
    padding: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    height: 100% !important;             /* Obliga a que todas las tarjetas midan lo mismo */
}

/* Hover suave en la tarjeta */
.woocommerce ul.products li.product:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05) !important;
    border-color: #cbd5e1 !important;
}

/* 4. CONTENEDOR DE IMAGEN (EVITA CORTES Y CENTRA VERTICALMENTE) */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
    display: flex !important;
    flex-direction: column !important;
    text-decoration: none !important;
    margin-bottom: 12px !important;
}

/* Ajuste de imagen optimizado */
.woocommerce ul.products li.product .woocommerce-loop-product__link img {
    height: var(--lider-img-box-height) !important;
    width: 100% !important;              /* Forza a que la imagen se adapte al ancho de la tarjeta */
    max-width: 100% !important;
    object-fit: contain !important;      /* Evita recortes y deformaciones */
    padding: var(--lider-img-padding) !important;
    box-sizing: border-box !important;   /* Evita que el padding desborde la imagen */
    background-color: #ffffff !important;
    margin: 0 auto 12px auto !important;
    display: block !important;
    transition: transform 0.3s ease !important;
}

/* Zoom sutil en hover */
.woocommerce ul.products li.product:hover .woocommerce-loop-product__link img {
    transform: scale(1.04) !important;
}

/* 5. TEXTOS Y ALTURAS DE TÍTULO */

/* Títulos con altura fija máxima (3 líneas) */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    line-height: 1.4 !important;
    text-align: left !important;
    margin: 0 0 8px 0 !important;
    
    /* Mantiene los botones alineados limitando a 3 líneas de texto */
    height: 4.2em !important; 
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
}

/* Precios */
.woocommerce ul.products li.product .price {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    text-align: left !important;
    margin-bottom: 12px !important;
    display: block !important;
}

/* Precios de oferta tachados */
.woocommerce ul.products li.product .price del {
    font-size: 12px !important;
    color: #94a3b8 !important;
    font-weight: 400 !important;
    margin-right: 6px !important;
    display: inline-block !important;
}

.woocommerce ul.products li.product .price ins {
    text-decoration: none !important;
    color: #ef4444 !important;
    display: inline-block !important;
}

/* 6. BOTÓN EN FORMA DE PÍLDORA */
.woocommerce ul.products li.product .button {
    background-color: var(--lider-button-bg) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    padding: 10px 16px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-align: center !important;
    text-transform: none !important;
    border: none !important;
    margin-top: auto !important;          /* Empuja el botón al final de la tarjeta */
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.woocommerce ul.products li.product .button:hover {
    background-color: var(--lider-button-hover) !important;
    color: #ffffff !important;
}/* End custom CSS */