/* ====================================================================
   MDLR · Shop Page Styles v2.0
   ====================================================================
   Cargado solo en /boutique (is_shop() || is_product_taxonomy())
   ==================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Anton+SC&family=JetBrains+Mono:wght@400;500;700&display=swap');
@import url('https://api.fontshare.com/v2/css?f[]=pp-neue-montreal@400,500,600,700&display=swap');


/* ====================================================================
   1. OVERRIDE ASTRA — full-width + ocultar título
   ==================================================================== */

.mdlr-shop-active .entry-title,
.mdlr-shop-active .ast-archive-title,
.mdlr-shop-active .page-title,
body.woocommerce-shop .entry-title,
body.woocommerce-shop .page-title,
body.woocommerce-shop .ast-archive-title,
body.tax-product_cat .entry-title,
body.tax-product_cat .ast-archive-title{
	display:none !important;
}

.mdlr-shop-active .site-content > .ast-container,
.mdlr-shop-active .site-content .ast-container,
body.woocommerce-shop .site-content > .ast-container,
body.tax-product_cat .site-content > .ast-container{
	max-width:none !important;
	width:100% !important;
	padding-left:0 !important;
	padding-right:0 !important;
}

.mdlr-shop-active #primary,
.mdlr-shop-active .content-area,
body.woocommerce-shop #primary,
body.tax-product_cat #primary{
	width:100% !important;
	max-width:100% !important;
	margin:0 !important;
	padding:0 !important;
}

.mdlr-shop-active .entry-content,
body.woocommerce-shop .entry-content,
body.tax-product_cat .entry-content{
	margin:0 !important;
	padding:0 !important;
	max-width:none !important;
}

.mdlr-shop-active main#main,
body.woocommerce-shop main#main,
body.tax-product_cat main#main{
	padding:0 !important;
	margin:0 !important;
}

.mdlr-shop-active .ast-article-single,
.mdlr-shop-active .ast-archive-description,
body.woocommerce-shop .ast-article-single,
body.woocommerce-shop .ast-archive-description,
body.tax-product_cat .ast-article-single{
	padding:0 !important;
	margin:0 !important;
}


/* ====================================================================
   2. CONTENEDOR PRINCIPAL
   ==================================================================== */

.mdlr-shop-page{
	--c-noir:#0A0A0A;
	--c-rouge:#FF2A2A;
	--c-rouge-dark:#D11515;
	--c-blanc:#FFFFFF;
	--c-creme:#F5EFE0;
	--c-creme-dirty:#EBE3D0;
	--c-papier:#E8DEC8;
	--c-gray:#777;
	--c-gray-light:#aaa;
	--c-line:#E5E5E5;
	--ff-anton:'Anton SC','Anton',Impact,sans-serif;
	--ff-body:'PP Neue Montreal','Inter',system-ui,sans-serif;
	--ff-mono:'JetBrains Mono','Courier New',monospace;
	--ease:cubic-bezier(0.22,1,0.36,1);
	font-family:var(--ff-body);
	color:var(--c-noir);
	background:var(--c-blanc);
	font-size:16px;
	line-height:1.5;
	-webkit-font-smoothing:antialiased;
	padding:0 0 80px;
	width:100%;
	max-width:100vw;
	overflow-x:hidden;
}

.mdlr-shop-page *,
.mdlr-shop-page *::before,
.mdlr-shop-page *::after{box-sizing:border-box}
.mdlr-shop-page h1,
.mdlr-shop-page h2,
.mdlr-shop-page h3,
.mdlr-shop-page h4,
.mdlr-shop-page p{margin:0}
.mdlr-shop-page button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;padding:0}
.mdlr-shop-page a{color:inherit;text-decoration:none}
.mdlr-shop-page ::selection{background:var(--c-rouge);color:var(--c-blanc)}

.mdlr-shop-wrap{
	width:100%;
	max-width:1380px;
	margin:0 auto;
	padding:0 clamp(20px,4vw,56px);
}


/* ====================================================================
   3. HERO COMPACTO
   ==================================================================== */

.mdlr-shop-hero{
	padding:48px 0 32px;
	border-bottom:3px solid var(--c-noir);
	margin-bottom:24px;
	background:var(--c-blanc);
	text-align:center;
}

