/*
Theme Name: Porto Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/

/* -----------------------------------------------------------------
 * Fix altura inconsistente de productos en el widget "Porto Products"
 * en grillas (home y listados) sin afectar el bloque filter-vertical.
 * Forzamos una relación de aspecto fija en la imagen y usamos flex
 * para que todas las tarjetas de producto tengan la misma altura.
 * ----------------------------------------------------------------- */

/* Hacer que el contenedor de productos en grilla use flex para igualar alturas por fila */
.home .porto-products:not(.filter-vertical) ul.products.products-container.grid {
	display: flex;
	flex-wrap: wrap;
}

.home .porto-products:not(.filter-vertical) ul.products.products-container.grid > li.product-col {
	display: flex;
}

.home .porto-products:not(.filter-vertical) ul.products.products-container.grid > li.product-col > .product-inner {
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Forzar relación de aspecto fija en la imagen del producto (cuadrada) */
.home .porto-products:not(.filter-vertical) .product-image {
	position: relative;
}

.home .porto-products:not(.filter-vertical) .product-image .inner {
	position: relative;
	width: 100%;
	padding-top: 100%; /* 1:1. Se puede ajustar a 90%/80% si se prefiere más vertical */
	overflow: hidden;
}

.home .porto-products:not(.filter-vertical) .product-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* -----------------------------------------------------------------
 * Corrección específica para la segunda imagen (.hover-image)
 * que Porto añade cuando el producto tiene galería y
 * 'category-image-hover' está activo. Nos aseguramos de que
 * la segunda imagen se superponga sobre la primera y no
 * incremente la altura del contenedor.
 * ----------------------------------------------------------------- */

.porto-products .product-image .inner.img-effect {
	position: relative;
	overflow: hidden;
}

.porto-products .product-image .inner.img-effect img {
	display: block;
	width: 100%;
	height: auto;
}

.porto-products .product-image .inner.img-effect .hover-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.porto-products .product-image:hover .inner.img-effect .hover-image,
.porto-products .product-image .inner.img-effect:hover .hover-image {
	opacity: 1;
}

/* -----------------------------------------------------------------
 * Fijar explícitamente altura uniforme en los widgets
 * concretos de Elementor en el home de feriadeflores.co.
 * IDs actuales: porto-products-53122b8a2b9ddfe469bcee58e996a7f8
 * (1 columna destacado) y porto-products-d751713988987e9331980363e24189ce
 * (grid 4 columnas). Usamos !important para sobreescribir
 * cualquier estilo del tema.
 * ----------------------------------------------------------------- */

#porto-products-53122b8a2b9ddfe469bcee58e996a7f8 .product-image .inner,
#porto-products-d751713988987e9331980363e24189ce .product-image .inner {
	position: relative !important;
	width: 100% !important;
	padding-top: 100% !important;
	overflow: hidden !important;
}

#porto-products-53122b8a2b9ddfe469bcee58e996a7f8 .product-image .inner img,
#porto-products-d751713988987e9331980363e24189ce .product-image .inner img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

/* Ocultar la segunda imagen (.hover-image) en los widgets Porto Products
 * específicos del home para evitar desbordes al rotar productos. */
#porto-products-53122b8a2b9ddfe469bcee58e996a7f8 .product-image .hover-image,
#porto-products-d751713988987e9331980363e24189ce .product-image .hover-image {
	display: none !important;
}