/* v0.12 · 51-plp2 — reglas nuevas de este frente (se cargan después de theme.css; al final se pegan a theme.css en este orden). */

/* Encabezado del listado (wireframe v0.12, .cat-head): migas a 28px del header (20px en usados y DEALS Black), 10px hasta el H1
   y frase de 15px/1.5 a 10px, de 70 caracteres como máximo. En celular: 16px, 4px y 6px (12px, 2px y 4px en usados) */
.emx-shop .emx-crumbs-wrap{padding-top:12px;margin-bottom:10px}
.emx-shop-used .emx-crumbs-wrap{padding-top:4px}
.emx-shop .emx-crumbs .rank-math-breadcrumb p{margin:0}
.emx-shop > .wp-block-query-title,.emx-shop > h1{margin-block-start:0}
/* La frase más angosta que la columna sigue alineada a la izquierda con el H1 (el diseño "constrained" la centraba) */
.emx-shop > .emx-cat-sub{margin-block:10px 0;margin-left:max(0px,(100% - var(--wp--style--global--content-size,1120px)) / 2)!important;margin-right:auto!important;font-size:15px;line-height:1.5;max-width:70ch}

/* Subcategorías como chips: 16px bajo la frase (en DEALS Black, 32px, como los cajones de usados) */
.emx-shop .emx-qchips{margin-top:16px}
.emx-shop-used .emx-qchips{margin-top:32px}
/* Cajones DEALS / DEALS Black: 16px bajo la frase. Hasta Filtros y "Ordenar por", 32px (dueño, nov 2026: un poco más
   de aire que los 20px del wireframe), igual en todas las categorías */
.emx-shop .emx-lines{margin-top:16px}
@media (min-width:1024px){.emx-shop .emx-shop-cols{margin-top:32px}}

/* Cajones DEALS / DEALS Black (wireframe v0.12, .ln-go y .ln-black): flecha de 22px/700 y borde gris oscuro en la caja Black */
.emx-line::after{font-size:22px;font-weight:700}
.emx-lines .emx-line.is-black{border-color:var(--muted)}

/* Grilla y "Cargar más" (wireframe v0.12, .res-top y .more): 12px de la fila de orden a la grilla, barra de 200px y botón de 52px con borde de 2px */
@media (min-width:1024px){.emx-shop .emx-grid-bar{margin-bottom:12px}}
.emx-more-bar{width:200px}
.emx-more .emx-more-b{min-height:52px;border-width:2px}

