/*
 * Catálogo: tienda, categorías y búsqueda.
 *
 * En móvil la barra «Filtrar / Ordenar» abre paneles off-canvas; en
 * escritorio se ven los chips de categoría y los selects en línea.
 */

.or-shop-bar {
	display: grid; grid-template-columns: 1fr 1fr; position: sticky; top: var(--or-hdr-h); z-index: 20;
	background: var(--or-white); border-bottom: 1px solid #E5DFE2;
}
.admin-bar .or-shop-bar { top: calc(var(--or-hdr-h) + 46px); }
.or-shop-bar a { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; font-size: var(--or-fs-md); color: var(--or-ink); text-decoration: none; }
.or-shop-bar a + a { border-left: 1px solid #E5DFE2; }

.or-shop-hero { background: var(--or-white); text-align: center; }
.or-shop-hero .or-wrap { padding-top: 24px; padding-bottom: 8px; }
.or-shop-hero__title { margin: 0; font-size: 28px; font-weight: 800; letter-spacing: -0.01em; }
.or-shop-hero__text, .or-shop-hero .or-crumbs { display: none; }

.or-crumbs { font-size: var(--or-fs-xs); color: var(--or-violet); margin-bottom: 10px; }
.or-crumbs a { color: var(--or-violet); text-decoration: none; }
.or-crumbs a:hover { color: var(--or-ink); }

.or-shop-filters { display: none; }

.or-shop-results { padding-top: 20px; padding-bottom: 64px; }
.or-count { margin: 0 0 20px; font-size: var(--or-fs-sm); color: var(--or-violet); }

.or-empty { padding: 64px 24px; text-align: center; border: 1.5px dashed var(--or-line-2); border-radius: 16px; color: var(--or-muted-2); display: flex; flex-direction: column; align-items: center; gap: 14px; }
.or-empty p { margin: 0; }

/* Paginación nativa */
.woocommerce-pagination { margin-top: 40px; }
.woocommerce-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.woocommerce-pagination a, .woocommerce-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: var(--or-r-pill); border: 1.5px solid var(--or-line-2); text-decoration: none; font-weight: 600; }
.woocommerce-pagination .current { background: var(--or-ink); border-color: var(--or-ink); color: var(--or-white); }