.mdlr-shop-hero__top{
	display:flex;
	align-items:center;
	gap:14px;
	justify-content:center;
	margin-bottom:18px;
	flex-wrap:wrap;
}

.mdlr-shop-hero__num{
	font-family:var(--ff-mono);
	font-size:11px;
	font-weight:700;
	letter-spacing:0.22em;
	text-transform:uppercase;
	color:var(--c-noir);
}
.mdlr-shop-hero__num::before{
	content:'';
	display:inline-block;
	width:36px;
	height:2px;
	background:currentColor;
	margin-right:14px;
	vertical-align:middle;
}

.mdlr-shop-hero__count{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-family:var(--ff-mono);
	font-size:11px;
	font-weight:700;
	letter-spacing:0.18em;
	text-transform:uppercase;
	color:var(--c-rouge);
	border:2px solid var(--c-rouge);
	padding:5px 12px;
	background:var(--c-blanc);
}

.mdlr-shop-hero__title{
	font-family:var(--ff-anton);
	font-size:clamp(2.5rem,7vw,5.5rem);
	line-height:0.9;
	letter-spacing:-0.015em;
	text-transform:uppercase;
	color:var(--c-noir);
	margin:0 auto 14px;
	text-align:center;
}
.mdlr-shop-hero__title em{font-style:normal;color:var(--c-rouge)}

.mdlr-shop-hero__sub{
	font-family:var(--ff-body);
	font-size:14px;
	font-weight:500;
	color:var(--c-noir);
	max-width:580px;
	line-height:1.6;
	margin:0 auto;
}

@media (max-width:760px){
	.mdlr-shop-hero{padding:24px 0 20px;margin-bottom:16px}
	.mdlr-shop-hero__top{margin-bottom:12px}
	.mdlr-shop-hero__title{font-size:clamp(2rem,11vw,3.5rem)}
	.mdlr-shop-hero__sub{font-size:13px}
}


/* ====================================================================
   4. FILTROS POR ARTISTAS — Botones XL en grid
   ==================================================================== */

.mdlr-shop-filters{
	margin-bottom:40px;
}

.mdlr-shop-filters__head{
	margin-bottom:20px;
}

.mdlr-shop-filters__label{
	font-family:var(--ff-mono);
	font-size:12px;
	font-weight:700;
	letter-spacing:0.22em;
	text-transform:uppercase;
	color:var(--c-rouge);
	display:inline-flex;
	align-items:center;
	gap:10px;
}
.mdlr-shop-filters__label::before{
	content:'';
	width:36px;
	height:2px;
	background:var(--c-rouge);
}

/* Grid de botones XL */
.mdlr-shop-filters__grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:14px;
}

@media (max-width:1180px){
	.mdlr-shop-filters__grid{grid-template-columns:repeat(3,1fr);gap:12px}
}
@media (max-width:760px){
	.mdlr-shop-filters__grid{grid-template-columns:repeat(2,1fr);gap:10px}
}
@media (max-width:420px){
	.mdlr-shop-filters__grid{grid-template-columns:repeat(2,1fr);gap:8px}
}

/* Botón XL */
.mdlr-shop-fbtn{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:6px;
	padding:18px 14px;
	background:var(--c-blanc);
	color:var(--c-noir);
	border:3px solid var(--c-noir);
	box-shadow:6px 6px 0 var(--c-noir);
	cursor:pointer;
	transition:transform 0.18s var(--ease),box-shadow 0.18s var(--ease),background 0.18s var(--ease),color 0.18s var(--ease);
	text-decoration:none;
	min-height:90px;
	text-align:center;
	user-select:none;
	-webkit-tap-highlight-color:transparent;
}

.mdlr-shop-fbtn:hover{
	transform:translate(-3px,-3px);
	box-shadow:9px 9px 0 var(--c-rouge);
}

.mdlr-shop-fbtn:active{
	transform:translate(2px,2px);
	box-shadow:3px 3px 0 var(--c-rouge);
}

