@import url('https://fonts.cdnfonts.com/css/aileron');

p,
h1,
h2,
h3,
h4,
h5,
h6,
button,
span,
label,
ul,
li,
a {
	font-family: 'Aileron', sans-serif;
}

:root {
	--color-deportes: #38588a;
	--color-damas: #EC8B11;
	--color-hombres: #676767;
	--color-junior: #E9CD3D;
}

.product-features {
	margin-top: 20px;
	/* display: none; */
}

.product-features:nth-child(2n) {
	display: none;
}

.product-variants-item .input-color+span,
.product-variants-item .input-radio+span {
	display: inline-block;
	-js-display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	background-color: #efefef;
	border: 2px solid #efefef;
	cursor: pointer;
	font-weight: 400;
	height: 40px;
	line-height: 40px;
	padding: 0 7px;
	min-width: 25px;
	text-align: center;
	width: auto;
	font-size: 16px;
	font-weight: 500;
	border-radius: 0%;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-o-transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	background-size: 40px 40px;
	background-repeat: no-repeat;
	width: 40px;
	position: relative;
}

.product-variants-item {
	padding: 0 10px 0px;
}

.product-variants {
	-js-display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: block;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin: 15px -10px 0;
}

.cuCont {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	top: 0;
	left: 0;
}

.cuCont .mitad {
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
}

.cuCont .mitad-izquierda {
	clip-path: polygon(0 0, 100% 0, 0 100%);
}

.cuCont .mitad-derecha {
	clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.btn-to-top {
	background: #333;
}


/* -------- LOGO ----------*/
#_desktop_logo a {
	margin: 0px;
	display: block;
}

#_desktop_logo a img {
	height: 100px;
	margin: 10px 0px;
}

/* -------- LOGO ----------*/

/* -------- MENU ----------*/


/* Tipografia damas */
@font-face {
	font-family: 'CabinSemiBold';
	src: url('/modules/beter/views/fonts/cabin/Cabin-SemiBold-TTF.woff') format('woff');

	font-weight: normal;
	font-style: normal;
}

