/* =========================================================
   Mi Viaje UI — Overrides de HivePress / ListingHive
   =========================================================
   Estos selectores apuntan a las clases con prefijo "hp-" que
   HivePress genera de forma consistente entre versiones recientes.
   Si tu instalación usa clases distintas (temas hijos muy
   personalizados, versiones antiguas), inspecciona el HTML
   renderizado y ajusta los selectores aquí — no hace falta tocar
   ningún otro archivo del plugin.
   ========================================================= */

body.mvj-theme {

	/* --- Fondo general de páginas de HivePress --- */
	background: var(--mvj-bg);
}

/* --- Contenedor de página --- */
body.mvj-theme .hp-page,
body.mvj-theme .hivepress-page {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
}

/* --- Grid de listados --- */
body.mvj-theme .hp-listings,
body.mvj-theme .hp-listing__list,
body.mvj-theme .hivepress-listings-container {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px 24px;
	list-style: none;
	padding: 0;
	margin: 24px 0;
}

/* HivePress asigna a cada anuncio un ancho en porcentaje (ej. width: 25%)
   pensado para su propio sistema de columnas por defecto (flex/float). Al
   convertir el contenedor en un grid de arriba, ese ancho heredado se
   combina con el ancho de la columna del grid y el resultado es una
   tarjeta minúscula (el texto se parte letra por letra). Esta regla
   neutraliza cualquier ancho fijo en los hijos directos del grid, sin
   necesidad de conocer el nombre exacto de esa clase de columna: el
   tamaño real de cada tarjeta pasa a depender solo de la columna del
   grid definida arriba. */
body.mvj-theme .hp-listings > *,
body.mvj-theme .hp-listing__list > *,
body.mvj-theme .hivepress-listings-container > * {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
}

/* --- Tarjeta de listing --- */
body.mvj-theme .hp-listing,
body.mvj-theme .hp-block--listing {
	background: var(--mvj-surface);
	border: none;
	border-radius: var(--mvj-radius-card);
	box-shadow: none;
	overflow: hidden;
	transition: transform var(--mvj-transition), box-shadow var(--mvj-transition);
	width: 100%;
}

body.mvj-theme .hp-listing:hover,
body.mvj-theme .hp-block--listing:hover {
	transform: translateY(-4px);
	box-shadow: var(--mvj-shadow-hover);
}

body.mvj-theme .hp-listing img,
body.mvj-theme .hp-listing__image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--mvj-radius-card);
	width: 100%;
	transition: transform var(--mvj-transition);
}

body.mvj-theme .hp-listing:hover img {
	transform: scale(1.04);
}

body.mvj-theme .hp-listing__title,
body.mvj-theme .hp-listing__name {
	font-weight: 600;
	font-size: 1rem;
	color: var(--mvj-text);
	margin: 10px 0 4px;
}

body.mvj-theme .hp-listing__categories,
body.mvj-theme .hp-listing__category {
	font-size: .75rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--mvj-text-secondary);
}

body.mvj-theme .hp-listing__location,
body.mvj-theme .hp-listing__attribute--location {
	font-size: .85rem;
	color: var(--mvj-text-secondary);
}

body.mvj-theme .hp-listing__price,
body.mvj-theme .hp-listing__attribute--price {
	font-weight: 600;
	color: var(--mvj-text);
	margin-top: 6px;
}

/* --- Favoritos (HivePress Favorites) --- */
body.mvj-theme .hp-listing__favorite,
body.mvj-theme .hp-favorite,
body.mvj-theme [class*="favorite"] a,
body.mvj-theme [class*="favorite"] button {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .85);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: none;
	border: none;
}

body.mvj-theme .hp-listing__image,
body.mvj-theme .hp-listing__images {
	position: relative;
}

/* --- Reviews (HivePress Reviews) --- */
body.mvj-theme .hp-rating,
body.mvj-theme .hp-review__rating {
	color: #F5A623;
}

body.mvj-theme .hp-reviews,
body.mvj-theme .hp-review {
	border-radius: var(--mvj-radius-md);
	background: var(--mvj-surface);
	padding: 16px;
	box-shadow: var(--mvj-shadow);
	margin-bottom: 12px;
}

/* --- Formularios de búsqueda / filtros nativos de HivePress --- */
body.mvj-theme .hp-form,
body.mvj-theme .hp-search-form,
body.mvj-theme .hp-block--listings-search {
	background: var(--mvj-glass);
	-webkit-backdrop-filter: blur(var(--mvj-blur));
	backdrop-filter: blur(var(--mvj-blur));
	border: 1px solid var(--mvj-border);
	border-radius: var(--mvj-radius-lg);
	padding: 20px;
}

body.mvj-theme .hp-form__field input,
body.mvj-theme .hp-form__field select,
body.mvj-theme .hp-form__field textarea {
	border-radius: var(--mvj-radius-sm);
	border: 1px solid var(--mvj-border);
	background: var(--mvj-surface);
}

