.elementor-8923 .elementor-element.elementor-element-deec4ca{--display:flex;--min-height:200px;--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:center;--overlay-opacity:1;}.elementor-8923 .elementor-element.elementor-element-deec4ca:not(.elementor-motion-effects-element-type-background), .elementor-8923 .elementor-element.elementor-element-deec4ca > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://zetabyraquel.es/wp-content/uploads/sites/5/2025/11/short-naranja-y-verde-de-playa-con-encaje-scaled.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-8923 .elementor-element.elementor-element-deec4ca::before, .elementor-8923 .elementor-element.elementor-element-deec4ca > .elementor-background-video-container::before, .elementor-8923 .elementor-element.elementor-element-deec4ca > .e-con-inner > .elementor-background-video-container::before, .elementor-8923 .elementor-element.elementor-element-deec4ca > .elementor-background-slideshow::before, .elementor-8923 .elementor-element.elementor-element-deec4ca > .e-con-inner > .elementor-background-slideshow::before, .elementor-8923 .elementor-element.elementor-element-deec4ca > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, var( --e-global-color-accent ) 0%, var( --e-global-color-primary ) 100%);}.elementor-8923 .elementor-element.elementor-element-55fcdcb{text-align:center;}.elementor-8923 .elementor-element.elementor-element-55fcdcb .elementor-heading-title{font-size:60px;font-weight:900;color:var( --e-global-color-c696dce );}.elementor-8923 .elementor-element.elementor-element-0d6eb23{--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;--margin-top:70px;--margin-bottom:70px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:60px;--padding-right:60px;}.elementor-8923 .elementor-element.elementor-element-33b213f.elementor-wc-products  ul.products{grid-column-gap:30px;grid-row-gap:30px;}.elementor-8923 .elementor-element.elementor-element-33b213f.elementor-wc-products ul.products li.product .button{color:var( --e-global-color-764183d );background-color:var( --e-global-color-accent );}.elementor-8923 .elementor-element.elementor-element-33b213f.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-8923 .elementor-element.elementor-element-33b213f.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(min-width:768px){.elementor-8923 .elementor-element.elementor-element-deec4ca{--width:100%;}}@media(max-width:767px){.elementor-8923 .elementor-element.elementor-element-0d6eb23{--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}.elementor-8923 .elementor-element.elementor-element-33b213f.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for wc-archive-products, class: .elementor-element-33b213f *//* 1. AJUSTE DE LA CUADRÍCULA (GRID) */
.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 30px;
    padding: 20px 0;
}

/* 2. TARJETA DE PRODUCTO (CONTENEDOR FLEX) */
/* Usamos Flexbox en columna para poder empujar el botón al final */
ul.products li.product {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    background: #fff;
    padding: 15px !important;
    margin-bottom: 0 !important;
    height: 100%; /* Obliga a todas las tarjetas a medir lo mismo */
}

/* 3. IMAGEN DEL PRODUCTO */
.product img {
    margin-bottom: 15px !important;
    border-radius: 4px;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* 4. TÍTULOS */
.product h2, 
.woocommerce-loop-product__title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #333 !important;
    margin-bottom: 10px !important;
    line-height: 1.3 !important;
    padding: 0 5px !important;
}

/* 5. PRECIO (EL "MOTOR" DE LA ALINEACIÓN) */
/* Al poner margin-top: auto, el precio y el botón se pegan abajo */
.product .price {
    margin-top: auto !important; 
    margin-bottom: 15px !important;
    color: #b22222 !important; /* Rojo oscuro */
    font-weight: bold !important;
    font-size: 16px !important;
    display: block !important;
}

/* 6. ESTILO GENERAL DE LOS BOTONES */
.product .button {
    width: 90% !important; /* Botones casi tan anchos como la tarjeta */
    padding: 10px 15px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    border-radius: 4px !important;
    border: none !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    display: inline-block !important;
}

/* Botón "Añadir al carrito" (Rojo) */
.product .add_to_cart_button.ajax_add_to_cart {
    background-color: #f30e0e !important;
    color: #fff !important;
}

/* Botón "Leer más" o "Seleccionar opciones" (Gris) */
.product .button.product_type_simple,
.product .button.product_type_variable,
.product .button.read_more {
    background-color: #f30e0e !important;
    color: #fff !important;
    
}

/* Efecto al pasar el ratón */
.product .button:hover {
    filter: brightness(1.2);
    transform: translateY(-2px);
}

/* 7. ETIQUETA DE OFERTA (BADGE) */
.onsale {
    background-color: #b22222 !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    padding: 5px 12px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    border-radius: 3px !important;
    min-height: auto !important;
    min-width: auto !important;
    line-height: 1 !important;
}


/* 1. Aseguramos que la tarjeta sea un contenedor Flex que ocupe todo el alto */
.products .product {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    justify-content: flex-start !important; /* Alinea contenido al inicio */
}

/* 2. El título debe tener un margen o altura para no colapsar */
.product .woocommerce-loop-product__title, 
.product h2 {
    margin-bottom: 10px !important;
    min-height: 45px !important; /* Ajusta según tus títulos largos */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 3. ESTA ES LA CLAVE: 
   Aplicamos margin-top: auto al contenedor que envuelve el botón o al botón mismo.
   Esto empuja el elemento hasta el puro fondo de la tarjeta. */

.product .price {
    margin-top: auto !important; /* Empuja el precio y el botón hacia abajo */
    margin-bottom: 10px !important;
}

.product .button {
    margin-top: 5px !important; /* Espacio pequeño entre precio y botón */
    align-self: stretch !important; /* Opcional: hace que el botón ocupe el ancho */
    margin-bottom: 10px !important; /* Espacio respecto al borde inferior de la caja */
}

/* Si tu botón está dentro de un contenedor específico de WooCommerce */
.product .add_to_cart_button {
    display: block !important;
    width: 100% !important;
}/* End custom CSS */