/* Facetas del panel móvil */
.or-facet { border-bottom: 1px solid #ECE4E1; padding: 0 20px; }
.or-facet > summary {
	display: flex; align-items: center; justify-content: space-between; min-height: 56px; cursor: pointer; list-style: none;
	font-family: var(--or-font-display); font-weight: 600; font-size: 15px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--or-text-2);
}
.or-facet > summary::-webkit-details-marker { display: none; }
.or-facet[open] > summary svg { transform: rotate(180deg); }
.or-chk-row { display: flex; width: 100%; align-items: center; gap: 14px; min-height: 52px; border-bottom: 1px solid #F1ECEE; font-size: var(--or-fs-md); color: var(--or-ink); text-decoration: none; cursor: pointer; }
.or-oc__body > .or-chk-row { padding: 0 20px; }
.or-chk-row input { position: absolute; opacity: 0; pointer-events: none; }
.or-chk { flex: none; width: 22px; height: 22px; border-radius: 5px; border: 1.5px solid #9B95A0; display: flex; align-items: center; justify-content: center; }
.or-cnt { margin-left: auto; color: var(--or-muted-2); font-size: var(--or-fs-sm); }
.or-chk-row.is-on, .or-chk-row:has(input:checked) { font-weight: 700; }
.or-chk-row.is-on .or-chk, .or-chk-row input:checked + .or-chk { background: var(--or-ink); border-color: var(--or-ink); }
.or-chk-row.is-on .or-chk::after, .or-chk-row input:checked + .or-chk::after { content: ""; width: 6px; height: 11px; border: solid var(--or-white); border-width: 0 2px 2px 0; transform: rotate(45deg) translate(-1px, -1px); }
.or-chk-row input:focus-visible + .or-chk { outline: 2px solid var(--or-coral-deep); outline-offset: 2px; }

/* Botones de talle (compartidos con la ficha) */
.or-szgrid { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 0 18px; }
.or-sz-opt { position: relative; }
.or-sz-opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.or-sz { width: 52px; height: 48px; border-radius: var(--or-r-sm); border: 1.5px solid var(--or-line-2); background: var(--or-white); font-weight: 700; font-size: 15px; color: var(--or-ink); display: flex; align-items: center; justify-content: center; }
.or-sz-opt:hover .or-sz { border-color: var(--or-ink); }
.or-sz-opt input:checked + .or-sz { background: var(--or-ink); border-color: var(--or-ink); color: var(--or-white); }
.or-sz-opt input:focus-visible + .or-sz { outline: 2px solid var(--or-coral-deep); outline-offset: 2px; }
.or-sz-opt input:disabled + .or-sz { color: #B5AFB8; background: var(--or-cream-2); text-decoration: line-through; }

@media (min-width: 1181px) {
	.or-shop-bar { display: none; }
	.or-shop-hero { background: var(--or-cream); text-align: left; }
	.or-shop-hero .or-wrap { padding-top: 28px; padding-bottom: 32px; }
	.or-shop-hero__title { font-size: 40px; }
	.or-shop-hero__text { display: block; margin: 6px 0 0; color: var(--or-muted); }
	.or-shop-hero .or-crumbs { display: block; }
	.or-shop-filters { display: block; position: sticky; top: var(--or-hdr-h); z-index: 20; background: var(--or-white); border-bottom: 1px solid var(--or-line); }
	.admin-bar .or-shop-filters { top: calc(var(--or-hdr-h) + 32px); }
	.or-shop-filters__in { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; padding-block: 14px; }
	.or-chips { display: flex; gap: 8px; flex-wrap: wrap; flex: 1 1 520px; }
	.or-toolbar { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
	.or-shop-results { padding-top: 28px; padding-bottom: 88px; }
}

/* ---------- Tienda en teléfonos y tablets ---------- */

@media (max-width: 1180px) {
	/* Las categorías como tira deslizable bajo el título: en móvil no había
	 * forma de pasar de Caravanas a Anillos sin abrir el panel de filtros. Los
	 * selects de escritorio siguen ocultos (están en el panel). */
	.or-shop-filters { display: block; border-bottom: 1px solid var(--or-line); }
	.or-shop-filters__in { padding: 0; }
	.or-shop-filters .or-toolbar { display: none; }
	.or-chips {
		display: flex; gap: 8px; overflow-x: auto; padding: 4px var(--or-gutter) 14px; scrollbar-width: none;
		scroll-snap-type: x proximity; scroll-padding-inline: var(--or-gutter);
	}
	.or-chips::-webkit-scrollbar { display: none; }
	.or-chips .or-chip { min-height: 38px; padding: 0 14px; font-size: 13px; scroll-snap-align: start; }
	.or-shop-bar span.or-shop-bar__current { color: var(--or-coral-deep); font-weight: 600; }
}

}

/* Subcategoría: un poco más tenue que la familia, para que se lea la jerarquía. */
.or-chip--sub { border-style: dashed; }
.or-chip--sub.is-on { border-style: solid; }

/* Columnas del listado desde «Tienda y filtros». */
.or-shop-results ul.products { grid-template-columns: repeat(var(--or-cols-m, 2), minmax(0, 1fr)); }
@media (min-width: 961px) {
	.or-shop-results ul.products { grid-template-columns: repeat(var(--or-cols, 4), minmax(0, 1fr)); }
}

/* Sin «Ordenar por», el botón de filtros ocupa toda la barra. */
.or-shop-bar.is-single { grid-template-columns: 1fr; }

/* Filtros activos (fichas con ✕) */
.or-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -6px 0 18px; }
.or-active__item {
	display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 10px 0 14px; border-radius: var(--or-r-pill);
	background: var(--or-ink); color: var(--or-white); font-size: 13px; font-weight: 600; text-decoration: none; transition: background-color 0.2s ease;
}
.or-active__item:hover { background: var(--or-coral-deep); color: var(--or-white); }
.or-active__item svg { flex: none; }

/* El precio y el talle son de una sola opción: se marcan redondos, como
 * radio, para que no parezca que se pueden elegir varios. */
.or-chk-row input[type="radio"] + .or-chk { border-radius: 50%; }
#or-sort .or-chk, .or-facet--single .or-chk { border-radius: 50%; }