/**
 * ONE CATÁLOGO - Estilos CSS para páginas de catálogo
 * Bajar todos los z-index del catálogo para que queden por debajo del stuck-nav
 * El stuck-nav tiene z-index: 9999, así que bajamos todo el catálogo a z-index: 0 o inferior
 */

/* ============================================================
   BAJAR Z-INDEX DE TODOS LOS ELEMENTOS DEL CATÁLOGO
   ============================================================ */

/* Contenedor principal del catálogo - crear contexto de apilamiento */
#pt-pageContent,
.pt-pageContent,
.container-indent,
.pt-product-listing,
.pt-layout-product-item,
.modulo-productos {
	position: relative;
	z-index: 0 !important;
	isolation: isolate; /* Crear nuevo contexto de apilamiento */
}

/* Productos individuales */
.pt-product {
	position: relative;
	z-index: 0 !important;
}

/* Cajas de imagen */
.pt-product .pt-image-box {
	z-index: 0 !important;
}

/* Imagen roll-over - bajar de z-index: 1 a 0 */
.pt-product .pt-image-box .pt-img-roll-over {
	z-index: 0 !important;
}

/* Labels (SALE, NEW, etc.) - mantener z-index pero no cambiar position */
/* IMPORTANTE: Mantener position: absolute para que se posicionen correctamente */
.pt-product .pt-image-box .pt-label-location {
	z-index: 5 !important;
	/* NO cambiar position: absolute, ya está definido en style.css */
}

.pt-product .pt-image-box .pt-label-location [class^=pt-label-] {
	z-index: 5 !important;
	/* NO cambiar position, mantener el original */
}

/* Botones de aplicación (wishlist, compare, quickview) - mantener z-index alto para que se vean por encima del enlace */
/* IMPORTANTE: Mantener position: absolute para que se posicionen correctamente */
.pt-product .pt-image-box .pt-app-btn {
	z-index: 10 !important;
	/* NO cambiar position: absolute, ya está definido en style.css */
}

.pt-product .pt-image-box .pt-app-btn > * {
	z-index: 10 !important;
	/* NO cambiar position, mantener el original */
}

/* Asegurar que los botones individuales sean clickeables */
.pt-product .pt-image-box .pt-app-btn [class^=pt-btn] {
	z-index: 11 !important;
	pointer-events: auto !important;
	/* NO cambiar position, mantener el original */
}

/* Countdown box - bajar de z-index: 5 a 0 */
.pt-product .pt-image-box .pt-countdown_box {
	z-index: 0 !important;
}

/* Descripción del producto - bajar de z-index: 2 a 0 */
.pt-product .pt-description {
	z-index: 0 !important;
}

/* Opciones de producto (swatches) */
.pt-product .pt-options-swatch,
.pt-options-swatch {
	z-index: 0 !important;
}

.pt-product .pt-options-swatch li,
.pt-options-swatch li {
	z-index: 0 !important;
}

/* Availability icon - bajar z-index */
.pt-options-swatch li[data-availability=false] .availability-icon,
.availability-icon {
	z-index: 0 !important;
}

/* Options color img y sus pseudo-elementos */
.pt-options-swatch li a.options-color-img {
	z-index: 0 !important;
}

.pt-options-swatch li a.options-color-img:before {
	z-index: 0 !important;
}

.pt-options-swatch li a.options-color-img:after {
	z-index: 0 !important;
}

/* Row hover */
.pt-product .pt-description .pt-row-hover {
	z-index: 0 !important;
}

/* Wrapper de botones */
.pt-product .pt-description .pt-wrapper-btn {
	z-index: 0 !important;
}

/* Botones de acción */
.pt-product .pt-description .pt-btn-addtocart,
.pt-product .pt-description .pt-btn-wishlist,
.pt-product .pt-description .pt-btn-compare,
.pt-product .pt-description .pt-btn-quickview {
	z-index: 0 !important;
}

