/**
 * Prodimer Catalog Toolbar — visual upgrade for catalog header
 * - Sticky blur bar (desktop)
 * - Breadcrumb typography + #129EB5 accent
 * - Result count pill
 * - Hides native ordering duplicated in sidebar
 * All declarations use !important to survive Flatsome overrides.
 */

/* ------------------------------------------------------------------
   1. Barra contenedora sticky con blur (desktop)
   Flatsome uses .shop-page-title.category-page-title for category/archive header.
   Fallbacks: .woocommerce-products-header (Woo core), .shop-page-title, .category-page-title,
   and the row .woocommerce-before-shop-loop.
------------------------------------------------------------------ */
.shop-page-title.category-page-title,
.shop-page-title,
.category-page-title,
.woocommerce-products-header {
	background: rgba(255, 255, 255, 0.85) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	border-bottom: 1px solid #e5e7eb !important;
	padding: 10px 0 !important;
	position: sticky !important;
	top: 0 !important;
	z-index: 20 !important;
}

/* Fallback: ensure header inner container respects blur bg */
.shop-page-title.category-page-title .flex-row,
.shop-page-title .flex-row,
.category-page-title .flex-row {
	background: transparent !important;
}

/* Shop container breadcrumb row — ensure transparent so sticky parent shows through */
.shop-container .woocommerce-breadcrumb {
	background: transparent !important;
}

/* ------------------------------------------------------------------
   2. Layout de la fila: flex para alinear breadcrumb izq / count centro-der
------------------------------------------------------------------ */
.woocommerce-before-shop-loop,
.shop-page-title .flex-row,
.category-page-title .flex-row,
.woocommerce-products-header .flex-row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px !important;
	flex-wrap: wrap !important;
}

/* Breadcrumb wrapper should take available space on left */
.woocommerce-breadcrumb {
	flex: 1 1 auto !important;
	min-width: 0 !important;
}

/* Result count should not shrink excessively, aligned center/right */
.woocommerce-result-count {
	flex: 0 0 auto !important;
}

/* ------------------------------------------------------------------
   3. Breadcrumb
------------------------------------------------------------------ */
.woocommerce-breadcrumb,
.woocommerce .woocommerce-breadcrumb,
.shop-page-title .woocommerce-breadcrumb,
.category-page-title .woocommerce-breadcrumb,
.shop-container .woocommerce-breadcrumb {
	font-size: 11px !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	font-weight: 500 !important;
	color: #6b7280 !important;
	margin: 0 !important;
	line-height: 1.5 !important;
}

.woocommerce-breadcrumb a,
.woocommerce .woocommerce-breadcrumb a,
.shop-page-title .woocommerce-breadcrumb a {
	color: #6b7280 !important;
	text-decoration: none !important;
	transition: color 0.15s ease !important;
}

.woocommerce-breadcrumb a:hover,
.woocommerce .woocommerce-breadcrumb a:hover {
	color: #129EB5 !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
}

.woocommerce-breadcrumb span,
.woocommerce-breadcrumb .divider,
.woocommerce .woocommerce-breadcrumb .divider,
.breadcrumb span,
.breadcrumb .divider {
	color: #9ca3af !important;
	margin: 0 6px !important;
}

/* Último item (CATEGORÍAS / categoría actual) en turquesa bold */
.woocommerce-breadcrumb strong,
.woocommerce-breadcrumb span:last-child,
.woocommerce .woocommerce-breadcrumb span:last-child,
.breadcrumb span:last-child,
.woocommerce-breadcrumb a:last-of-type + span,
.shop-page-title .woocommerce-breadcrumb strong {
	color: #129EB5 !important;
	font-weight: 700 !important;
}

/* If breadcrumb uses current page without link, target last text node via nav */
.woocommerce-breadcrumb {
	/* ensure last segment stands out even when plain text */
}

/* ------------------------------------------------------------------
   4. Result count como badge pill
------------------------------------------------------------------ */
.woocommerce-result-count,
.woocommerce .woocommerce-result-count,
.shop-page-title .woocommerce-result-count {
	font-size: 12px !important;
	font-weight: 600 !important;
	color: #374151 !important;
	background: #f3f4f6 !important;
	border: 1px solid #e5e7eb !important;
	border-radius: 999px !important;
	padding: 4px 10px !important;
	line-height: 1.4 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	white-space: nowrap !important;
}

/* ------------------------------------------------------------------
   5. Ocultar ordering nativo duplicado (ya está en sidebar izquierdo)
   Resilient: cover form, select, and any wrapper Flatsome may inject.
------------------------------------------------------------------ */
.woocommerce-ordering,
.woocommerce .woocommerce-ordering,
form.woocommerce-ordering,
.shop-container .woocommerce-ordering,
.woocommerce-before-shop-loop .woocommerce-ordering,
.shop-page-title .woocommerce-ordering,
.category-page-title .woocommerce-ordering,
.woocommerce-products-header .woocommerce-ordering {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	height: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

/* Hide the select even if form is re-added via JS */
.woocommerce-ordering select,
.woocommerce .woocommerce-ordering select,
form.woocommerce-ordering select,
select.orderby {
	display: none !important;
}

/* ------------------------------------------------------------------
   6. Responsive
------------------------------------------------------------------ */
@media (max-width: 849px) {
	.woocommerce-breadcrumb,
	.woocommerce .woocommerce-breadcrumb,
	.shop-page-title .woocommerce-breadcrumb {
		font-size: 10px !important;
		letter-spacing: 0.06em !important;
	}

	.woocommerce-result-count,
	.woocommerce .woocommerce-result-count {
		font-size: 11px !important;
		padding: 3px 8px !important;
	}

	/* En mobile, sticky desactivo para no tapar contenido / header fijo de Flatsome */
	.shop-page-title.category-page-title,
	.shop-page-title,
	.category-page-title,
	.woocommerce-products-header {
		position: relative !important;
		top: auto !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
		background: #ffffff !important;
	}

	/* Fila en columna en mobile */
	.woocommerce-before-shop-loop,
	.shop-page-title .flex-row,
	.category-page-title .flex-row,
	.woocommerce-products-header .flex-row {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 8px !important;
	}
}