/* ======================================================================
   Categorías y subcategorías: botón de categoría activo, etiquetas de
   subcategoría (index) y selects anidados de mapas y filtros.
   Ver public/js/tur-taxonomia.js. Colores del tema oscuro en dark-mode.css.
   ====================================================================== */

/* Categoría elegida en los botones del index: queda con el mismo aspecto que el botón tiene al
   pasar el cursor por encima (style.css, .category-small-box-alt:hover): foto levemente oscurecida
   con el ícono y el nombre en blanco encima, y el botón un poco elevado. Aquí se deja fijo. */
.category-small-box-alt.is-active {
	background-color: #66676b;
	color: #fff;
	transform: translateY(-6px);
}
.category-small-box-alt.is-active h4,
.category-small-box-alt.is-active i {
	color: #fff;
}
.category-small-box-alt.is-active .category-box-counter-alt {
	color: #fff;
	background-color: #f91942;
}
.category-small-box-alt.is-active:before {
	opacity: 0.7;
}
.category-small-box-alt.is-active img {
	opacity: 1;
}

/* Subcategorías como etiquetas: una fila que se desplaza en horizontal en el teléfono
   y se reparte en varias líneas desde 768px. */
.tur-subcats {
	--tsc-line: #d9d9d9;
	--tsc-bg: #fff;
	--tsc-text: #333;
	--tsc-accent: #d90f36;
	--tsc-accent-soft: #feecef;
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	margin: 0 0 22px;
	padding: 2px 0 6px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity;
	animation: tur-subcats-in 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.tur-subcats::-webkit-scrollbar {
	display: none;
}
.tur-subcats[hidden] {
	display: none;
}

.tur-subcat-chip {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	margin: 0;
	padding: 0 16px;
	border: 1px solid var(--tsc-line);
	border-radius: 20px;
	background: var(--tsc-bg);
	color: var(--tsc-text);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	scroll-snap-align: start;
	-webkit-tap-highlight-color: transparent;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.tur-subcat-chip:hover {
	border-color: var(--tsc-accent);
}
.tur-subcat-chip:focus-visible {
	outline: 2px solid var(--tsc-accent);
	outline-offset: 2px;
}
.tur-subcat-chip.is-active {
	background: var(--tsc-accent-soft);
	border-color: var(--tsc-accent);
	color: var(--tsc-accent);
}
.tur-subcat-x {
	font-size: 13px;
}

@keyframes tur-subcats-in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.tur-subcats { animation: none; }
	.tur-subcat-chip { transition: none; }
}

@media (min-width: 768px) {
	.tur-subcats {
		flex-wrap: wrap;
		overflow-x: visible;
	}
}

/* Selects de los mapas (categoría y subcategoría), mismo lenguaje que el buscador flotante. */
#filtro-subcategoria[hidden] {
	display: none !important;
}

/* Etiqueta de subcategoría junto a la de categoría en destino y evento: neutra, para que el color
   siga siendo el de la categoría. */
.listing-tag.tur-subcat-tag {
	background: transparent !important;
	color: #555 !important;
	border: 1px solid #cfcfcf;
	margin-left: 6px;
}
html[data-theme="dark"] .listing-tag.tur-subcat-tag {
	color: var(--tur-text-muted) !important;
	border-color: var(--tur-border);
}