/* Mapa de alojamientos. */

.av-map {
  position: relative;
  width: 100%;
}

/* Estos dos los ocultaba también el plugin antiguo */
.av-map .map-bar span {
  display: none;
}

.av-map #button-fullscreen-map {
  display: none;
}

/* --- La tarjeta del marcador --------------------------------------------- */

/*
 * widgetmap.css dimensiona la tarjeta en rem dando por hecho una raíz de 10px, que
 * es la que usa el propio online booking.
 */

.av-map .custom-marker2 .name {
  /* Tipografía del sitio. widgetmap.css pide 'Playfair Display', que no está
     cargada, y el navegador cae al serif del sistema. El fallback cubre el caso
     de que el tema no sea de Elementor o no tenga tipografía global. */
  font-family: var( --e-global-typography-primary-font-family, inherit );
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: #3b3e45;
  padding-bottom: 4px;

  /* El nombre lo escribe el propietario y puede ser largo: la tarjeta mide
     300 px fijos, así que se corta a dos líneas en lugar de empujar el precio
     fuera del popup. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.av-map .custom-marker2 .type {
  font-family: var( --e-global-typography-text-font-family, inherit );
  font-size: 13px;
  font-weight: 400;
}

.av-map .custom-marker2 .map-cabecera .icon-map-localization {
  font-size: 13px;
}

/* Fondo blanco, como el resto de tarjetas del buscador. El gris azulado de
   bg-marker2 solo lo lleva el mapa. */
.av-map .custom-marker2.bg-marker2 {
  background-color: #fff;
  border-bottom: 0;
}

.av-map .custom-marker2 .map-cabecera {
  padding: 10px 12px 6px;
}

/* Los tres labels del precio (desde / importe / por noche) son display:block
   con line-height: 1.7rem = 27 px aquí. Sin esto el bloque de precio crece de
   más y descuadra la fila del botón. */
.av-map .custom-marker2 label {
  line-height: 1.35;
}

.av-map .text_desde {
  font-family: var( --e-global-typography-text-font-family, inherit );
  font-size: 10px !important;
}

.av-map .precio_result,
.av-map .custom-marker2 .precio_result,
.av-map .custom-marker2 .precioOf {
  font-family: var( --e-global-typography-text-font-family, inherit );
  font-size: 20px !important;
}

.av-map .custom-marker2 .noDisp {
  font-size: 15px !important;
}

.av-map .res_post {
  font-size: 12px !important;
}

.av-map .contendor_boton_results a {
  font-family: var( --e-global-typography-text-font-family, inherit );
  font-size: 14px;
  text-decoration: none;
}

.av-map .contendor_boton_results a:hover {
  text-decoration: underline;
}

/* Solo se pintan si el canal tiene valoraciones, pero heredan el mismo
   problema: 2rem = 32 px de estrella. */
.av-map .estrellas i,
.av-map .estrellas .fa {
  font-size: 16px;
}

/* --- Personas y dormitorios, dentro de la foto --------------------------- */

/*
 * widgetmap.css ya las coloca en absoluto sobre .fotografiaR; aquí solo se fija el
 * tamaño (heredaba el del contenedor) y la tipografía del sitio, para que no se
 * salgan de la esquina de la imagen al cambiar el tema.
 */
.av-map .custom-marker .info_alojamiento {
  top: 12px;
  right: 12px;
  z-index: 400;
}

.av-map .info_alojamiento span {
  font-family: var( --e-global-typography-text-font-family, inherit );
  font-size: 12px;
  line-height: 1.6;
  white-space: nowrap;
}

/* --- Popup de varios alojamientos en el mismo punto ---------------------- */

.av-map #multiHouseContainer .multihouse-marker-right .info_alojamiento {
  display: flex;
  flex-direction: column;
  position: relative;
  right: unset;
  top: unset;
}

.av-map #multiHouseContainer .multihouse-marker-right .info_alojamiento span {
  margin-bottom: 2px;
  font-size: 12px;
}

.av-map #multiHouseContainer .multihouse-marker-right .info_alojamiento span i {
  vertical-align: initial !important;
  margin-right: 2px !important;
}

.av-map #multiHouseContainer .multihouse-marker-right .info_alojamiento span .icon:before {
  font-size: 12px !important;
  margin: 0 !important;
  width: auto !important;
}

.av-map #multiHouseContainer .multihouse-marker-right .map-cabecera > span.name {
  font-family: var( --e-global-typography-primary-font-family, inherit );
  font-size: 13px;
}

/* La localidad es el mismo caso que el nombre: widgetmap.css la pide en
   "Open Sans", que tampoco está cargada, y el navegador cae a su serif por
   defecto. Va en el div, no en el span: dentro vienen los .tagSubCabecera que
   escribe el CRS y heredan de él. */
.av-map #multiHouseContainer .multihouse-marker-right .map-cabecera > div:first-of-type {
  font-family: var( --e-global-typography-text-font-family, inherit );
}

/* --- Marcador del editor ------------------------------------------------- */

.av-map--marcador {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px dashed currentColor;
  opacity: 0.55;
  text-align: center;
}

.av-map__icono {
  font-size: 40px;
  line-height: 1;
}

.av-map__texto {
  max-width: 32ch;
  font-size: 14px;
  line-height: 1.4;
}