/* HotVal — Ficha de anuncio (single). Todo con clases/IDs; sin CSS incrustado. */

.ficha { position: relative; --ficha-gap: 72px; overflow-x: hidden; }
.ficha__inner {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 var(--hv-gutter) 60px;
}

/* Separación vertical uniforme entre secciones (para que "respiren"). */
.ficha__inner > section { margin-top: var(--ficha-gap); }
/* Que las anclas del menú no queden ocultas bajo la cabecera. */
#galeria, #info, #tarifas, #mapa { scroll-margin-top: 130px; }
@media (max-width: 980px) { #galeria, #info, #tarifas, #mapa { scroll-margin-top: 104px; } }
.ficha__inner > .ficha-galeria { margin-top: 16px; }  /* pegada al título */

.ficha .ficha-h2 {
  font-size: 22px; color: var(--hv-heading);
  text-align: center; margin: 0 0 22px;
}

/* Títulos de sección con "pill" (borde redondeado) y línea horizontal a todo
   el ancho del dispositivo por detrás: Experiencias, Atención, Sobre mí, Mis tarifas. */
.ficha-tax .ficha-h2,
.ficha-sobremi .ficha-h2,
.ficha-tarifas .ficha-h2 {
  position: relative; /* sin z-index: no crea contexto, el ::before queda detrás */
  display: table; margin: 0 auto 24px;
  padding: 10px 28px;
  border: 3px solid #555; border-radius: 999px;
  background: var(--hv-bg, #000);
}
.ficha-tax .ficha-h2::before,
.ficha-sobremi .ficha-h2::before,
.ficha-tarifas .ficha-h2::before {
  content: ""; position: absolute; z-index: -1;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 100vw; height: 3px; background: #555;
}

/* ===== Barra de acciones ===== */
/* Barra negra; dos bandas grises (~20% del ancho) ancladas a los bordes
   izquierdo y derecho. El bloque central de iconos va encima y en negro. */
/* Dos "bandas" laterales SOLO con borde (sin relleno), visibles tanto en móvil
   como en escritorio; el bloque de iconos va centrado encima, en negro. */
.ficha-acciones { background: #000; position: sticky; top: 0; z-index: 20; overflow: hidden; }
.ficha-acciones::before,
.ficha-acciones::after {
  content: ""; position: absolute; top: 8px; bottom: 8px;
  width: clamp(48px, 20vw, 150px);
  background: transparent; border: 2px solid #444; box-sizing: border-box; z-index: 0;
}
.ficha-acciones::before { left: 0; }
.ficha-acciones::after  { right: 0; }
.ficha-acciones__list {
  list-style: none; margin: 0 auto; padding: 0; width: max-content; max-width: 66vw; background: #000;
  display: flex; justify-content: center; flex-wrap: nowrap; position: relative; z-index: 1;
}
.ficha-acciones__list li { flex: 0 0 auto; }
.ficha-accion {
  width: 100%; background: none; border: 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 10px; color: #ddd; font-family: var(--hv-font); font-size: 12px;
  text-decoration: none; transition: color .2s ease, background .2s ease;
}
/* Iconos al doble de tamaño (antes 22px) y sin texto. */
.ficha-accion svg { width: 44px; height: 44px; }
.ficha-accion:hover { color: #fff; background: rgba(255,255,255,.06); }
.ficha-accion--llamar { color: #37d067; }
.ficha-accion--whats  { color: #25d366; }
.ficha-accion--fav.is-active { color: var(--hv-accent); }

/* ===== Título ===== */
.ficha-titulo {
  display: flex; align-items: center; gap: 14px;
  justify-content: center; text-align: left;
  padding: 26px 0 10px; flex-wrap: wrap;
}
.ficha-titulo__flag img { width: 46px; height: auto; border-radius: 3px; display: block; }
.ficha-titulo__h1 { margin: 0; font-size: 26px; display: flex; flex-direction: column; }
.ficha-titulo__nombre { color: var(--hv-heading); }
.ficha-titulo__tel { color: var(--hv-accent); font-size: 22px; font-weight: 700; }
.ficha-titulo__tel-n + .ficha-titulo__tel-n { margin-left: 10px; }

/* ===== Galería ===== */
.ficha-galeria { margin: 10px 0 20px; }
.ficha-galeria__fotos { display: flex; flex-direction: column; gap: 16px; align-items: center; }
.ficha-galeria__foto { display: block; line-height: 0; width: 100%; cursor: zoom-in; }
.ficha-galeria__img { width: 100%; height: auto; display: block; border-radius: 4px; }
.ficha-galeria__videos { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.ficha-galeria__video { width: 100%; display: block; background: #000; border-radius: 4px; }

/* ===== Lightbox de la galería ===== */
.hv-lightbox {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.92);
  display: none; align-items: center; justify-content: center;
}
.hv-lightbox.is-open { display: flex; }
.hv-lightbox__img {
  max-width: 92vw; max-height: 86vh; width: auto; height: auto;
  object-fit: contain; border-radius: 4px; user-select: none;
}
.hv-lightbox__counter {
  position: absolute; top: 16px; left: 20px;
  color: #fff; font-size: 16px; font-weight: 700; letter-spacing: 1px;
}
.hv-lightbox__caption {
  position: absolute; bottom: 18px; left: 0; right: 0; text-align: center;
  color: #ddd; font-size: 14px; font-style: italic;
}
.hv-lightbox__btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 52px; height: 52px; border: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255,255,255,.12); color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s ease;
}
.hv-lightbox__btn:hover { background: rgba(255,255,255,.28); }
.hv-lightbox__btn svg { width: 26px; height: 26px; }
.hv-lightbox__prev { left: 18px; }
.hv-lightbox__next { right: 18px; }
.hv-lightbox__close {
  top: 14px; right: 18px; transform: none; width: 44px; height: 44px;
}
.hv-lightbox__close svg { width: 22px; height: 22px; }
@media (max-width: 640px) {
  .hv-lightbox__btn { width: 42px; height: 42px; }
  .hv-lightbox__prev { left: 8px; }
  .hv-lightbox__next { right: 8px; }

  /* Fotos a ancho completo en móvil (rompen el padding lateral del contenedor). */
  .ficha__inner > .ficha-galeria {
    margin-left: calc(-1 * var(--hv-gutter));
    margin-right: calc(-1 * var(--hv-gutter));
  }
  .ficha-galeria__img,
  .ficha-galeria__video { border-radius: 0; }
}

/* ===== Ancho completo (rompe el contenedor de 720px) ===== */
.ficha-fullbleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.ficha-fullbleed__in {
  max-width: 1000px; margin: 0 auto; padding: 34px var(--hv-gutter);
}

/* ===== Presentación (bloque BLANCO, texto oscuro) ===== */
/* Título de la presentación: fuera de la franja blanca, alineado a la
   derecha, con un borde fino gris por encima. */
.ficha-presentacion-titulo .ficha-fullbleed__in { padding-top: 0; padding-bottom: 0; }
.ficha-presentacion-titulo .ficha-h2 {
  text-align: left; margin: 0; padding: 50px 0 0;
  border-top: 1px solid #555; color: var(--hv-heading);
}

.ficha-presentacion { background: #fff; }
/* Reduce el margen superior de la franja blanca (gana al .ficha__inner > section). */
.ficha__inner > .ficha-presentacion { margin-top: 15px; }
.ficha-presentacion .ficha-h2 { color: #111; }
.ficha-presentacion__texto { color: #222; font-size: 19px; line-height: 1.6; }
.ficha-presentacion__texto p { margin: 0 0 1em; }

/* ===== Teléfono (bloque, pegado a la descripción) ===== */
.ficha-telefono { background: #660000; }
/* Pegado a la descripción (gana al margin-top de .ficha__inner > section). */
.ficha__inner > .ficha-telefono { margin-top: 0; }
.ficha-telefono__tel {
  font-size: 24px; font-weight: 700; color: #fff; margin: 0;
  -webkit-user-select: none; user-select: none;
}
.ficha-telefono__horario { font-size: 18px; font-weight: 700; color: #fff; margin: 6px 0 0; }

/* Aviso tras la franja roja (fondo de la ficha): subtítulo + título. */
.ficha-aviso .ficha-fullbleed__in { padding-top: 26px; padding-bottom: 26px; }
.ficha-aviso__sub { margin: 0; color: var(--hv-muted, #888); font-size: 15px; }
.ficha-aviso__txt { margin: 4px 0 0; color: var(--hv-heading, #ddd); font-size: 16px; line-height: 1.3; }

/* ===== Pills de taxonomías ===== */
.ficha-pills {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.ficha-pill {
  display: inline-block; background: #d9d9d9; color: #111;
  border-radius: 5px; padding: 5px 12px; font-size: 16px; font-weight: 700;
  text-decoration: none; transition: background .2s ease, color .2s ease;
}
.ficha-pill:hover { background: #fff; }

/* Ancho común de los bloques de datos (Sobre mí / Mis tarifas / Disponibilidad).
   A ancho completo, sin centrar, y con líneas divisorias más marcadas. */
:root {
  --ficha-datos-w: 100%;
  --ficha-line: rgba(255,255,255,.22);
}

/* ===== Datos (Sobre mí / Disponibilidad) ===== */
.ficha-datos { list-style: none; margin: 0; padding: 0; max-width: var(--ficha-datos-w); }
.ficha-datos li { padding: 8px 0; border-bottom: 1px solid var(--ficha-line); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ficha-datos__k { color: var(--hv-muted); }
.ficha-datos__v { color: var(--hv-heading); font-weight: 700; }
.ficha-idiomas, .ficha-tarjetas { display: inline-flex; gap: 8px; align-items: center; }
.ficha-idiomas__flag { border-radius: 2px; display: block; }
.ficha-tarjetas__ico { display: block; background: #fff; border-radius: 3px; padding: 2px; }
.ficha-estado--on  { color: #37d067; }
.ficha-estado--off { color: var(--hv-muted); }

/* ===== Tarifas ===== */
.ficha-tarifas { width: 100%; max-width: var(--ficha-datos-w); margin: 40px 0 0; }
.ficha-tarifas__desde { text-align: center; }
.ficha-tarifas__desde-txt { display: block; color: var(--hv-muted); font-size: 16px; }
.ficha-tarifas__desde-precio { font-size: 40px; font-weight: 700; color: var(--hv-heading); }
/* La lista de tarifas se ajusta al ancho del contador (4×70 + 3×14 = 322px). */
.ficha-tarifas__list { list-style: none; margin: 0 auto; padding: 0; max-width: 322px; }
.ficha-tarifa {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 6px; border-bottom: 1px solid var(--ficha-line);
}
.ficha-tarifa__time { color: var(--hv-text); font-size: 26px; font-weight: 700; }
.ficha-tarifa__time small, .ficha-tarifa__precio small, .ficha-tarifa__new small, .ficha-tarifa__old small { font-size: 13px; font-weight: 400; margin-left: 2px; }
.ficha-tarifa__precio, .ficha-tarifa__new { font-size: 26px; font-weight: 700; color: var(--hv-heading); }
.ficha-tarifa__old {
  color: var(--hv-muted); text-decoration: line-through; font-size: 18px; font-weight: 700;
}
.ficha-tarifa--oferta .ficha-tarifa__new { color: #37d067; }

/* Oferta / cuenta atrás */
.ficha-oferta { margin-top: 22px; text-align: center; }
.ficha-oferta__tit { color: var(--hv-heading); font-size: 18px; margin-bottom: 10px; }
.ficha-countdown { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; }
/* Círculos: el fondo lleva el color de la oferta (rojo/verde, vía currentColor
   heredado del contenedor), borde #333 y texto/números en negro. */
.ficha-countdown__unit {
  flex: 0 0 auto;
  width: 70px; height: 70px; border-radius: 50%; box-sizing: border-box;
  border: 3px solid #333333; background: currentColor;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.ficha-countdown__num { display: block; font-size: 24px; font-weight: 700; line-height: 1; color: #000; }
.ficha-countdown__lbl { display: block; font-size: 11px; color: #000; margin-top: 3px; text-transform: uppercase; }
@media (max-width: 420px) {
  .ficha-countdown { gap: 10px; }
  .ficha-countdown__unit { width: 62px; height: 62px; }
  .ficha-countdown__num { font-size: 21px; }
}
/* Caja de aviso de la oferta: solo contorno de 4px (#660000), sin relleno. */
.ficha-oferta__aviso {
  margin-top: 15px; background: transparent; color: var(--hv-heading, #ddd); text-align: center;
  border: 4px solid #660000; border-radius: 10px; padding: 14px; font-size: 15px;
}

/* ===== Mapa ===== */
.ficha-mapa { margin-top: 40px; }
/* Sin marco gris ni padding: el mapa va a 100% (edge to edge). */
.ficha-mapa__globo { background: transparent; padding: 0; border-radius: 0; }
.ficha-mapa__dir { color: #ccc; font-size: 18px; text-align: center; padding: 12px var(--hv-gutter); margin: 0; letter-spacing: -.5px; }
.ficha-mapa__img { display: block; width: 100%; height: auto; }
/* Mini-mapa Leaflet de la ficha (a todo el ancho, sin bordes redondeados). */
.ficha-mapa__leaflet { width: 100%; height: 380px; border-radius: 0; overflow: hidden; z-index: 0; }
.ficha-mapa__leaflet .leaflet-control-attribution { font-size: 10px; }
/* Pin rojo del mapa de la ficha. */
.ficha-map-pin span {
  display: block; width: 20px; height: 20px; margin: 0 auto;
  background: var(--hv-strong, #e12d1c); border: 2px solid #fff; border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg); box-shadow: 0 2px 6px rgba(0,0,0,.5);
}
.ficha-mapa__ruta {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: fit-content; max-width: 100%; margin: 16px auto; padding: 12px 28px; border-radius: 6px;
  background: #37b24d; color: #fff; font-weight: 700; text-decoration: none;
  box-sizing: border-box; transition: background .2s ease;
}
.ficha-mapa__ruta:hover { background: #2f9e44; }

/* ===== Pie de acciones ===== */
.ficha-pie { margin-top: 46px; text-align: center; }
/* Fila "¿Has visto algún error…?" + botón blanco "reportar error". */
.ficha-pie__summary {
  cursor: pointer; list-style: none;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 16px;
}
.ficha-pie__summary::-webkit-details-marker { display: none; }
.ficha-pie__pregunta { color: var(--hv-heading); font-size: 18px; }
.ficha-pie__btn {
  background: #fff; color: #111; font-weight: 700; font-size: 18px;
  padding: 14px 26px; border-radius: 8px; white-space: nowrap;
  transition: opacity .2s ease;
}
.ficha-pie__summary:hover .ficha-pie__btn { opacity: .85; }
.ficha-pie__form { padding: 16px 0; text-align: left; }

/* Botones de acción (denunciar / ver otras): oscuros, borde fino, redondeados. */
.ficha-pie__links { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 24px; }
.ficha-pie__link {
  flex: 1 1 280px; max-width: 320px;
  color: #fff; text-decoration: none; font-weight: 700; font-size: 18px; text-align: center;
  background: #000; border: 1px solid #777; border-radius: 8px; padding: 16px 18px;
  transition: border-color .2s ease, background .2s ease;
}
.ficha-pie__link:hover { border-color: #fff; background: #1a1a1a; }

/* Caja roja de aviso de abuso. */
.ficha-pie__aviso {
  margin: 28px 0 0; text-align: left; line-height: 1.6;
  color: #fff; background: #4b0000; border: 2px solid #c00000;
  border-radius: 8px; padding: 20px 24px; font-size: 16px;
}

/* ===== Comentarios (wpDiscuz aporta sus propios estilos) ===== */
.ficha-comentarios { text-align: left; }
.ficha-comentarios .ficha-h2 { text-align: center; }
/* Card de comentarios: sin fondo, con borde redondeado y padding. */
.ficha-comentarios #comments,
.ficha-comentarios .comments-area { background: transparent; }
.ficha-comentarios #wpdcom {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 12px;
  padding: 40px;
}
@media (max-width: 640px) { .ficha-comentarios #wpdcom { padding: 24px; } }

/* ===== Menú de navegación de la ficha (FOTOS/INFO/TARIFA/MAPA/CERRAR) ===== */
/* Escritorio: barra vertical fija en el lateral derecho. */
.ficha-menu {
  position: fixed; z-index: 40; right: 0; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column;
  background: #1b1b1b; border: 1px solid rgba(255,255,255,.08); border-right: 0;
  border-radius: 10px 0 0 10px; box-shadow: -4px 0 18px rgba(0,0,0,.35);
  padding: 6px 4px;
}
.ficha-menu__item {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 9px 12px; min-width: 66px; text-decoration: none;
  color: #fff; transition: background .18s ease;
}
.ficha-menu__item + .ficha-menu__item { border-top: 1px solid rgba(255,255,255,.07); }
.ficha-menu__item:hover { background: rgba(255,255,255,.06); }
.ficha-menu__ico { color: var(--hv-strong, #e12d1c); display: inline-flex; }
.ficha-menu__ico svg { display: block; }
.ficha-menu__txt {
  font-size: 10px; font-weight: 700; font-style: italic; letter-spacing: .04em;
  text-transform: uppercase; color: #fff;
}
.ficha-menu__item--close .ficha-menu__ico { color: var(--hv-strong, #e12d1c); }

/* Móvil: barra horizontal fija abajo. */
@media (max-width: 640px) {
  .ficha-menu {
    top: auto; bottom: 0; right: 0; left: 0; transform: none;
    flex-direction: row; justify-content: space-around;
    border-radius: 0; border: 0; border-top: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 -4px 18px rgba(0,0,0,.4); padding: 4px 0;
  }
  .ficha-menu__item { flex: 1; min-width: 0; padding: 8px 4px; gap: 2px; }
  .ficha-menu__item + .ficha-menu__item { border-top: 0; }
  .ficha-menu__ico svg { width: 22px; height: 22px; }
  .ficha-menu__txt { font-size: 9px; }
  /* Deja hueco al final para que la barra no tape el contenido. */
  .ficha__inner { padding-bottom: 92px; }
}

/* ===== Ficha de casa: loop de chicas a 3 columnas y más ancho ===== */
.ficha--casa .ficha-casa-anuncios {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
.ficha--casa .ficha-casa-anuncios .anuncios-wrap {
  max-width: 1180px; margin: 0 auto; padding: 0 var(--hv-gutter);
}
.ficha--casa .ficha-casa-anuncios .anuncios-loop {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 900px) {
  .ficha--casa .ficha-casa-anuncios .anuncios-loop { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .ficha--casa .ficha-casa-anuncios .anuncios-loop { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}

/* ===== Volver arriba ===== */
.ficha-arriba {
  position: fixed; right: 18px; bottom: 18px; z-index: 30;
  border: 0; background: none; padding: 0; cursor: pointer;
  color: #fff; display: none; align-items: center; justify-content: center;
  transition: opacity .2s ease;
}
.ficha-arriba.is-visible { display: flex; }
.ficha-arriba:hover { opacity: .75; }
.ficha-arriba svg { width: 46px; height: 46px; display: block; }

@media (max-width: 640px) {
  .ficha .ficha-h2 { font-size: 20px; }
  .ficha-titulo__h1 { font-size: 22px; }
  .ficha-titulo__tel { font-size: 20px; }
  .ficha-accion span { font-size: 11px; }
  /* En móvil, los títulos-pill (Experiencias/Atención/Sobre mí/Tarifas) y las
     pills de servicios más pequeños (se veían demasiado grandes). */
  .ficha-tax .ficha-h2,
  .ficha-sobremi .ficha-h2,
  .ficha-tarifas .ficha-h2 { font-size: 15px; padding: 7px 18px; margin-bottom: 18px; border-width: 2px; }
  .ficha-pill { font-size: 13px; padding: 4px 10px; }
  /* Sube el botón "arriba" por encima de la barra inferior. */
  .ficha-arriba { bottom: 84px; }
  /* La burbuja de comentarios (wpDiscuz) se solapa con el menú inferior:
     la subimos por encima de la barra. */
  #wpd-bubble-wrapper { bottom: 90px !important; }
}
