@charset "UTF-8";

.wl-header{
	padding: 4% 10%;
	border-bottom: 2px solid var(--bordes);
}

p{
	font-size: 0.8rem;
}

.wl-cols{
	padding: 4% 6%;
	background-color: #f9faf5;
}

.wl-lista-wl, .wl-lista-recom{
	float:left;
	width: 100%;
	margin-bottom: 2rem;
}

h1{font-size: 1.2rem;}

h6{font-size: 0.9rem;margin:0.5rem 0;}

.ico-corazon{height: 1.1rem;width: auto;margin-right: 0.1rem;}
.wl-prod-cat{
	font-size: 1rem;
	margin: 0.7rem 0;
	font-weight: 400;
	color: var(--azul-claro);
	cursor:pointer;
	padding-left: 1.2rem;
	background-image: url(iconos/flecha-der-azul.svg);
	background-position: left center;
	background-size: 0.8rem;
}
.wl-prod-box{
	border: 1px solid var(--bordes);
	background-color: #fff;
	border-radius: 0.5rem;
	display:none;
	flex-direction: row;
	flex-wrap: wrap;
	margin-bottom: 2rem;
}
.wl-prod-foto{
	flex: 0 0 25%;
}
.wl-prod-foto img{
	width: 86%;
	margin: 0.6rem 7%;
}
.wl-prod-data{
	flex: 0 0 75%;
	padding: 0 0.3rem 0.3rem 0.3rem;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
.wl-prod-data h2{
	font-size: 0.85rem;
	font-weight:400;
	margin: 0.5rem 0;
	flex: 0 0 100%;
}
.wl-marca,.wl-escala{
	font-size: 0.7rem;
	margin: 0.15rem 0;
	flex: 0 0 65%;
}

.wl-escala{
	flex: 0 0 35%;
	text-align:center;
}

.wl-marca:before,.wl-escala:before{
	content: "Marca";
	margin-right: 0.55rem;
	width: 100%;
	float:left;
	font-size: 0.65rem;
}
.wl-escala:before{
	content: "Escala";
}

.wl-precio{
	flex: 0 0 50%;
	margin: 0.3rem 0;
	font-size: 0.7rem;
	font-weight:bold;
}

.wl-precio:before{
	content: "Precio ";
	width: 100%;
	float:left;
	font-size: 0.65rem;
	color: var(--color-texto);
	font-weight: normal;
}

.wl-precio>span{
	width: 100%;
	float:left;
	color: inherit;
}

.wl-precioTachado{
	font-weight: normal;
	color: var(--color-texto) !important;
	font-size: 0.65rem;
	text-decoration: line-through;
}
.wl-precioOferta{
	color: var(--color-texto-rojo) !important;
}

.wl-verDetalles{
	flex: 0 0 50%;
	margin: 0.3rem 0;
	font-size: 0.7rem;
	color:var(--azul-claro);
	text-align: center;
	align-content: end;
}

.wl-prod-menu{
	flex:  0 0 100%;
	border-top: 1px solid var(--bordes);
	height: 2.4rem;
	border-radius: 0 0 0.5rem 0.5rem;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	padding: 0 0.8rem;
}

.wl-prod-menu a{
	height: 1.2rem;
	border-radius: 0.3rem;
	line-height: 1.1rem;
}
.wl-prod-menu .agregar-a-carrito{
	font-size: 0.7rem;
	padding-right: 1.5rem;
	background-position: right 0.3rem center;
	background-image: url(iconos/cart-azul.svg);
	background-size: 1rem;
	flex: 0 0 auto;
	flex-basis: content;
	margin: 0;
	width: auto;
	border: 0;
}

.wl-prod-menu .agregar-a-carrito:before{
	content: none;
}

.wl-prod-eliminar{
	color: var(--color-texto);
	font-size: 0.7rem !important;
}

.wl-lista-recom .producto-previos-caja{
	border: 0;
	margin-bottom: 1rem;
	/* padding: 0; */
	margin: 0 0 1rem 0;
	border-bottom:  1px solid var(--bordes);
	padding-bottom: 2rem;
	border-radius: 0;
}

.wl-lista-recom .producto-previos-caja-chd{
	flex-direction: column;
}

.wl-lista-recom .producto-previos-caja-foto{
	flex: 0 0 auto;
}

.wl-lista-recom .producto-previos-caja-chd>*{
	text-align: center;
	width: 100%;
	height:auto;
	max-height: none;
}

.wl-lista-recom .producto-previos-caja-opciones *{
	width: 74%;
	margin: 0.5rem 13%;
}


.wl-lista-recom h6{ text-align:left;}

.wl-grupo-cat.abierto .wl-prod-box{
	display:flex;
}

.wl-grupo-cat.abierto .wl-prod-cat{
	background-image: url(iconos/flecha-abajo-azul.svg);
}

@media all and (min-width: 768px) {

	.wl-marca, .wl-escala, .wl-precio, .wl-verDetalles{
		align-content: center;
		text-align: center;
		border-left: 1px solid var(--bordes);
	}
	.wl-marca{
		border-left: 0;
		flex: 0 0 40%;
		text-align: left;
		padding-left: 1rem;
	}
	.wl-verDetalles{
		flex: 0 0 24%;
	}
	
	.wl-escala, .wl-precio{
		flex: 0 0 18%;
	}
	
	
	.wl-prod-foto{
		flex: 0 0 15%;
		border-right: 1px solid var(--bordes);
		max-height: 100px;
		overflow: hidden;
	}
	 
	.wl-prod-data{
		flex: 0 0 85%;
		
	}
	
	.wl-prod-data h2{
		font-size: 1rem;
		margin: 0.5rem 0 0.3rem 0;
		padding-left: 1rem;
		flex: 0 0 100%;
	}

}

@media all and (min-width: 1024px) {
	.wl-lista-recom h6{ text-align:center !important;}
	.wl-cols{padding: 2% 2%;}
	.wl-header{
		padding: 2% 3%;
		text-align: left;
	}
	
	.wl-lista-wl{
		width: 60%;
	}

	.wl-lista-recom{
		float: right;
		width: 37%;
	}
	h1{font-size: 1.6rem;}

	.ico-corazon{
		height: 1.3rem;
		width: auto;
		margin-right: 0.3rem;
	}

	
}

@media all and (min-width: 1200px) {
	.wl-header{
		padding: 1% 0;
		text-align: left;
	}
	.wl-cols{
		padding: 4% 0 4% 0;
		background-color: #fff;
	}
	.wl-lista-wl{
		width: 67%;
	}

	.wl-lista-recom{
		float: right;
		width: 27%;
	}
}