/* Sidebar/panel de filtros del listado */
body.mvj-theme .hp-listings__sidebar,
body.mvj-theme .hp-block--listings-filter {
	background: var(--mvj-glass);
	-webkit-backdrop-filter: blur(var(--mvj-blur));
	backdrop-filter: blur(var(--mvj-blur));
	border-radius: var(--mvj-radius-lg);
	padding: 20px;
	border: 1px solid var(--mvj-border);
}

/* --- Botones nativos de HivePress heredan el estilo de Mi Viaje --- */
body.mvj-theme .hp-form button,
body.mvj-theme .button.hp-button,
body.mvj-theme .hp-listing__action .button {
	background: var(--mvj-primary);
	color: #fff;
	border: none;
	border-radius: var(--mvj-radius-pill);
	padding: 12px 22px;
	font-weight: 600;
	cursor: pointer;
	transition: transform var(--mvj-transition-fast);
}

body.mvj-theme .hp-form button:hover,
body.mvj-theme .button.hp-button:hover {
	transform: translateY(-1px);
}

/* --- Página individual de experiencia --- */
body.mvj-theme .hp-listing-view,
body.mvj-theme .hivepress-listing-view {
	display: grid;
	gap: 32px;
}

body.mvj-theme .hp-listing-view .hp-listing__images img,
body.mvj-theme .hivepress-listing-view .hp-gallery img {
	border-radius: var(--mvj-radius-lg);
	object-fit: cover;
}

/* --- Layout de 2 columnas de la página de experiencia ---
   Generado por JS (ver mvj-ui.js → initListingSidebar()) sobre la clase
   real detectada en el sitio: .hp-listing--view-page. El contenido
   original de HivePress queda intacto dentro de .mvj-listing-main; la
   columna de precio/fecha/personas es la única pieza nueva. */
body.mvj-theme .hp-listing--view-page.mvj-listing-grid {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 40px;
	align-items: start;
}

body.mvj-theme .mvj-listing-main {
	min-width: 0;
}

body.mvj-theme .mvj-listing-sidebar {
	position: sticky;
	top: 100px;
}

body.mvj-theme .mvj-listing-sidebar__box {
	background: var(--mvj-surface);
	border: 1px solid var(--mvj-border);
	border-radius: var(--mvj-radius-lg);
	padding: 24px;
	box-shadow: var(--mvj-shadow);
}

body.mvj-theme .mvj-listing-sidebar__price-label {
	font-size: .8rem;
	color: var(--mvj-text-secondary);
	margin: 0;
}

body.mvj-theme .mvj-listing-sidebar__price {
	font-size: 1.6rem;
	font-weight: 700;
	margin: 2px 0 12px;
}

/* Campos "Fecha"/"Personas": se muestran deshabilitados a propósito
   (cursor not-allowed, colores apagados) porque todavía no hay un sistema
   de reservas real detrás — evita aparentar una función que no existe. */
body.mvj-theme .mvj-listing-sidebar__field {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border: 1px solid var(--mvj-border);
	border-radius: var(--mvj-radius-sm);
	padding: 12px 14px;
	margin-top: 10px;
	cursor: not-allowed;
}

body.mvj-theme .mvj-listing-sidebar__field-label {
	font-size: .85rem;
	font-weight: 600;
	color: var(--mvj-text);
}

body.mvj-theme .mvj-listing-sidebar__field-value {
	font-size: .8rem;
	color: var(--mvj-text-secondary);
	font-style: italic;
}

body.mvj-theme .mvj-listing-sidebar__note {
	font-size: .78rem;
	color: var(--mvj-text-secondary);
	margin: 14px 0;
}

body.mvj-theme .mvj-listing-sidebar__contact {
	display: flex;
	width: 100%;
	justify-content: center;
	margin-top: 4px;
}

/* --- Mapa (HivePress Geolocation) --- */
body.mvj-theme .hp-map,
body.mvj-theme .hp-listing__map {
	border-radius: var(--mvj-radius-lg);
	overflow: hidden;
	box-shadow: var(--mvj-shadow);
}

/* --- Enlace a Better Messages ("Contactar al anfitrión") --- */
body.mvj-theme .hp-listing__vendor a.button,
body.mvj-theme a[href*="messages"].button,
body.mvj-theme .better-messages-contact-button {
	background: var(--mvj-primary);
	color: #fff;
	border-radius: var(--mvj-radius-pill);
	padding: 12px 22px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	border: none;
}

/* --- Skeleton loaders sobre el grid de HivePress mientras carga --- */
body.mvj-theme .hp-listings.mvj-is-loading .hp-listing,
body.mvj-theme .hp-listing__list.mvj-is-loading .hp-listing {
	visibility: hidden;
}