/* Tipografia Deportes */
@font-face {
	font-family: 'carosbold_italic';
	src: url('/modules/beter/views/fonts/caros/cretypecarosbolditalic-webfont.woff2') format('woff2'),
		url('/modules/beter/views/fonts/caros/cretypecarosbolditalic-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/* Tipografia hombres */
@font-face {
	font-family: 'digitecno';
	src: url('/modules/beter/views/fonts/digitecno/digitechnofreeversion-pmrk-webfont.woff2') format('woff2'),
		url('/modules/beter/views/fonts/digitecno/digitechnofreeversion-pmrk-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/* Tipografia Junior */
@font-face {
	font-family: 'museo_slab';
	src: url('/modules/beter/views/fonts/museo-slab/museo_slab_700-webfont.woff2') format('woff2'),
		url('/modules/beter/views/fonts/museo-slab/museo_slab_700-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

.inner-wrapper {
	position: relative;
}

ul.opciones li {
	margin-top: 0px;
	height: 57.9px;
}

ul.opciones {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	margin: 0;
	width: 100%;
}

ul.opciones li a {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 1.6;
	font-size: 1.2em;
}

ul.opciones li.opciones.op-Beter {
	flex: 0 0 25%;
	box-sizing: border-box;
	text-align: center;
	border: 1px solid #ccc;
}


/* MENU DAMAS*/
li.category a.damas,
li.opciones.Damas a {
	background-image: url('/modules/beter/views/img/Damas_off.svg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

li.category a.damas:hover,
li.opciones.Damas:hover a,
li.opciones.Damas.active a {
	background-image: url('/modules/beter/views/img/Damas_on.svg');
}

li.category a.damas:hover,
li.opciones.Damas:hover,
li.opciones.Damas.active {
	background-image: url('/modules/beter/views/img/Damas_on.svg');
}

/* MENU DEPORTES */
li.category a.deportes,
li.opciones.Deportes a {
	background-image: url('/modules/beter/views/img/Deportes_off.svg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

li.category a.deportes:hover,
li.opciones.Deportes:hover a,
li.opciones.Deportes.active a {
	background-image: url('/modules/beter/views/img/Deportes_on.svg');
}

li.category a.deportes:hover,
li.opciones.Deportes:hover,
li.opciones.Deportes.active {
	background-image: url('/modules/beter/views/img/Deportes_on.svg');
}

/* MENU HOMBRES */
li.category a.hombres,
li.opciones.Hombres a {
	background-image: url('/modules/beter/views/img/Hombres_off.svg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

li.category a.hombres:hover,
li.opciones.Hombres:hover a,
li.opciones.Hombres.active a {
	background-image: url('/modules/beter/views/img/Hombres_on.svg');
}

li.category a.hombres:hover,
li.opciones.Hombres:hover,
li.opciones.Hombres.active {
	background-image: url('/modules/beter/views/img/Hombres_on.svg');
}

/* MENU JUNIOR */
li.category a.junior,
li.opciones.Junior a {
	background-image: url('/modules/beter/views/img/Junior_off.svg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

li.category a.junior:hover,
li.opciones.Junior:hover a,
li.opciones.Junior.active a {
	background-image: url('/modules/beter/views/img/Junior_on.svg');
}

li.category a.junior:hover,
li.opciones.Junior:hover,
li.opciones.Junior.active {
	background-image: url('/modules/beter/views/img/Junior_on.svg');
}


@media (max-width: 991px) {

	/* MENU MOBILE */
	li.category a.damas,
	li.opciones.Damas a,
	li.category a.deportes,
	li.opciones.Deportes a,
	li.category a.hombres,
	li.opciones.Hombres a,
	li.category a.junior,
	li.opciones.Junior a {
		background-image: none;
		background-color: #FFF;
		color: #333;
	}

	/* MENU JUNIOR */
	li.category a.junior:hover,
	li.opciones.Junior:hover a,
	li.opciones.Junior.active a,
	li.category a.junior:hover,
	li.opciones.Junior:hover,
	li.opciones.Junior.active {
		background-image: none;
		background-color: var(--color-junior);
		color: #FFF;
	}

	/* MENU HOMBRES */
	li.category a.hombres:hover,
	li.opciones.Hombres:hover a,
	li.opciones.Hombres.active a,
	li.category a.hombres:hover,
	li.opciones.Hombres:hover,
	li.opciones.Hombres.active {
		background-image: none;
		background-color: var(--color-hombres);
		color: #FFF;
	}

	/* MENU DEPORTES */
	li.category a.deportes:hover,
	li.opciones.Deportes:hover a,
	li.opciones.Deportes.active a,
	li.category a.deportes:hover,
	li.opciones.Deportes:hover,
	li.opciones.Deportes.active {
		background-image: none;
		background-color: var(--color-deportes);
		color: #FFF;
	}

	/* MENU DAMAS*/
	li.category a.damas:hover,
	li.opciones.Damas:hover a,
	li.opciones.Damas.active a,
	li.category a.damas:hover,
	li.opciones.Damas:hover,
	li.opciones.Damas.active {
		background-image: none;
		background-color: var(--color-damas);
		color: #FFF;
	}

	.header-nav,
	#wrapper,
	#notifications {
		background: white;
	}

	.container {
		width: 100%;
	}

	.header-nav .inner-wrapper>.mobile {
		padding: 0px 15px;
		max-height: 100px;
	}

	ul.opciones li img {
		max-width: 50%;
	}

	ul.opciones {
		display: flex;
		list-style: none;
		margin: 0;
		flex-wrap: nowrap;
		max-width: 100vw;
	}

	.logo.img-responsive {
		max-height: 75px;
	}

	#top-menu {
		height: auto;
		overflow: hidden;
		margin-top: 0;
	}

	#_mobile_top_menu ul li {
		margin: 0;
	}

	.category.menu-manufacturer {
		display: none;
	}

	.top-menu[data-depth="0"]>li:hover .sub-menu {
		opacity: 1;
		visibility: visible;
		/*-webkit-transform: translate(0, 20px);
		-o-transform: translate(0, 20px);
		transform: translate(0, 0px);*/
	}

	#manufacturers {
		display: none;
	}

	#extraTiendass {
		display: none;
	}

	#toggle-cart:checked~.blockcart.active .cart-hover-content {
		box-shadow: 0px 0px 10px #333;
	}
}

/* -------- MENU ----------*/

/* -------- NAV ----------*/
#header .search-form {
	padding: 10% 5%;
}

@media (min-width: 992px) {
	.top-menu[data-depth="0"]>li>a {
		color: #fafafa;
	}

	.header-top {
		display: none;
		height: 0px;
	}

	.header-nav {
		padding: 0px;
	}

	.header-nav .inner-wrapper>.mobile {
		padding: 15px;
		max-height: 100px;
	}

	.cart-header i {
		color: #333;
	}

	#header .search-btn-toggle {
		color: #333;
	}

	.cart-header .cart-products-count {
		background: #333;
	}

	.btn-toggle-mobile,
	.btn-toggle-mobile:hover {
		background-color: #333 !important;
	}
}

@media (max-width: 786px) {
	nav p {
		line-height: 0.4;
	}
}

.breadcrumb {
	padding: 0px 0px 10px 0px;
	margin-bottom: 0px;
}

/* -------- NAV ----------*/

/* -------- PAGINA PRODUCTO ----------*/
.product-variants-item .input-color+span,
.product-variants-item .input-radio+span {
	border: 0.5px solid #ccc !important;
}

label:has(input.input-color) {
	transition: all 0.3s ease;
	transform: scale(1);
	border: 0px solid transparent;
	color: inherit;
	box-shadow: none;
}

label:has(input.input-radio.sizeChecked),
label:has(input.input-color:checked) {
	border: 0px solid #FFF !important;
	box-shadow: 0px 0px 5px #666 !important;
}

/*
#content.page-content {
    visibility: hidden;
    opacity: 0;
    transition: opacity 1.0s ease;
}
*/
.product-variants-item .input-color+span,
.product-variants-item .input-radio+span {
	display: inline-block;
	-js-display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	background-color: #fff;
	border: 2px solid #efefef;
	cursor: pointer;
	font-weight: 400;
	height: 40px;
	line-height: 40px;
	padding: 0 7px;
	min-width: 25px;
	text-align: center;
	width: auto;
	font-size: 16px;
	font-weight: 500;
	border-radius: 0%;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-o-transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	background-size: 40px 40px;
	background-repeat: no-repeat;
	width: 40px;
	position: relative;
}

.talle-disabled {
	cursor: default;
	color: #ccc !important;
	border-color: #ccc !important;
	background-color: #fff !important;
	position: relative;
	display: inline-block;
}

.color-disabled {
	opacity: 0.5;
	cursor: default;
	color: #ccc !important;
	border-color: #ccc !important;
	position: relative;
	display: inline-block;
}

span.talle-disabled::after,
span.color-disabled::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 140%;
	height: 1px;
	background-color: #ccc;
	transform: rotate(45deg);
	transform-origin: bottom left;
}

@keyframes dots {
	0% {
		content: '';
	}

	33% {
		content: '.';
	}

	66% {
		content: '..';
	}

	100% {
		content: '...';
	}
}

.dots::after {
	content: '';
	animation: dots 1.2s steps(3, end) infinite;
}

.tax-shipping-delivery-label {
	display: none;
}

ul.product-flags {
	width: 20%;
	float: right;
}

.additional-info-to {
	display: block;
}

.r-column h1 {
	width: 80%;
	font-size: 1.5em;
	float: left;
}

.product-manufacturer {
	width: 20%;
	float: right;
}

#product-price {
	font-weight: bold;
}

.ajax-error {
	display: none;
}

.tooltip-talles {
	position: relative;
	cursor: pointer;
}

.tooltip-talles::after {
	content: attr(data-tooltip);
	white-space: pre-line;
	/* Respeta \\n como salto */
	overflow-wrap: normal;
	/* NO cortar palabras */
	word-break: normal;
	/* NO cortar palabras */
	max-width: none;
	/* NO limitar el ancho */
	position: absolute;
	bottom: 100%;
	left: 0;
	background: #333;
	color: #fff;
	padding: 4px 8px;
	font-size: 12px;
	border-radius: 4px;
	display: none;
	z-index: 999;
	width: max-content;
}

.tooltip-talles:hover::after {
	display: block;
}

/* -------- PAGINA PRODUCTO ----------*/

/* -------- PAGINA LISTADOS ----------*/
.pagination .current a {
	border: none !important;
}

p.text-uppercase.h6.hidden-md-down {
	display: none;
}

#search_filters {
	margin: 15px 0 20px;
}

.subcategories ul,
.subcategories {
	display: none;
}

h1.page-heading.product-listing.catalog-title {
	display: none;
}

.custom-checkbox input[type="checkbox"]:checked+span {
	border: 1px solid #fff !important;
	box-shadow: 0px 0px 7px #333;
	color: #333;
}

.product-variants-item .input-color:checked+.color:before {
	z-index: 999;
}

.quickview .arrows i:hover {
	background-color: #333;
}

.quickview .arrows i:active {
	background-color: #333;
}

.quickview .product-prices {
	border-top: none;
}

/* -------- PAGINA LISTADOS ----------*/

/* -------- PAGINA MARCAS ----------*/
.brand-infos {
	display: none;
}

/* -------- PAGINA MARCAS ----------*/

/* -------- PAGO ----------*/
.btn.disabled,
.btn:disabled,
.btn-primary.disabled,
.btn-primary:disabled,
.btn-secondary.disabled,
.btn-secondary:disabled,
.btn-tertiary.disabled,
.btn-tertiary:disabled {
	background-color: #ccc !important;
}

.table-labeled .label {
	color: #333 !important;
}

/* -------- PAGO ----------*/


/* -------- PAGINA producto (solo MOBILE) ----------*/
@media (max-width: 768px) {
	@supports (-webkit-touch-callout: none) {
		.js-qv-product-cover {
			width: 95% !important;
		}
	}
	/* Contenedor general: cover + thumbnails */
	.page-product .images-container {
		display: flex;
		flex-direction: row;
		/* imagen principal a la izquierda, thumbs a la derecha */
		align-items: center;
		max-height: 200px;
		/* ajusta este valor */
		overflow: hidden;
		/* oculta lo que sobresalga */
	}

	/* Imagen principal */
	.page-product .product-cover {
		flex: 1;
		/* ocupa todo el ancho restante */
		text-align: center;
	}

	.page-product .product-cover img {
		width: 95%;
	}

	/* Wrapper de thumbnails */
	.page-product .wrapper-thumbnails {
		display: flex;
		flex-direction: column;
		/* disposición vertical */
		align-items: center;
		width: 120px;
		/* ancho fijo de la columna de thumbs */
		margin-left: 10px;
		max-height: 200px;
		/* altura máxima del bloque */
		overflow: hidden;
		position: relative;
		/* necesario para posicionar flechas */
	}

	/* La máscara que contiene el scroll de thumbs */
	.page-product .js-qv-mask.mask {
		max-height: 200px;
		/* altura visible */
		overflow: hidden;
	}

	/* Lista vertical de thumbs */
	.page-product .product-images {
		display: flex;
		flex-direction: column;
		gap: 5px;
	}

	.page-product .product-images .thumb-container {
		width: 100%;
	}

	/* Cada imagen miniatura */
	.page-product .product-images img.thumb,
	.product-images .js-qv-product-images img {
		max-height: 80px;
		width: 100%;
		height: auto;
		cursor: pointer;
	}

	/* Flechas arriba/abajo como en quickview */
	.page-product .scroll-box-arrows {
		display: none !important;
	}

	.page-product .arrows {
		display: block;
	}

	.page-product .arrows.js-arrows.hidden {
		display: none !important;
	}


	.page-product .arrows i {
		cursor: pointer;
		height: 1.2em;
		width: 1.2em;
		line-height: 1.2em;
		font-size: 20px;
		text-align: center;
		background-color: var(--main-color);
		color: #ffffff;
		position: absolute;
		z-index: 1;
		border-radius: 3px;
	}

	.page-product .arrows i:hover {
		background-color: #00e8d9;
	}

	.page-product .arrows i:active {
		background-color: #00968d;
	}

	.page-product .arrows .arrow-up {
		cursor: pointer;
		opacity: 0.2;
		top: 15px !important;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.page-product .arrows .arrow-down {
		bottom: 15px !important;
		left: 50%;
		transform: translate(-50%, 50%);
	}

	.js-qv-mask {
		height: 200px;
		/* altura visible */
		overflow: hidden;
		position: relative;
	}

	.js-qv-product-images {
		position: relative;
		top: 0;
		transition: top 0.3s ease;
		list-style: none;
		margin: 0;
		padding: 0;
	}

}