/**
 * Theme Name:        Tema Enebe
 * Template:          Divi
 * Theme URI:         https: //www.garajedoce.es
 * Description:       Tema hijo de Divi para Enebe.
 * Version:           1.0.0
 * Author:            Garajedoce
 * Author URI:        https: //www.garajedoce.com
 * Tags:              divi-based-theme
 * Tested up to:      6.4
 * Requires at least: 6.2
 * Requires PHP:      7.4
 * Text Domain:  enebe
 * Domain Path:  /languages
 * License:      GNU General Public License v2 or later
 * License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 */


.awf-togglable-preset-btn
{
	transition:width 1s;
}

.et_pb_sticky .awf-togglable-preset-btn
{
	width:100%;
}

.pvp-recomendado
{
	color: #323b3d;
	text-align:center;
}

/* Menú Principal */

/*-> Ajustes específicos para el enlace a Home de Pádel en el menú principal */

.g12_menu_item_destacado a {
	font-weight: 900 !important;
	font-size: 1.15em !important;
}

/*-> Botón contacto menú principal */
li.g12_btn-destacado.menu-item {
	align-items: center !important;
}

li.g12_btn-destacado.menu-item a {
	padding-inline: 15px !important;
	padding-block: 10px !important;
    background-color: var(--gcid-primary-color);
    border-radius: 9999px;
    color: white;
	border: 2px solid transparent;
	transition: all 0.6s ease;
	font-weight: 900;
}

@media screen and (max-width: 980px) {
	li.g12_btn-destacado.menu-item a {
		border-radius: initial;
	}
}

li.g12_btn-destacado.menu-item a:hover {
	border-color: var(--gcid-primary-color);
	color: var(--gcid-primary-color);
	background: transparent;
	font-weight: 900;
}

/*-> Conmutador de idioma WPML en el menú principal */

/* Divi da a TODOS los submenús .nav li ul { width: 240px; padding: 20px 0 }
   y además .nav li li a { width: 200px }. Con una sola bandera dentro, el
   desplegable del conmutador queda enorme y vacío. Ojo: no basta con el ancho
   del ul — en width:auto se ajusta al enlace, así que hay que soltar los dos.
   Solo afecta al ítem del conmutador; el resto de submenús no se tocan, y se
   limita a .et_pb_menu .nav porque el menú móvil se apila y no lo necesita. */

.et_pb_menu .nav li.wpml-ls-menu-item > ul.sub-menu {
	width: auto;
	min-width: 0;
	padding: 10px 0;
	text-align: center;
}

.et_pb_menu .nav li.wpml-ls-menu-item > ul.sub-menu > li {
	padding: 0 14px;
	line-height: 1;
}

.et_pb_menu .nav li.wpml-ls-menu-item > ul.sub-menu > li > a {
	width: auto;
	padding: 6px 0;
	justify-content: center;
}




/*	WOOCOMMERCE imagen secundaria	*/


/*	Fondo galeria	*/
.et_pb_wc_images .woocommerce-product-gallery .flex-viewport,
.et_pb_wc_images .woocommerce-product-gallery .flex-viewport .zoomImg
{
	background-color: #ededed !important;
}

/* Contenedor de la imagen: necesitamos posicionamiento relativo */
.et_shop_image {
    position: relative;
    display: block;
    overflow: hidden;
}

.woocommerce ul.products li.product a
{
	position:relative;
}

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img
{
	margin:0px !important;
}

/* La imagen original ya está posicionada de forma normal */
.et_shop_image img.attachment-woocommerce_thumbnail {
    display: block;
    width: 100%;
    height: auto;
    transition: opacity 0.3s ease;
}

/* La segunda imagen se posiciona encima, oculta por defecto */
.woocommerce ul.products li.product a img.enebe-hover-image, 
.woocommerce-page ul.products li.product a img.enebe-hover-image {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 2;
	margin:0px !important;
	background-color: #ededed;
}

/* Al hacer hover sobre el link del producto, mostramos la segunda imagen */
.woocommerce ul.products li.product a:hover img.enebe-hover-image,
.woocommerce-page ul.products li.product a:hover img.enebe-hover-image{
    opacity: 1;
}