/* Hoja de filtros mientras llega la lista (shop.js, dueño nov 2026): "Buscando…" con un giro en el botón y la grilla atenuada */
#emx-filters.is-loading .emx-fs-go::before{content:"";display:inline-block;width:14px;height:14px;margin-right:8px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;vertical-align:-2px;animation:emxFsSpin .7s linear infinite}
.emx-grid-wrap.is-loading{opacity:.45;transition:opacity .15s;pointer-events:none}
@keyframes emxFsSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){#emx-filters.is-loading .emx-fs-go::before{animation-duration:2s}}

/* Etiqueta "DEALS Black" sobre la foto de la grilla mezclada (wireframe v0.12, .pc-line-bk): píldora oscura */
.pcard.black .pc-tag{background:var(--ink);border-color:var(--ink);color:#fff}

/* Sin resultados (wireframe v0.12, .empty): línea continua, radio 20, título de 20px/800, sugerencia gris y dos botones de 52px */
.emx-empty{padding:48px 24px;border:1px solid var(--line);border-radius:20px}
.emx-empty > p{margin:0 0 6px;color:var(--muted)}
.emx-empty > .emx-empty-t{font-size:20px;font-weight:700;line-height:1.5;color:var(--ink)}
.emx-empty-a{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:16px}
.emx-empty-a .btn{min-height:52px;border-width:2px}

/* Puente al final del listado (wireframe v0.12, .bridge): caja alineada con la grilla (1120px), 64px bajo los productos y 48px debajo,
   flecha de 22px/700 a 28px del borde y fondo suave al pasar el puntero */
.emx-shop .emx-shop-cols{margin-bottom:56px}
.emx-shop .emx-bridge{padding-block:8px 48px}
.emx-shop .emx-bridge > .emx-bridge-box{max-width:1120px;margin-inline:auto;padding:22px 66px 22px 28px;transition:background-color .15s}
.emx-shop .emx-bridge-box::after{right:28px;font-size:22px}
.emx-shop .emx-bridge-box:hover,.emx-shop .emx-bridge-box:focus-within{background:var(--soft);box-shadow:none}

/* Videos de clientes del listado de usados (wireframe v0.12, #s-tst): H2 de 32px y bajada de 17px/1.5 a 10px */
.emx-clientes-lst h2.wp-block-heading{font-size:32px;line-height:1.15;letter-spacing:-.02em}
.emx-clientes-lst .emx-tst-head > .emx-tst-lead{margin-top:10px;font-size:17px;line-height:1.5;color:var(--muted)}

/* Texto SEO al final del listado (wireframe v0.12, .seo): columna centrada de 740px de texto, H2 de 32px/800, H3 de 18px/800 y párrafos de 15px/1.6 */
.emx-seo .emx-seo-text{max-width:740px;margin-inline:auto;font-size:15px;line-height:1.6;color:var(--muted)}
.emx-seo .emx-seo-text > *{margin:0 0 12px}
.emx-seo .emx-seo-text h2{margin:0;font-size:32px;font-weight:700;line-height:1.15;letter-spacing:-.02em;color:var(--ink)}
.emx-seo .emx-seo-text h3{margin:28px 0 8px;font-size:18px;font-weight:700;line-height:1.5;color:var(--ink)}

@media (max-width:781px){
	/* Encabezado */
	.emx-shop .emx-crumbs-wrap{padding-top:16px}
	.emx-shop .emx-crumbs{margin-bottom:4px}
	.emx-shop .emx-crumbs + .wc-block-store-notices + .wp-block-query-title,.emx-shop .emx-crumbs + .wp-block-query-title{margin-block-start:0}
	.emx-shop .emx-cat-sub{margin-top:6px;font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
	.emx-shop-used .emx-crumbs-wrap{padding-top:12px}
	.emx-shop-used .emx-crumbs{margin-bottom:2px}
	.emx-shop-used .emx-cat-sub{margin-top:4px;display:block;overflow:visible}
	/* Página de un modelo de DEALS Black (sin frase ni chips): 19px del título a "Filtrar y ordenar", como el wireframe */
	.emx-shop.emx-shop-model .emx-shop-cols{margin-top:9px}
	/* Chips: 12px bajo la frase y 8px hasta "Filtrar y ordenar" (en DEALS Black, 24px y 0), texto de .8rem */
	.emx-shop .emx-qchips{margin:12px -16px 8px!important}
	.emx-shop-used .emx-qchips{margin:24px -16px 0!important}
	.emx-shop .emx-qchips .emx-chip{font-size:.8rem}
	/* Cajones: 12px bajo la frase; título y frase corta con 6px entre ellos; la frase de DEALS sin transparencia */
	.emx-shop .emx-lines{margin-top:12px}
	.emx-line::after{font-size:16px}
	.emx-shop .emx-line-txt{display:flex;flex-direction:column;gap:6px}
	.emx-line:not(.is-black) .emx-line-v2{opacity:1}
	/* Puente: 48px bajo los productos */
	.emx-shop .emx-shop-cols{margin-bottom:40px}
	.emx-shop .emx-bridge > .emx-bridge-box{padding:16px 56px 16px 18px}
	.emx-shop .emx-bridge-box::after{right:18px}
	.emx-shop .emx-bridge-box .emx-bridge-t{font-size:16px}
	.emx-shop .emx-bridge-box p{font-size:13px}
	/* Videos de clientes */
	.emx-clientes-lst h2.wp-block-heading{font-size:24px}
	.emx-clientes-lst .emx-tst-head > .emx-tst-lead{font-size:15px}
	/* Texto SEO */
	.emx-seo .emx-seo-text{font-size:14px}
	.emx-seo .emx-seo-text h2{font-size:24px}
	.emx-seo .emx-seo-text h3{font-size:16px}
}