.mdlr-shop-fbtn.is-active{
	background:var(--c-rouge);
	color:var(--c-noir);
	border-color:var(--c-noir);
	box-shadow:6px 6px 0 var(--c-noir);
}
.mdlr-shop-fbtn.is-active:hover{
	transform:translate(-3px,-3px);
	box-shadow:9px 9px 0 var(--c-noir);
}

.mdlr-shop-fbtn__name{
	font-family:var(--ff-anton);
	font-size:clamp(22px,2vw,32px);
	letter-spacing:-0.005em;
	line-height:1;
	text-transform:uppercase;
	color:inherit;
	display:block;
	word-break:break-word;
}

.mdlr-shop-fbtn__count{
	font-family:var(--ff-mono);
	font-size:10px;
	font-weight:700;
	letter-spacing:0.18em;
	text-transform:uppercase;
	color:var(--c-gray);
	line-height:1;
}
.mdlr-shop-fbtn.is-active .mdlr-shop-fbtn__count{
	color:var(--c-noir);
	opacity:0.7;
}

@media (max-width:760px){
	.mdlr-shop-fbtn{
		padding:14px 10px;
		min-height:74px;
		gap:5px;
		box-shadow:4px 4px 0 var(--c-noir);
	}
	.mdlr-shop-fbtn:hover{
		box-shadow:6px 6px 0 var(--c-rouge);
	}
	.mdlr-shop-fbtn.is-active{
		box-shadow:4px 4px 0 var(--c-noir);
	}
	.mdlr-shop-fbtn__name{font-size:clamp(18px,5.5vw,26px)}
	.mdlr-shop-fbtn__count{font-size:9px;letter-spacing:0.14em}
}


/* ====================================================================
   4.5 OCULTAR ELEMENTOS WC POR DEFECTO (refuerzo CSS por si los hooks PHP fallan)
   ==================================================================== */

.mdlr-shop-active .woocommerce-result-count,
.mdlr-shop-active .woocommerce-ordering,
body.woocommerce-shop .woocommerce-result-count,
body.woocommerce-shop .woocommerce-ordering,
body.tax-product_cat .woocommerce-result-count,
body.tax-product_cat .woocommerce-ordering,
body.archive.woocommerce .woocommerce-result-count,
body.archive.woocommerce .woocommerce-ordering,
body.archive .term-description,
body.woocommerce-shop .woocommerce-breadcrumb,
body.tax-product_cat .woocommerce-breadcrumb,
body.archive.woocommerce .woocommerce-breadcrumb{
	display:none !important;
}


/* ====================================================================
   5. GRID + LOADER
   ==================================================================== */

.mdlr-shop-grid-wrap{
	position:relative;
	min-height:200px;
	transition:opacity 0.25s var(--ease);
}

.mdlr-shop-grid-wrap.is-loading{
	opacity:0.4;
	pointer-events:none;
}

/* Loader (3 puntos rebotando) */
.mdlr-shop-loader{
	position:absolute;
	top:60px;
	left:50%;
	transform:translateX(-50%);
	display:none;
	gap:8px;
	z-index:10;
}
.mdlr-shop-grid-wrap.is-loading .mdlr-shop-loader{display:flex}

.mdlr-shop-loader__dot{
	width:10px;
	height:10px;
	background:var(--c-rouge);
	border-radius:50%;
	animation:mdlr-bounce 1.2s ease-in-out infinite;
}
.mdlr-shop-loader__dot:nth-child(2){animation-delay:0.15s}
.mdlr-shop-loader__dot:nth-child(3){animation-delay:0.3s}

@keyframes mdlr-bounce{
	0%,80%,100%{transform:scale(0.5);opacity:0.4}
	40%{transform:scale(1);opacity:1}
}

.mdlr-shop-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:24px;
}

@media (max-width:1180px){
	.mdlr-shop-grid{grid-template-columns:repeat(3,1fr);gap:18px}
}
@media (max-width:760px){
	.mdlr-shop-grid{grid-template-columns:repeat(2,1fr);gap:14px}
}
@media (max-width:420px){
	.mdlr-shop-grid{gap:10px}
}


/* ====================================================================
   6. CARD DE PRODUCTO
   ==================================================================== */