/* Precios */
.pt-product .pt-description .pt-price {
	z-index: 0 !important;
}

/* Opciones de bloque */
.pt-product .pt-description .pt-option-block {
	z-index: 0 !important;
}

/* Columnas */
.pt-product .pt-description .pt-col {
	z-index: 0 !important;
}

/* Excepciones: elementos que NO deben tener z-index bajo (modales, tooltips, etc.) */
.pt-product .modal,
.pt-product .modal *,
.pt-product [data-toggle="modal"],
.pt-product [data-toggle="modal"] * {
	z-index: 999999 !important; /* Mantener alto para modales */
}

/* Tooltips - mantener z-index alto si están fuera del contexto del producto */
[data-tooltip],
[data-tooltip] * {
	z-index: 9999 !important;
}

/* ============================================================
   ALINEACIÓN DE ELEMENTOS EN PT-FILTERS-OPTIONS
   ============================================================ */

/* Asegurar que pt-filters-options use space-between para que contador quede a la izquierda y controles a la derecha */
.pt-filters-options {
	justify-content: space-between !important;
	align-items: center !important;
}

/* Contador de productos dentro de pt-filters-options - a la izquierda */
.pt-filters-options .pt-showing-results {
	flex: 0 0 auto;
	margin-right: auto;
	display: flex;
	align-items: center;
}

/* Asegurar que el texto del contador esté alineado verticalmente */
.pt-filters-options .pt-showing-results .pt-text {
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	white-space: nowrap;
}

/* Números del contador - misma fuente que el selector de ordenamiento */
.pt-showing-results .pt-numbers {
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	color: #333333;
}

/* ============================================================
   AJUSTES DE ESPACIADO DEL TÍTULO
   ============================================================ */

/* Asegurar que el título tenga espacio arriba (sobrescribir el margin-top negativo) */
.pt-title-subpages {
	margin-top: 20px !important;
}

/* Reducir el espacio abajo del título (de 37px a 15px) */
.pt-title-subpages.noborder {
	padding-bottom: 15px !important;
}

/* ============================================================
   MODAL DE FILTROS - Z-INDEX MÁS ALTO ABSOLUTO (SIN MEDIA QUERY)
   ============================================================ */

/* MODAL DE FILTROS - Z-INDEX MANEJADO POR JAVASCRIPT */
/* El z-index se aplica dinámicamente desde one-modal-filtros-zindex.js */
/* IMPORTANTE: El overlay (modal-filter) debe estar DEBAJO del sidebar */
.modal-filter {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
	background: rgba(0, 0, 0, 0.5);
	z-index: 99999998 !important; /* DEBAJO del sidebar */
}

/* Sidebar cuando está abierto - DEBE estar ARRIBA del overlay */
.leftColumn.aside.column-open,
.aside.leftColumn.column-open,
.col-md-4.col-lg-3.col-xl-3.leftColumn.aside.column-open {
	z-index: 99999999 !important; /* ARRIBA del overlay */
	position: fixed !important;
}

/* Botón cerrar - mismo z-index que sidebar */
.pt-btn-col-close {
	z-index: 99999999 !important;
	position: fixed !important;
}

/* ============================================================
   VERSIÓN MÓVIL - CONTADOR ARRIBA Y CENTRADO
   ============================================================ */

@media (max-width: 1024px) {
	/* En móvil, permitir que el contador se separe */
	.pt-filters-options {
		flex-wrap: wrap !important;
		justify-content: flex-end !important;
	}
	
	/* Contador separado y centrado arriba en móvil - como el título */
	.pt-filters-options .pt-showing-results {
		order: -1;
		width: 100%;
		text-align: center;
		margin-right: 0;
		margin-top: 4px;
		margin-bottom: 4px;
		justify-content: center;
		display: flex;
		align-items: center;
	}
	
	/* Asegurar que el texto del contador esté centrado en móvil */
	.pt-filters-options .pt-showing-results .pt-text {
		text-align: center;
		width: 100%;
		display: block;
	}
}