.mdlr-shop-card{
	background:var(--c-blanc);
	border:3px solid var(--c-noir);
	box-shadow:6px 6px 0 var(--c-noir);
	transition:transform 0.25s var(--ease),box-shadow 0.25s var(--ease);
	display:flex;
	flex-direction:column;
	min-width:0;
	position:relative;
}

.mdlr-shop-card:hover{
	transform:translate(-3px,-3px);
	box-shadow:9px 9px 0 var(--c-rouge);
}

.mdlr-shop-card.is-out{
	opacity:0.7;
}
.mdlr-shop-card.is-out:hover{
	transform:none;
	box-shadow:6px 6px 0 var(--c-noir);
}

.mdlr-shop-card__link{
	display:flex;
	flex-direction:column;
	height:100%;
	color:inherit;
	text-decoration:none;
}

/* Media */
.mdlr-shop-card__media{
	position:relative;
	aspect-ratio:1/1;
	background:var(--c-creme);
	overflow:hidden;
	border-bottom:3px solid var(--c-noir);
}

.mdlr-shop-card__img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:opacity 0.4s var(--ease),transform 0.6s var(--ease);
}

.mdlr-shop-card__img--main{
	position:relative;
	z-index:1;
}

.mdlr-shop-card__img--hover{
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	opacity:0;
}

.mdlr-shop-card:hover .mdlr-shop-card__img--main{
	transform:scale(1.04);
}
.mdlr-shop-card:hover .mdlr-shop-card__img--hover{
	opacity:1;
}

/* Badge */
.mdlr-shop-card__badge{
	position:absolute;
	top:10px;
	left:10px;
	z-index:5;
	font-family:var(--ff-anton);
	font-size:14px;
	letter-spacing:0;
	background:var(--c-rouge);
	color:var(--c-noir);
	padding:4px 10px;
	border:2px solid var(--c-noir);
	transform:rotate(-4deg);
	box-shadow:2px 2px 0 var(--c-noir);
	line-height:1;
	text-transform:uppercase;
}
.mdlr-shop-card__badge--new{
	background:var(--c-noir);
	color:var(--c-rouge);
}
.mdlr-shop-card__badge--sale{
	background:var(--c-rouge);
	color:var(--c-noir);
}

/* Sold out overlay */
.mdlr-shop-card__sold{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%) rotate(-6deg);
	z-index:5;
	font-family:var(--ff-anton);
	font-size:clamp(18px,3.5vw,28px);
	background:var(--c-noir);
	color:var(--c-blanc);
	padding:8px 20px;
	border:3px solid var(--c-noir);
	letter-spacing:0.04em;
}

/* Body */
.mdlr-shop-card__body{
	padding:14px 16px 16px;
	display:flex;
	flex-direction:column;
	gap:8px;
	flex:1;
}

.mdlr-shop-card__name{
	font-family:var(--ff-anton) !important;
	font-weight:normal !important;
	font-size:clamp(15px,1.4vw,19px) !important;
	line-height:1.05 !important;
	letter-spacing:-0.005em;
	text-transform:uppercase;
	color:var(--c-noir) !important;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
	min-height:2.1em;
	margin:0;
}

.mdlr-shop-card__price{
	font-family:var(--ff-anton) !important;
	font-weight:normal;
	font-size:clamp(20px,1.9vw,26px);
	color:var(--c-rouge);
	display:flex;
	align-items:baseline;
	gap:8px;
	flex-wrap:wrap;
	letter-spacing:-0.005em;
	line-height:1;
}
.mdlr-shop-card__price *,
.mdlr-shop-card__price bdi,
.mdlr-shop-card__price span,
.mdlr-shop-card__price .woocommerce-Price-amount,
.mdlr-shop-card__price .price{
	font-family:var(--ff-anton) !important;
	font-weight:normal !important;
	color:inherit;
	font-style:normal;
}
.mdlr-shop-card__price del,
.mdlr-shop-card__price del *,
.mdlr-shop-card__price del bdi,
.mdlr-shop-card__price del .woocommerce-Price-amount{
	font-family:var(--ff-mono) !important;
	color:var(--c-gray) !important;
	font-weight:600 !important;
	font-size:13px !important;
	text-decoration:line-through;
	letter-spacing:0;
}
.mdlr-shop-card__price ins,
.mdlr-shop-card__price ins *,
.mdlr-shop-card__price ins bdi{
	text-decoration:none !important;
	color:var(--c-rouge) !important;
	font-family:var(--ff-anton) !important;
}
.mdlr-shop-card__price .woocommerce-Price-currencySymbol{
	font-family:var(--ff-anton) !important;
	margin-right:1px;
}

/* Tallas disponibles */
.mdlr-shop-card__sizes{
	display:flex;
	gap:4px;
	flex-wrap:wrap;
	margin-top:4px;
}
.mdlr-shop-card__size{
	font-family:var(--ff-mono);
	font-size:9px;
	font-weight:700;
	letter-spacing:0.1em;
	color:var(--c-noir);
	background:var(--c-creme);
	padding:3px 7px;
	border:1.5px solid var(--c-noir);
	line-height:1;
}

/* Stock low */
.mdlr-shop-card__stock{
	display:inline-flex;
	align-items:center;
	gap:6px;
	font-family:var(--ff-mono);
	font-size:10px;
	font-weight:700;
	letter-spacing:0.14em;
	text-transform:uppercase;
	color:var(--c-rouge);
	margin-top:auto;
	padding-top:6px;
}
.mdlr-shop-card__stock::before{
	content:'';
	width:6px;
	height:6px;
	background:var(--c-rouge);
	border-radius:50%;
	animation:mdlr-shop-pulse 1.8s ease-in-out infinite;
}

@keyframes mdlr-shop-pulse{
	0%,100%{opacity:1;transform:scale(1)}
	50%{opacity:0.4;transform:scale(1.4)}
}


/* ====================================================================
   7. EMPTY STATE
   ==================================================================== */

.mdlr-shop-empty{
	text-align:center;
	padding:80px 20px;
	color:var(--c-noir);
}
.mdlr-shop-empty svg{
	width:48px;
	height:48px;
	color:var(--c-rouge);
	margin-bottom:18px;
}
.mdlr-shop-empty h3{
	font-family:var(--ff-anton);
	font-size:clamp(24px,3vw,36px);
	letter-spacing:-0.005em;
	text-transform:uppercase;
	margin-bottom:8px;
	color:var(--c-noir);
}
.mdlr-shop-empty p{
	font-family:var(--ff-body);
	font-size:14px;
	color:var(--c-gray);
	max-width:400px;
	margin:0 auto;
}
.mdlr-shop-empty__cta{
	color:var(--c-rouge);
	font-weight:700;
	text-decoration:underline;
	transition:color 0.2s var(--ease);
}
.mdlr-shop-empty__cta:hover{color:var(--c-noir)}


/* ====================================================================
   8. WooCommerce overrides (paginación, etc)
   ==================================================================== */

.woocommerce-pagination{
	margin-top:48px;
	text-align:center;
}
.woocommerce-pagination ul.page-numbers{
	display:inline-flex;
	gap:6px;
	border:none;
	margin:0;
	padding:0;
}
.woocommerce-pagination ul.page-numbers li{
	border:none;
	margin:0;
}
.woocommerce-pagination ul.page-numbers li .page-numbers{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:42px;
	height:42px;
	border:2px solid var(--c-noir);
	background:var(--c-blanc);
	color:var(--c-noir);
	font-family:var(--ff-anton);
	font-size:16px;
	letter-spacing:0;
	transition:transform 0.15s var(--ease),box-shadow 0.15s var(--ease),background 0.15s var(--ease);
}
.woocommerce-pagination ul.page-numbers li .page-numbers.current{
	background:var(--c-rouge);
	color:var(--c-noir);
}
.woocommerce-pagination ul.page-numbers li .page-numbers:hover{
	transform:translate(-2px,-2px);
	box-shadow:3px 3px 0 var(--c-rouge);
}


/* ====================================================================
   9. Reduced motion
   ==================================================================== */

@media (prefers-reduced-motion:reduce){
	.mdlr-shop-page *,
	.mdlr-shop-page *::before,
	.mdlr-shop-page *::after{
		animation:none !important;
		transition:none !important;
	}
}