/*
 Theme Name:   Twenty Twenty-Five Child
 Template:     twentytwentyfive
 Version:      1.0
 Description:  Tema hijo personalizado para proyecto de alojamientos turísticos
 Author:       Mr. Mapache
*/

@import url("../twentytwentyfive/style.css");

*{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing:antialiased; 
}

:root{
  /*BASE COLOR THEME*/
  --primary:#243e35;
  --green:#3F5B51;
  --ligth:#368265;
  --link:#CFD9CF;
  --linkhov:#FF9800;
  --gost:#1e1eff04;
  --ghost:#9e9e9e08;
}

body{background-color: #f6f6f1;}
.wp-block-group {padding: 0;}
body > header{position: relative;z-index: 11111;}
body > header > div > div > div{justify-content: space-between;}
ul{ list-style:none;padding:0; margin: 0;}
p{margin-top: 0;}

/*Single ALojamiento*/
.alojamiento-thumbnail img {
    width: 100%;
    max-width: 800px;
    height: auto;
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    margin-bottom: 1rem;
}

.entry-content h3, .entry-content h4 {
    margin-top: 2rem;
    color: #333;
    border-bottom: 2px solid #ccc;
    padding-bottom: 0.5rem;
}

.entry-content ul {
    list-style: none;
    padding: 0;
}

.entry-content ul li {
    padding: 0.3rem 0;
    font-size: 1rem;
}

.entry-content a {
    color: #2271b1;
    text-decoration: none;
}
.entry-content a:hover {
    text-decoration: underline;
}


/*ESTRELLAS*/
.estrellas, 
.estrellas .ph-star-half {
    color: gold;
    font-size: 1.1rem;
    vertical-align: top;
    display: inline-block;
}
.estrellas .ph-star-half{vertical-align: baseline;}
.estrellas .disable{color: #C4C4C4}



/*LOADER ANIMADO*/
.loader-spinner {
  border: 4px solid #eee;
  border-top: 4px solid #369e25;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: girar 1s linear infinite;
  margin: 2rem auto;
}

@keyframes girar {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/*ESTILOS BOTONES*/
.boton-pagina {
  padding: 0.4rem 0.8rem;
  background: #369e25;
  color: white;
  border: none;
  border-radius: 4px;
  margin: 0 0.2rem;
  cursor: pointer;
}
.boton-pagina[disabled] {
  background: #aaa;
  cursor: not-allowed;
}

.notfound-raccoon{ width:258px; margin:0 auto; position:relative;}

.map-raccoon{
  max-width: 200px; width: 100%; position: absolute; top: 0; left: 29px; z-index:1;
}

.head-raccoon{
  max-width: 200px; width: 100%; position: absolute;top: -7px; left: 38px;
  transform-origin: bottom center; /* pivota desde la base de la cabeza */
  animation: nod 2s ease-in-out infinite alternate;
}
.body-raccoon{
  max-width: 200px; width: 100%; height: auto; margin-bottom: 1rem;
}

.cola-raccoon{
  max-width: 200px; width: 100%; position: absolute;top: 0; left: 25px; z-index: -2;
  transform-origin:31% 77%;
  animation: colita 2s ease-in-out infinite alternate;
}
.bag-raccoon{
  max-width: 200px; width: 100%; position: absolute;top: 0; left: 29px; z-index: -3;
  animation: bagui 2s ease-in-out infinite alternate;
}

/* Definición de la animación */
@keyframes nod {
  0%   { transform: rotate(-1deg); }
  50%  { transform: rotate(4deg); /* gira hacia adelante */ }
  100% { transform: rotate(-1deg); }
}
@keyframes colita {
  0%   { transform: rotate(5deg); }
  50%  { transform: rotate(-1deg); /* gira hacia adelante */ }
  100% { transform: rotate(5deg); }
}
@keyframes bagui {
  0%   {top: 2px; left: 29px;}
  50%  {top:0; left: 31px}
  100% {top: 2px; left: 29px;}
}


.pswp__button--arrow .pswp__icn, .pswp__button--arrow--next .pswp__icn{fill:#b2ae8e; }


/*BUSQUEDA*/
.seccion-busqueda{}
.seccion-busqueda h1{
    text-align: center;
    margin: 1.4rem 0 .8rem;
}

/*PAGINADOR*/
.resumesearch{margin:2rem auto .5rem; font-weight:400; font-size: 16px; color: #375E4F; text-align: center;}

.paginacion {
  font-family: 'system-ui', sans-serif;
  color: #325e4c;
  text-align: center;
}

.paginacion button {
  background:transparent;
  border: 1px solid #c3cfd6;
  font-family: 'Roboto';
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  color: #325e4c ;
  font-size: 15px;
  transition: background 0.2s;
}


.paginacion button:hover,
.boton-pagina:hover:not([disabled]) {
  background-color:transparent!important;
  color:#090909 ;
}

.paginador-estilo {
  text-align: center;
  margin-top: 2rem;
}


.paginacion.circle button{
  border-radius: 50%;
  border: none;
  width: 30px;
  height: 30px;
}
.paginacion.circle button.btn-prev.disabled,
.paginacion.circle button.btn-next.disabled{display: none;}
.paginacion.circle button.btn-next, 
.paginacion.circle button.btn-prev{width: auto; background: transparent; padding: 0.5rem; display: inline-flex; align-items: center; gap: 0;}
.paginacion.circle button.btn-next:hover, 
.paginacion.circle button.btn-prev:hover{ background:transparent!important;}
.paginacion.circle button.current{background:var(--green); color: white;box-shadow: 0 0 0px 5px #3f5b5145;}
.paginacion.circle button:hover{ background:#3f5b5145!important; }
.paginacion.circle button.btn-next{padding-left: 0;}
.paginacion.circle button.btn-prev{padding-right: 0;}


.contador-resultados {
  font-size: 1.2rem;
  color: #345e4e;
  margin-bottom: 1rem;
}

.controles-paginador {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.boton-pagina {
  padding: 0.5rem 1rem;
  border: 1px solid #c9d2ce;
  border-radius: 8px;
  background-color: white;
  cursor: pointer;
  font-weight: bold;
  color: #222;
  transition: all 0.2s ease;
}

.boton-pagina[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.boton-pagina:hover:not([disabled]) {
  background-color: #f0f0f0;
}

.pagina-actual {
  font-size: 1.1rem;
  color: #345e4e;
}

.flecha {
  font-weight: bold;
  margin: 0 0.3rem;
}


/*Iconos*/
.ti {
  font-size: 1.5rem;
  color: #333;
  transition: transform 0.2s ease;
}
.ti:hover {
  transform: scale(1.1);
  color: #1e90ff;
}


.customlabel{
    position: absolute;
    right: -3px;
    background: #ffffff;
    color: #347d60;
    font-size: 11px;
    padding: 1px 4px;
    border-radius: 4px;
    top: -3px;
    font-weight: 600;
    z-index: 1;
}
.customlabel.populares{background:#ff6900;color: #fff;}
.customlabel.nuevo{background: #cf2e2e;color: #fff;}

/*PAGE RESULTADOS*/
/* === Estilos de filtros profesionales === */
.barra-superior{display:flex; justify-content:space-between;align-items:center; margin-bottom:1rem;}


.sidebar-filtros label,
.filtro-orden {
  display: block;
  font-weight: 600;
  margin-top: 1.4rem;
  margin-bottom: 0.3rem;
  color: #72777d;
  font-size: 16px;
  font-family: 'Roboto';
}
.filtro-orden{margin-top: 0;}
.orderuix{display: flex ; align-items: center;}
.orderuix label{margin-top: 0; width: 141px; line-height: 1;}



.select-ux,
.sidebar-filtros select,
.sidebar-filtros input[type="number"] {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 1rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  transition: border-color 0.2s;
}

.select-ux,
.sidebar-filtros select:focus,
.sidebar-filtros input[type="number"]:focus {
  outline: none;
  border-color: #375E4F;
}

.select-ux{width: auto;}
.label-ux{font-weight: 600; margin-top: 1.4rem; margin-bottom: 0.3rem; color: #72777d; font-size: 16px; font-family: 'Roboto';}

.amenidades-checkboxes{
  /*max-height: 150px;*/ overflow-y: auto; padding: 0;
}

.grid-zonas{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1.5rem;}

.sidebar-filtros .filtro-tipos label,
.sidebar-filtros .filtro-zonas label,
.amenidades-checkboxes label,
.filtro-checkbox label {
    display: flex !important;
    align-items: center;
    gap: 0.1rem;
    font-size: 1rem;
    cursor: pointer;
    font-weight: 500;
    margin:0 0 .5rem;
}
.amenidades-checkboxes label:hover{color:#378265;}
.filtro-checkbox label{color: #378265; font-size: 14px; font-weight: 600;}

.sidebar-filtros input[type="checkbox"],
.filtro-checkbox input[type="checkbox"],
.amenidades-checkboxes input[type="checkbox"] {
  accent-color: #348364 ;
  width: 20px;
  height: 20px;
}
#filtros-activos{
  margin: 0 0 12px !important; background: white; padding: 12px 14px; color: var(--primary); 
  border-radius: 10px; background: linear-gradient(334deg, #f8f8f5, #f9f9f6); 
  box-shadow: 0px 4px 14px rgba(25, 44, 35, .12); border: 1px solid rgba(255, 255, 255, .5);
}



.sidebar-filtros h3{margin:0 0 -.5em;}

.select-ux,
.sidebar-filtros select,
.sidebar-filtros input[type="number"] {
  background-color:#fdfdfc;
  border: 1px solid #dcdccf;
  color: #3A5249;
  box-shadow: none;
}

.select-ux:focus,
.sidebar-filtros select:focus,
.sidebar-filtros input[type="number"]:focus {
  border-color: #3F5B51;
  background-color: #F1EFE6;
}

.filtro-label {
  display: inline-flex;
  align-items: center;
  background-color: #375E4F;
  color: #fff;
  border-radius: 20px;
  padding: 0.3rem 0.75rem;
  margin: 0.2rem;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.3s ease;
}

.filtro-label:hover {
  background-color: #2c4c42;
}
.filtro-label .remove{opacity: .5; padding: 0 0 0 6px; transition: opacity .3s;}
.filtro-label:hover .remove{opacity:1;}
.clear-btn {
  font-size: 0.9rem;
  padding: 0.3rem 0.3rem;
  cursor: pointer;
  font-weight: 500;
  background-color:transparent;
  color:var(--ligth);
}
.clear-btn:hover{color: #3FB8AF;}


#filtros-activos .filtro-tag {
  display: inline-block;
  background: #e0e0e0;
  padding: 4px 8px;
  margin: 2px;
  border-radius: 4px;
  cursor: default;
}

#filtros-activos .filtro-tag i.close-tag {
  margin-left: 6px;
  cursor: pointer;
}

#filtros-activos .filtro-tag--clear {
  background: #d32f2f;
  color: #fff;
  font-weight: bold;
}
.titlefilter{font-weight: 100;font-size: 16px;opacity: .5;}























/* Hooster — Chips de filtros y botón limpiar */
:root{
  --hx-chip-bg: #f6f7f8;
  --hx-chip-border: #dfe3e8;
  --hx-chip-text: #111827;
  --hx-chip-bg-hover: #eef2ff;
  --hx-accent: #2563eb; /* azul */
  --hx-accent-contrast: #fff;
}

/* Contenedor de chips */
#filtros-activos{
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;
}
#filtros-activos strong{ margin-right:.25rem; font-size:.92rem; color:#374151; }
#filtros-activos .chip .ph-fill{margin-right: -4px; font-size: 17px;}
#filtros-activos .chip{
  display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding:.48rem .55rem .48rem .55rem;
    border-radius: 9999px;
    background: #617767;
    border: 1px solid var(--hx-chip-border);
    color:#dce1de;
    font-size: .85rem;
    line-height: 1;
}
#filtros-activos .chip .remove{
  background: white;
    display: flex;
    place-items: center;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 9999px;
    border: none;
    font-weight: 700;
    cursor: pointer;
    color: #3f5b52;
    justify-content: center;
    transition: all .3s;
}
#filtros-activos .chip .remove:hover{     
  background:transparent;
  color: #fff;
  transform: scale(1.8);}




/* Botón: Quitar todos los filtros */
#btn-limpiar-filtros{
  align-items: center;
    margin-bottom: 0;
    border: none;
    padding: 0.4rem 0.8rem;
  
    align-self: center;
    gap: 4px;

  display:none; /* Lo muestra el JS cuando hay filtros activos */
  appearance:none; -webkit-appearance:none;
  
  background:#E91E63;
  color:#fff;
  box-shadow: 0 0 0 0px rgba(233, 30, 99, .0);
  border-radius: 8px;
  font-size:16px;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease, transform .04s ease, box-shadow .3s;


}
#btn-limpiar-filtros:hover{
  background:#E91E63;
  color:#fff;
  box-shadow: 0 0 0 6px rgba(233, 30, 99, .45);
}
#btn-limpiar-filtros i{font-size: 18px;}
#btn-limpiar-filtros:active{ transform:translateY(1px); }
#btn-limpiar-filtros:focus-visible{
  outline:2px solid var(--hx-accent);
  outline-offset:2px;
}
.amenidades-checkboxes .amenidad-count{
  opacity:.7;
  font-size:.85em;
}








/* Selects verdes unificados (sidebar + barra superior) */
.sidebar-filtros select,
.barra-superior select,
.select-ux{
  width: 100%;
  padding: .45rem .6rem;
  border-radius: .55rem;
  background-color:#fdfdfc;   /* fondo marfil */
  border:1px solid #dcdccf;   /* contorno suave */
  color:#3A5249;
  font-size:.95rem;
  line-height:1.2;
  box-shadow:none;
  transition:border-color .2s, box-shadow .2s, background-color .2s;
}

.sidebar-filtros select:focus,
.barra-superior select:focus,
.select-ux:focus{
  outline:none;
  border-color:#3F5B51;            /* verde */
  background-color:#F1EFE6;        /* tinte verdoso */
  box-shadow:0 0 0 3px rgba(63,91,81,.16); /* anillo suave verde */
}

/* (Opcional) flechita del select más discreta, sin romper accesibilidad */
.barra-superior select,
.sidebar-filtros select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, #3F5B51 50%),
    linear-gradient(135deg, #3F5B51 50%, transparent 50%),
    linear-gradient(to right, transparent, transparent);
  background-position:
    calc(100% - 18px) calc(50% - 4px),
    calc(100% - 12px) calc(50% - 4px),
    calc(100% - 2.2rem) 0.45rem;
  background-size: 6px 6px, 6px 6px, 1px 2rem;
  background-repeat:no-repeat;
  padding-right:2.4rem; /* espacio para la flechita */
}

/* Dark mode coherente con tu paleta */
@media (prefers-color-scheme: dark){
  .sidebar-filtros select,
  .barra-superior select,
  .select-ux{
    background-color:#0b0f16;
    color:#e5e7eb;
    border-color:#374151;
  }
  .sidebar-filtros select:focus,
  .barra-superior select:focus,
  .select-ux:focus{
    border-color:#3F5B51;
    background-color:#1b2220;
    box-shadow:0 0 0 3px rgba(63,91,81,.25);
  }
}














.hoost{position: relative;max-width: 390px;}
.hoost a{text-decoration: none;}
.hoost a:hover{}

.hoost a h3,
.hoost a .price,
.hoost a .zona{transition: all .3s;}

.hoost a:hover h3,
.hoost a:hover .price,
.hoost a:hover .zona{opacity: 1;color: var(--primary);}

.hoost .tipo-alojamiento{
  text-decoration: none; background: var(--primary); border-radius: 8px;
    color: white;
    font-size: 13px;
    display: inline-block;
    padding: 3px 8px;
    font-family: 'Roboto';
    margin: 0 5px 0 0;
    font-weight: 400;}
.hoost img{
    aspect-ratio: 255 / 157;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 8px;
}
.hoost img:after{contain: "";}
.hoost .typehoost{
    position: absolute;
    width: calc(100% - 10px);
    padding: 4px 0 50% 10px;
    background: linear-gradient(180deg, rgba(0, 0, 0, .3), rgba(35, 60, 53, .2), transparent);
    border-radius: 8px 8px 0 0;
  }
.typehoost p{display: inline-block; color: white; font-size: 13px;}
.hoost:hover .typehoost{background: linear-gradient(180deg, rgba(0, 0, 0, .35), rgba(35, 60, 53, .35), transparent);}
.hoost .zona{color:#858585; font-size: 12px;}
.hoost .zona strong{color:#858585;}
.hoost h3{margin: 0; font-family:'Roboto'; font-size: 16px; font-weight: 600; color: #D1844A;}
.hoost .price{font-size: 12px; color: #378265; font-weight: 600;}
.hoost .no-price{font-weight: 400;color:#858585;}
.hoost .zona{overflow: hidden; text-overflow: ellipsis;white-space: nowrap;}


.paginacion{
  display:flex;justify-content:center;align-items:center;gap:.5rem;margin-top:0;
}
.paginacion span{
  font-weight: bold;
  color: #375E4F;
  font-size: 16px;
}


.grid-galeria{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}


.linki{
    color: var(--primary); font-weight: 400; text-decoration: none;
    font-size: 16px;
    position: relative;
    top: -6px;
    display: inline-block;
    line-height: 1;
    -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing:auto; 
}
.underlink{
  border-bottom: 1px solid var(--link); border-bottom: 1.4px solid var(--link);color: #6C887C; font-family: Rubik, sans-serif; font-weight: 400; 
  text-decoration: none; transition: border-bottom .4s, color .4s; font-size: 14px;
    -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
.underlink:hover{border-bottom: 1.4px solid var(--green); color: var(--green);}

.underlinkx{
  position: relative;
    color: #6C887C;
    font-family: Rubik, sans-serif;
    font-weight: 400;
    text-decoration: none;
    transition: border-bottom .4s, color .4s;
    font-size: inherit;
    -webkit-font-smoothing: auto;
}
.underlinkx.line{display: flex;align-items: anchor-center;}
.underlinkx::after{
      background: var(--link);
    height: 2.4px;
    content: "";
    position: absolute;
    width: 100%;
    bottom: -2px;
    right: 0;
    left: 0;
}
.underlinkx:hover{color:#3f5b52; }
.underlinkx:hover::after{}

/*ESTILOS ALOJAMIENTO SINGLE*/
.hospedajeself{}
.hospedajeself .titulo{font-weight: 500;}
.hospedajeself h3{font-size: 18px; color: var(--green); font-weight: 500; margin: 0 0 10px;}
.hospedajeself p{}
.hospedajeself p strong{color:var(--green); }

.item{color: var(--primary);}

.item.hostid{position: relative;}
.item.hostid .js-fav{padding:8px 10px;border:1px solid #e5e7eb;border-radius:10px;right: 10px; top: 10px; position: absolute;}

.hostid .zonelink{font-size: 20px; font-weight: 400; text-decoration: none;}
.logo-zona{float: left; margin-right: 8px;}
.logo-zona img{width:81px;height:81px;border-radius:50%; object-fit: cover;}

.fastinfo{
    background: linear-gradient(198deg, #F8F8F4, #F7F7F3);
    background: rgba(255, 255, 255, .44);
    box-shadow:0px 2px 8px rgba(25, 44, 35, .07);
    border: 1px solid rgba(255, 255, 255, .5);
    padding:14px 16px;
    border-radius: 12px;
    color: #000;
  }
.zonamap{
  background: linear-gradient(198deg, #F8F8F4, #F7F7F3);
  box-shadow:0px 3px 6px rgba(25, 44, 35, .15);
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 12px;
  padding:8px 22px 16px;
  margin: 10px 0 0;
}

.zonaslink{font-size: 18px; margin-bottom: 3px;}
.ubidate{font-size: 14px; margin:0; display: inline-block; color:rgba(0, 0, 0, .6);}
.nodata{opacity: .4;}

.nodata{opacity: .4;}

.booking-btns{
    display: grid;
    grid-template-columns: auto auto;
    gap: 10px;
    border-top: 1px solid rgba(0, 0, 0, .1);
    padding-top: .6em;
}
.booking-btns .airbnb{
    max-width: 160px;
    font-size: 12px;
    font-weight: 500;
    background: #FF385C;
    color: white;
    padding: 10px;
    border-radius: 9px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    gap: 6px;
    transition: color .3s;
}
.booking-btns .airbnb:hover{opacity:.8;}


.amenidax{
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    list-style: none;
    padding: 0;
  }
  .amenidax li{font-size: 16px;}

.noresults{text-align: center;}
.noresults h2{ font-weight:400; margin-bottom:3px; }
.noresults p.disabletxt{ opacity: .5; margin-bottom:0;}
.noresults hr{max-width: 50%; margin: 1em auto; opacity: .3;}
.noresults h4{ font-weight:500; margin-bottom:3px; }
.noresults{}
.noresults{}




.hero-grupo-zona{color: #fff; background:var(--primary); }
.hero-grupo-zona > div{display: grid; grid-template-columns: 0.618fr 0.382fr; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: flex-start; padding: 3rem 2rem 2rem; }
.hero-grupo-zona h1{margin: 0 0 11px;}
.hero-grupo-zona h4{font-size: 20px;margin: 0; font-weight: 300; clear: both;}
.hero-grupo-zona h5{font-size: 16px;margin: 20px 0 0; font-weight: 500;}
.hero-grupo-zona p{opacity: .7;     margin-bottom: 10px;font-size: 14px;}
.hero-grupo-zona a{font-size: 18px;}
.hero-grupo-zona .anfts{width: 243px;}

.hero-grupo-zona .imagen-destacada img{
  width:100%;height:auto;max-height:400px;object-fit:cover;border-radius:8px;aspect-ratio: 3 / 2;
}

.hero-zona{
  padding:3rem 1rem;text-align:center; color: white;    background-size: 150%;
  background-color: var(--primary); background-image: url(/assets/pattern.jpg);
}

.hero-search{
  padding:1rem 1rem; margin-bottom:1em; text-align:center; color: white;    background-size: 150%;
  background-color: var(--primary); background-image: url(/assets/pattern.jpg);
}

.hero-search.homex{background-image: url(/assets/bgherox.jpg); padding: 2em 1em;}
.hero-search.homex h1{margin: 0;}

.hero-search.destiny{}
.hero-search.destiny .wrap-container{padding-bottom: 1.5em}
.hero-search.destiny h1{margin-bottom:0; font-size: 28px;}

.pill{display: none;}

#input-lugares{    width: 100%;
    padding: .75rem 1rem;
    border: 2px solid #ddd;
    border-radius: .75rem;
    position: relative;
    z-index: 11;
    outline:none;
  }
#input-lugares:focus,
#input-lugares:focus-visible,
#input-lugares:focus-within{border-color:  #8BC34A;}

#autocomplete-lugares{position: absolute;
    left: -7px;
    right: -7px;
    top: -7px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-top: none;
    border-radius: .75rem;
    max-height: 420px;
    overflow: auto;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08), 10px -250px 1px 10000000px #00000011;
    z-index: 1;
    padding: 47px 1px 0;
    opacity: 1;
    transition: all .5s;
  }    
  #autocomplete-lugares[hidden] {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .0), 10px -250px 1px 10000000px #00000000;
    opacity: 0;

    visibility: hidden;
    pointer-events: none;
    display: block!important;
}
#autocomplete-lugares::after {
  content: "▼";         /* obligatorio poner algo */
  display: block;       /* lo hace visible */
  color: red;
  font-size: 20px;
  margin-top: 5px;
}

.autolist::after{contain:""; position: absolute; top: -30px; right: 10px; display: block; background: yellow;border-radius: .75rem .75rem 0 0;}

.filterzone{
      margin-right: 1rem;
      margin-bottom:0;
    font-size: 16px;
    color: #858585;
    padding: 10px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}
.filterzone input{accent-color: #348364;width: 18px;height: 18px;display: none;}
.filterzone i{font-size: 24px;}
.filterzone:has(input:checked) {
    color: #fff; color: #f6f6f2;
    background: #728c73; background: #d1844b;
    padding: 10px;
    clip-path: polygon(0 0, 90% 0, 100% 50%, 90% 100%, 0 100%);
}


.lugaresx{
    background: #D1844A;
    background: url(/assets/bgzone.jpg) #D1844A;
    background-size: cover;
    box-shadow: 0px 19px 13px -22px #3d2222 inset;
    padding:.1rem 1rem 1.5em;
    filter: grayscale(27%);
    z-index: 1;
    position: relative;
}
.lugaresx h1{margin-bottom: 5px;}
.autogroup{padding:.25rem .5rem .5rem;}
.autogroup h4{font-size:.8rem;margin:.5rem .5rem 0;color:#777;text-transform:uppercase;letter-spacing:.04em;text-align: left;}
.howtosearch{margin-bottom: 10px;}
.txt{font-size: 16px;}
.txt .t{}
.txt small{font-size: 14px;}
.autoitem{
  display: flex;
  gap: .75rem;
  align-items: center;
  padding: .5rem .75rem;
  cursor: pointer;
  color: var(--primary);
  text-align: left;
  line-height: 1;
}
.autoitem:hover,
.autoitem.active{background:#f8f8f8;}

.grid-alojamientos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem; margin-top:1rem; gap: 1.5rem;}
.grid-alojamientos .thumb,
.grid-zonas .thumb{width:100%;aspect-ratio:16/10;}
.descrizoneti{display: none;}

.grid-destinos {
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}
.card-destino { border:1px solid #eee; border-radius:12px; overflow:hidden; background:#fff; }
.card-destino .thumb img { display:block; width:100%; height:180px; object-fit:cover; }
.card-destino .card-body { padding: .9rem 1rem; }
.pagination .current { background:#111; color:#fff; }
.pagination button[disabled] { opacity:.5; cursor:not-allowed; }

.chip.zonelink{ text-shadow:0 0 3px transparent; transition:all .3s; }
.chip.zonelink:hover{ text-shadow:0 0 3px white;  box-shadow: 0 0 5px rgba(255, 255, 255, .5), 0 0 5px rgba(255, 255, 255, .5) inset; }

.sidebar-ctas{}
.sidebar-ctas h4,
.sectionside h4{color:#ce8246;font-size: 18px; line-height: 1.4; display: block; font-weight: 500; margin: 0; text-align: center;}


.sectionside a,
.sidebar-ctas a{font-size: 16px; margin:5px auto; display: block; text-align: center; width: fit-content;}

.radio-group{border: none;
    border-radius: 16px;
    margin-bottom: 20px;
    padding: 24px;
    background: rgba(255, 255, 255, .45);
    box-shadow: 0 4px 10px rgba(96, 125, 139, .2);}
.radio-group.filter{padding: 18px 24px 38px;}
.sectionside{border-radius: 16px;
    padding: 8px 8px 17px 8px;
    background: rgba(255, 255, 255, .65);
    box-shadow: 0 4px 10px rgba(96, 125, 139, .2);
    border: 1px solid #d9d9d9;
  }
.sectionside .hooster-btn{background-color: #ce8246;}
.sectionside.clean .hooster-btn{background-color: #3f5b52; font-size: 13px;}
.sectionside h4{color: #ce8246;}
.sectionside.clean h4{color: #3f5b52; color:#72777d; font-size: 15px;}
.sectionside.clean{box-shadow: none; background: none; border: none; padding: 8px 38px 17px 18px;}

/*BUSCADOR DESTINOS*/
.destiny{
    background: #D1844A;
    background: url(/assets/bgzone.jpg) #D1844A;
    background-size: cover;
    box-shadow: 0px 19px 13px -22px #3d2222 inset;
    padding: .1rem 1rem;
    filter: grayscale(27%);
}
.zona-info{padding:.75rem!important; background:#fff; border-radius:0 0 8px 8px;    height: max-content;}
.zona-info h3{
    margin:0 0 .1rem;
    font-size:1rem!important;
    font-weight: 600;
    color: #72777d;
    }
.zona-card{text-decoration: none; border-radius: 0 0 8px 8px; height: 100%; overflow: hidden; max-width: 220px; transition: all .3s;}
.zona-card:hover{box-shadow:0 2px 6px rgba(0,0,0,.1);}
.zona-card p, 
.zona-card:hover p{margin:0; font-size:.8rem; color:#858585;}
.zona-card:hover .zona-info{}
.zona-card:hover h3, .zona-card:hover p{transition: all .3s;}
.zona-card.zona:hover h3, .zona-card.zona:hover p{color:#728c73;}
.zona-card.destino:hover h3, .zona-card.destino:hover p{color:#c68655;}
.zona-thumb{width:100%;border-radius:8px 8px 0 0;}
.zona-card:hover .zona-thumb{ filter: contrast(1.1) brightness(.95);}



#resultados-alojamientos{ padding:0 15px; }

#resultados-grid, .resultados-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:2rem;padding-top:.5rem;row-gap: 1.2rem;gap: 1.5rem;
}
#resultados-contador, #contador-grid{font-weight: 400; font-size: 15px; color: #858585;}


#resultados-grid.grid-zonas.zonasydestinos .zona-card{display:grid; grid-template-rows: 110px 1fr;}
#resultados-grid.grid-zonas.zonas .zona-card{display:grid; grid-template-rows: 90px 1fr;}


/*GRID DESTINOS*/
#resultados-grid.grid-zonas.destinos .zona-card{display:grid; grid-template-rows: 152px 1fr; background: white; box-shadow: 0 2px 6px rgba(0, 0, 0, .1); border-radius: 16px 16px 8px 8px;}
#resultados-grid.grid-zonas.destinos .zona-card .zona-thumb{width: auto; border-radius: 18px 18px 0 0; border: 8px solid white; border-bottom: 6px solid white;}
#resultados-grid.grid-zonas.destinos .zona-card .zona-info{padding: 0 .75rem .75rem!important;}
#resultados-grid.grid-zonas.destinos .zona-card .zona-info h3{color: #3f5b53; font-size: .9rem!important; margin: 0!important;}
#resultados-grid.grid-zonas.destinos .zona-card:hover{box-shadow: 0 2px 4px rgba(0, 0, 0, .26); transform: scale(1.04); }
#resultados-grid.grid-zonas.destinos .zona-card:hover .zona-thumb{filter: inherit;}
#resultados-grid..grid-zonas.destinos{overflow:hidden;}

/* DESTINOS LIST*/
#resultados-grid.grid-zonas.destinos.list,
#resultados-grid.grid-zonas.zonasydestinos.list{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
#resultados-grid.grid-zonas.destinos.list .zona-card,
#resultados-grid.grid-zonas.zonasydestinos.list .zona-card{
    grid-template-columns: 92px auto;
    grid-template-rows: none;
    text-decoration: none;
    color: inherit;
    position: relative;
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);}
#resultados-grid.grid-zonas.destinos.list .zona-thumb,
#resultados-grid.grid-zonas.zonasy.list .zona-thumb{
    width: auto;
    border:none;
    aspect-ratio: 1 / 1;
    height: auto;
    padding: 0;
    object-fit: cover;
    border-radius: 8px 0 0 8px;
}
#resultados-grid.grid-zonas.destinos.list .zona-info,
#resultados-grid.grid-zonas.zonasydestinos.list .zona-info{
     padding: .75rem !important; 
}
/*ZONAS LIST*/
#resultados-grid.grid-zonas.zonas.list{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
#resultados-grid.grid-zonas.zonas.list .zona-card{
    grid-template-columns: 60px auto;
    grid-template-rows: none;
    text-decoration: none;
    color: inherit;
    position: relative;
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);}
#resultados-grid.grid-zonas.zonas.list .zona-thumb{
    width: 100%;
    border:none;
    aspect-ratio: 1 / 1;
    height: 100%;
    padding: 0;
    object-fit: cover;
    border-radius: 8px 0 0 8px;
}
#resultados-grid.grid-zonas.zonas.list .zona-info{
     padding: .75rem !important; 
}





.titleradiu{    margin: 4px 0 10px;
    color: #72777d;
    font-size: 16px;
    font-weight: 600;}
.seccionesnav{    margin-bottom: 50px;
    border-left: 3px solid #bdbdbc;
    padding-left: 10px;}
.disabl{filter: saturate(0); opacity:.5;}    




.host-notice{
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--host-gap);
  align-items: center;
  width: 100%;
  max-width: 880px;
  padding: var(--host-pad);
  border-radius: var(--host-radius);
  background: var(--host-bg);
  box-shadow: var(--host-shadow);
  border: 1px solid var(--host-ring);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.host-notice:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
  border-color: rgba(47,91,77,.25);
}

.host-notice__icon{
  inline-size: 56px;
  block-size: 56px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(180deg, #f6f8f7, #eef2f0);
  border: 1px solid var(--host-ring);
}

.icon{
  width: 48px; height: 48px;
  display: block;
}

.nofound-anfi{display: grid; grid-template-columns: auto 1fr; gap: 10px;}
.nofound-anfi h2{margin: 0!important; } 
.nofound-anfi p{opacity: .3!important; font-size: 16px; margin: 0;}

/* Partes del SVG (se recolorean por variante) */
.i-bg{ fill: none; stroke: #e5e9e6; stroke-width:2; }
.i-fill{ fill: #e5e9e6; }
.i-stroke{ fill: none; stroke: #e5e9e6;stroke-width:1.8; stroke-linecap:round; }
.i-slash{ fill:none; stroke: #e5e9e6; stroke-width:2.2; stroke-linecap:round; }
.i-check{ fill:none; stroke: #e5e9e6; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }

.view-switch{    display: flex
;
    gap: .2rem;
    align-items: center;
    align-self: end;
    padding-bottom: 2px;}
.viewbtn{border-radius: .55rem;
  cursor: pointer;
    background-color: transparent;
    border: none;
    font-size: 28px;
    padding: 0;
    margin: 0;
    outline: none;
    line-height: 1;
    color: #dcdccf;}
.viewbtn.active{color: #728c73;}


.minicard .zona-card{
  text-decoration:none;color:inherit;position:relative;background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.06);
  display: grid; grid-template-columns: 92px auto;}
.minicard .zona-thumb{width:100%;aspect-ratio:1/1; height: auto; padding: 0; object-fit: cover;border-radius: 8px 0 0 8px;}



.item.hostid h1{padding: 0; margin: 0 0 -9px; font-size: 40px; font-weight: 500; color: var(--green); line-height: 1.4; }
.item.zona{font-size: 20px; font-weight: 400;color: var(--primary); margin: 0;}
.item.hostid .ftrimg{
    aspect-ratio: 2 / 1.2;
    object-fit: cover;
    object-position: bottom;
    border-radius: 18px;
    width: 100%;
    overflow: hidden;
    height: auto;
}
.item.galeria{font-size: 18px;}

.item.galeria strong, .item.galeria strong ul{font-size: 18px; font-weight: bold;}

.item.amenidades strong, .item.amenidades strong ul{font-size: 18px; font-weight: bold;}
.item.amenidades ul li{font-weight: 400; font-size:16px; }

.mapa a{text-decoration: none;}
.mapa a:hover{text-decoration: underline;}

.item.descripcion, .item.descripcion h3, .item.descripcion p{font-size: 16px; margin: 0;}

.item.descripcion h3{font-weight: bold;}
.item.descripcion > p{font-weight: 400; margin-bottom: 1em;}

.callhoost{display: grid;
    grid-template-columns:auto auto;
    grid-template-columns:0.597fr 0.403fr;
    gap: 10px;}

.btnhoost{
    font-size: 12px;
    font-weight: 500;
    font-family: 'Roboto';
    background: var(--primary);
    color: white;
    padding: 10px;
    border-radius: 9px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    gap: 6px;
    transition: color .3s;
}
.btnhoost:hover{background: #375E4F; color: white;}
.btnhoost:hover svg{fill: white;}



.btn-addhosp{
    color: #6C887C;
    font-family: Rubik, sans-serif;
    font-weight: 400;
    text-decoration: none;
    transition: border-bottom .4s, color .4s;
    font-size: 18px;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    margin: 0 10px;}
.btn-zone{font-size: 16px;font-weight: 600;color: #d1844a;}
.callhoost .callphone{background:#F1EFE6; background:linear-gradient(90deg, #F3F2EB, #F1EFE6);  color: var(--primary);box-shadow: 0px 2px 7px #DBDBD0;}
.callhoost .callphone i{font-style: normal;}
.callhoost .bntwhats{background:var(--primary); background:linear-gradient(90deg, #2C473D, #335347); color: white; box-shadow: 0px 2px 7px rgba(51, 78, 69, .55);}
.callhoost .bntwhats:hover{box-shadow: 0px 2px 7px rgba(51, 78, 69, .85); background: var(--ligth);}
.callhoost .callphone svg{fill:var(--primary); transition: fill .3s;}
.callhoost .bntwhats svg{fill:white;}
.callhoost .callphone:hover{color: var(--ligth);background: #f6f6f1;}
.callhoost .callphone:hover svg{fill: var(--ligth);}


#filtros-activos:empty {
  display: none !important;
}


.anfitriones{
    background: white;
    padding:14px 21px 19px 15PX;
    color: var(--primary);
    border-radius: 10px;
    box-shadow: 0 3px 19px rgba(22, 50, 41, .4);

    background: linear-gradient(334deg, #FBFBF9, #FCFCFB);
    box-shadow: 0px 4px 14px rgba(25, 44, 35, .12);
    border:1px solid rgba(255, 255, 255, .5);
}

.infohosp{font-size: 16px;}
.infohosp a.website{    margin: 0 5px;}
.infohosp a.socialink{
  width: 20px; height: 20px;
  display: inline-block; text-decoration: none; padding: 10px; background: var(--green); border-radius: 50%; color: white;
}
.infohosp a span{font-size: 20px;}

.perfil-anfitrion{max-width: 800px; margin:auto; text-align:center; padding-top: 3rem;}
.perfil-anfitrion h1{margin: 0;}
.alojamientos-relacionados{max-width:1200px;margin:auto;padding:2rem 0;}
.alojamientos-relacionados h2{text-align:center;}


#filtros-alojamientos{padding: 0 15px;}
#precio-min, #precio-max{padding: 0.3rem 0.5rem!important;font-size: .85rem!important;}
#contenedor-lugares h2{margin: 0; font-size: 28px;color: #3f5b52;}
#contenedor-lugares p.counter{margin: .25rem 0 0 0; font-weight: 400; font-size: 15px; color: #858585;}


.anfitriones h2{font-size: 18px; font-weight: 500; margin:0 0 6px; color: var(--green);}
.anfitriones strong{font-size: 14px;}
.anfitriones .linki{}

.anfilist{display: grid; gap:18px;}
.anfilist .verititle{
  font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: 500; display: block; text-decoration: none; letter-spacing: -0.02em; color: var(--primary);
      f
}
.anfilist .verititle:hover{}
.hostprofile{
  
}
.infohost{
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 7px;}
.infohost img{width:44px;height:auto;border-radius:50%;}
.infohost img:hover{opacity: .9;}




.galeria-photoswipe{}
.pswp__img{border-radius: 15px;}
.pswp__img, .pswp img{border-radius: 15px;}
.galeria-photoswipe .grid-galeria a{display: grid;}
.galeria-photoswipe a img{
    width:100%;height:auto;border-radius:5px;
    aspect-ratio: 2 / 1.4;object-fit: cover;
}
.galeria-photoswipe a img:hover{opacity: .8}

.wrap-container{
    max-width: 1200px;
  margin: 0 auto;}







/*SINGLE ALOJAMIENTO RESPONSIVO*/
.grid-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 0.618fr 0.382fr;
  column-gap: 1.6em;
}


/*SLIDER PRECIO*/
.busqueda-wrap .noUi-target{background: #d9d9d9;border-radius: 4px; box-shadow: none; border: none;}
.busqueda-wrap .noUi-connect{background: var(--ligth);}
.busqueda-wrap .noUi-handle{
  border-radius: 15px;
  background: #29614a;
  box-shadow: none;
  border:none;
}
.busqueda-wrap .noUi-tooltip {
    border: none;
    border-radius: 21px;
    background: #378265;
    color: #fff;
    padding: 5px 10px;
    font-size: 12px;
}
.busqueda-wrap .noUi-handle-lower .noUi-tooltip{display: none;}
.busqueda-wrap .noUi-handle.noUi-handle-upper,
.busqueda-wrap .noUi-handle.noUi-handle-lower{  width: 14px;right: -7px;}
.busqueda-wrap .noUi-handle:after, .busqueda-wrap .noUi-handle:before{display: none;}

/*FSE Components*/
.logohoost{gap:2px;}
.logohoost p a{font-weight: 600; position: relative; top: -2px; left: 1px;    letter-spacing: -0.02em;}
.headerhoost{
  flex-wrap: nowrap;justify-content: space-between;
}
.headerhoostx{padding: 0 24px;}

.menuhoostx li a{font-size: 14px;}
.menuhoost{}
.menuhoost .wp-block-navigation-item a{font-size: 16px;}
.menuhospe{transition: color .3s;}
.menuhospe a,
.loginmenu a{color:#3f5b52!important;}
.menuhospe:hover{color:var(--ligth);}

.registratebutton a{
  background: #3f5b52;
    padding: 8px 16px;
    color: white!important;
    border-radius: 3px;
    font-weight: 400;
}
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content{font-size: 16px;}


/*MENU LOGIN*/
.hooster-account { display:flex; gap:10px; align-items:center; }
.hooster-btn {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.65rem .8rem; border-radius:10px; border:none;
  background:#3f5b52; color:#fff; text-decoration:none; font:500 16px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
.hooster-btn--primary { background:#111827; color:#fff; border-color:#111827; }
.hooster-dropdown { position:relative; }
.hooster-account__toggle { cursor:pointer; }
.hooster-dropdown__menu {
  position:absolute; right:0; top:calc(100% + 8px);
  min-width: 230px; background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.08); padding:8px; display:none; z-index:99999;
}
.hooster-dropdown[aria-expanded="true"] .hooster-dropdown__menu { display:block; }
.hooster-dropdown__menu a {
  display:flex; align-items:center; gap:.5rem; padding:8px 10px;
  border-radius:8px; color:#3f5b52; text-decoration:none; font:500 16px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
.hooster-dropdown__menu a:hover {    background:#617767;color: white;}
.hooster-dropdown__divider { height:1px; background:#e5e7eb; margin:6px 0; }
.is-hidden { display:none !important; }
.hooster-dropdown a i{font-size: 22px;}


/*ACCESO / REGISTRO */
.coldos{display: grid;    grid-template-columns: auto 1fr; gap: 20px;}
.linebreak{-webkit-box-align: center !important;
    display: flex !important;
    align-items: center !important;
    margin: 0px !important;
    font-size: 14px;
    white-space: nowrap !important;}
.linebreak::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 1px !important;
    background-color: rgb(221, 221, 221) !important;
    margin-right: 16px !important;
}
.linebreak::after {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 1px !important;
    background-color: rgb(221, 221, 221) !important;
    margin-left: 16px !important;
}    
.linkis{margin-top:12px;display:flex;justify-content:space-between;}
.linkis .underlink{border: none;}
.remembe{display:flex;gap:4px;align-items:center}
.remembe input{accent-color: #617767;width: 18px;height: 18px;}
.remembe span{font-size: 14px;}
#googleBtn, #facebookBtn{margin: 0!important;}
#facebookBtn{margin: 0!important; pointer-events: none; filter: saturate(0.1); opacity: .5;}
#googleBtn{margin-top: -1px!important;}
#googleBtn iframe #container-div{padding: 0!important;}
#googleBtn iframe{margin: 0!important;right: 0;width: 100%!important;}
.btnlogin{padding: 14px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #617767;
    color: white;
    font-size: 16px;
    margin: 6px 0px;}
.underlink-plus{text-align: center; display: block; width: fit-content; margin: 0 auto;font-size: 16px;color: #6C887C;}    
.inputx{
  width:calc(100% - 20px);padding:11px 10px;border:2px solid #E5E7EB;border-radius:14px; font-size: 16px;
}
.inputx:focus,
.inputx:focus-visible,
.inputx:focus-within{border-color: #6C887C;box-shadow:0 0 0 3px rgba(108,136,125,.35); outline: none;}
.inputx::placeholder{color:#9c9d9b;}
.iconregistro{
    position: relative;
    top: 6px;
    font-size: 42px;
    color: inherit;
    opacity: 1;
    left: -3px;
  }

.btn-facebook{
    min-width: 190px;
    width: 100%;
    background: white;
    border: 1px solid #dadce0;
    border-radius: 20px;
    color: #3c4043;
    font-family: "Google Sans", arial, sans-serif;
    font-weight: 600;
    font-size: 14px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;}

.auth-wrap{max-width: 520px; margin: 48px auto; padding: 0 16px;}
.card{border: none;
    border-radius: 16px;
    padding: 24px 44px; 
    background: rgba(255, 255, 255, .45);
    box-shadow: 0 4px 10px rgba(96, 125, 139, .2);}
.card h1{    margin: 0 0 2px;
    color: #617767;
    font-weight: 500;
    font-size: 36px;
    text-align: center;


    margin: 0 0 2px;
    color: #fff;
    font-weight: 500;
    font-size: 36px;
    text-align: center;
    background:#3f5b52;
    padding:24px 10px;
    margin: -24px -44px 10px!important;
    border-radius: 17px 17px 0 0;
    background: url(/assets/bgherox.jpg);
    background-size: 1440px auto;
    background-position: right;


  }    
.card p{
    margin: 0 0 16px;
    color: #6b7280;
    text-align: center;
  }    






/* Recuperar pass */
.hooster-auth .notice{padding:12px;border-radius:8px;margin:10px 0}
.hooster-auth .notice.success{background:#e8fff3;border:1px solid #c5f1d9}
.hooster-auth .notice.error{background:#fff1f1;border:1px solid #f1c5c5}
.hooster-auth form .field{margin-bottom:14px}
.hooster-auth .password-wrap{position:relative;display:flex;align-items:center}
.hooster-auth .password-wrap input{flex:1}
.hooster-auth .eye-btn{margin-left:8px;border:1px solid #ddd;background:#f8f8f8;border-radius:8px;padding:6px 10px;cursor:pointer}
.hooster-auth .btn{background:#348364;color:#fff;border:0;padding:10px 16px;border-radius:8px;cursor:pointer}
.hooster-auth .btn-link{margin-left:10px}
.hooster-auth .olvide-pass{margin-top:12px}



/* Etiqueta */
.field-label{
      display: block;
    margin-bottom: 1px;
    color: #6b7280;
    font-size: 16px;
    font-weight: 600;
}

/* Wrapper del input tipo “pill” */
.pw-field{
  display: flex;
  align-items: center;
  gap: 8px;
  border: 2px solid #E5E7EB;
  border-radius: 14px;
  padding: 2px 12px;
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}

/* Focus ring azul como en la referencia */
.pw-field:focus-within{
  border-color:#6C887C;             /* azul-300 */
  box-shadow:0 0 0 3px rgba(108,136,125,.35);
}

/* Input sin bordes internos */
.pw-input{
  flex:1;
  border:0;
  outline:0;
  font-size:16px;
  line-height:1.4;
  background:transparent;
  color:#111827;
  padding:0;
}

/* Botón ojito “ghost” */
.pw-eye{
  appearance:none;
  border:0;
  background:transparent;
  width:36px;
  height:36px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:#111827;
  cursor:pointer;
  transition:background-color .15s ease, color .15s ease;
}
.pw-eye:hover{ background:#F3F4F6; }   /* gris-100 */
.pw-eye:active{ background:#E5E7EB; }  /* gris-200 */

/* Icono SVG hereda el color */
.pw-eye .icon-eye,
.pw-eye .icon-eyeoff{
  display:block;
}

/* Mensaje de ayuda */
.field-help{
  display:block;
  margin-top:6px;
  color:#6B7280;
  font-size:12px;
}






/*SINGLE ALOJAMIENTO*/
:root{
  --gap: clamp(12px, 2.4vw, 24px);
  --corner: 12px;
  --fg: #fff;
  --c1:#375E4F; --c2:#2d5b4f; --c3:#aabfad; --c4:#62b06f; --c5:#0d6b63;
  --c6:#464646; --c7:#8b8b8b; --c8:#b56576; --c9:#6d597a; --c10:var(--primary);
}

/* Base */

.ficha > *{margin:0;}
.ficha > *:not(.nombre):not(.destino){min-height:0;}

/* MOBILE FIRST (1 columna con el orden solicitado) */
.ficha{
  display:grid;
  gap:var(--gap);
  row-gap: 12px;
  column-gap: 30px;
  grid-template-columns: 1fr;
  grid-template-areas:
    "foto"
    "nombre"
    "precios"
    "anfitriones"
    "descripcion"
    "amenidades"
    "galeria"
    "mapa"
    "redes"
    "destino";
}

/* Áreas de cada bloque (colores demo) */
.ficha .foto{grid-area:foto;}
.ficha .nombre{grid-area:nombre; font-size:1.6rem; font-weight:800;}
.ficha .precios{grid-area:precios; background:var(--c3); color:#222;}
.ficha .anfitriones{grid-area:anfitriones;}
.ficha .descripcion{grid-area:descripcion;;}
.ficha .amenidades{grid-area:amenidades; }
.ficha .galeria{grid-area:galeria;}
.ficha .mapa{grid-area:mapa;}
.ficha .redes{grid-area:redes;}
.ficha .destino{grid-area:destino; background:var(--c10);}

/* En móvil, los wrappers no “estorban” */
.col-left, .col-right{ display: contents; }

/* Detallitos demo (opcionales) */
.ficha .foto{display:flex; align-items:center; justify-content:space-between;}

/* ESCRITORIO: 2 columnas + gajos arriba/abajo */
@media (min-width: 1024px){

  .ficha{
    max-width: 1200px;
    padding:0 40px;
    margin: 30px auto;
    grid-template-columns: minmax(0,1fr) 380px;
    grid-template-columns:0.618fr 0.382fr;
    grid-template-areas:
      "nombre nombre"
      "left   right"
      "destino destino";
  }

  /* Que nombre y destino ocupen todo el ancho */
  .ficha .nombre, .ficha .destino{ grid-column: 1 / -1; }

  /* Aquí es la clave: los wrappers son los ítems del grid */
  .col-left{  grid-area: left;  display:flex; flex-direction:column; gap:var(--gap); row-gap: 10px;}
  .col-right{ grid-area: right; display:flex; flex-direction:column; gap:var(--gap); }

  /* IMPORTANTE: NO uses grid-column en .foto/.galeria/.mapa/etc.
     El orden se controla con el DOM y el flex-column de cada wrapper */
}

.descripcion, .amenidades{margin: 0 15px;}
.mapbtns{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin:-70px 30px 32px;
}
.zonasdispo{border-left: 6px solid #EAEBE9; padding: 0 10px 10px 15px;}
.zonelinkx{background: #949C91; border-radius: 8px; padding:8px 13px; color: white; font-size: 13px;}
.btnmap{font-size: 12px;
    font-weight: 500;
    font-family: 'Roboto';
    background: var(--primary);
    color: white;
    padding: 10px;
    border-radius: 9px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    gap: 6px;
        background: #F1EFE6;
    background: linear-gradient(90deg, #F3F2EB, #F1EFE6);
    color: var(--primary);
    box-shadow: 0px 2px 7px #DBDBD0;
    transition: color .3s;
  }

.ficha .destino{margin-top: 30px; padding: 26px 26px 13px; border-radius: 16px; color: white;}
.ficha .titlemodul{
    font-size: 18px;
    color: var(--green);
    font-weight: 500;
    margin: 0 0 10px;
}
.ficha .h1title{    padding: 0;
    margin: 0 0 -9px;
    font-size: 40px;
    font-weight: 500;
    color: var(--green);
    line-height: 1.4;}
.ficha .ximgftrd{position: relative;flex:1;}
.ficha .js-fav{    padding: 8px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    right: 10px;
    top: 10px;
    position: absolute;}
.ficha .ftrimg{
      aspect-ratio: 2 / 1.2;
    object-fit: cover;
    object-position: bottom;
    border-radius: 18px;
    width: 100%;
    overflow: hidden;
    height: auto;
    display: block;
}
.ficha .h1title{padding: 0;
    margin: 0 0 -9px;
    font-size: 40px;
    font-weight: 500;
    color: var(--green);
    line-height: 1.4;
  }
  .ficha .zonelink{    font-size: 20px;
    border-bottom: 1.4px solid var(--link);
    color: #6C887C;
    font-family: Rubik, sans-serif;
    font-weight: 400;
    text-decoration: none;
    transition: border-bottom .4s, color .4s;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;}
  .ficha .descripcion p{font-size: 16px; margin: 0 0 15px;}
  .ficha .fastinfo p{margin: 0;}
  .ficha .fastinfo .precio{font-size: 12px; margin: 0;font-family: 'Rubik'; color: rgba(0, 0, 0, .4);}
  .ficha .fastinfo .precio strong{color: rgba(0, 0, 0, .6);}


.fastinfo{display:grid;gap:12px;}
@media (max-width:820px){.fastinfo{grid-template-columns:1fr}}
.fastinfo .fi-card{border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:6px}
.fastinfo .fi-pct{background:#E30004;color:#fff;border-radius:6px;padding:2px 6px;margin-right:8px;font-weight:700}
.fi-no-price{color: #9CA3AF; font-weight: 600; font-size: 18px;}

.fi-regular{font-size: 15px; color: #ADADAD;}
.fi-promo, .fi-solo-price{font-size: 17px; color: #368265; font-weight: 600;}
.fi-divider{background: #E5E5E5;height: 1px;}
.fi-solo-price span{color: #ADADAD;}
.fi-subprices {
    font-size: 12px;
    color:#6d887c;
}
.fi-rooms .ph-fill,
.fi-cap-row .ph-fill{color: #375E4F; font-size: 22px;}
.fi-cap-row, .fi-rooms{font-size: 14px; font-family: Rubik, sans-serif; font-weight: 400; }
.fi-rooms .ph{font-size: 24px;color: #999;}
figure.rr{display: flex; transform: rotate(0deg) scale(1.1); transition: all .3s; cursor: pointer;}
figure.rr:hover{    transform: rotate(240deg) scale(1.2);}
figure.rr figcaption{display: none;}

.fi-currency { font-weight: 500; margin-right:0; letter-spacing:.02em;font-size: 12px;}
.fi-amount   { font-weight: 500; font-size: 14px;}
.fi-regular .fi-amount { text-decoration: line-through; opacity:.7; font-size: 14px;}
.fi-regular .fi-currency{text-decoration-line:none;}
.fi-toprow .fi-promo .fi-amount{font-size: 22px;font-weight: 800;letter-spacing: -0.02em;}
.fi-toprow .fi-promo .fi-currency{font-weight: 800; font-size: 16px;}
.fi-subprices .fi-currency{color: #888;}
.fi-subprices .fi-amount{color: #888; margin-right: .5em;}
.fastinfo i.ph-fill, .fastinfo i.ph{position: relative; top: 4px;}
.titlemodul.fi-title{font-size: 15px; margin: 0;}
.no-data{color: #888; margin-right: .5em;}
.fi-cama-item strong{color: #888;}
.fi-camas-row i{ top:5px; }
.fi-subprices strong{display: inline-block; word-spacing: -0.06em;}
.fi-solo-price .fi-currency{font-weight: 800; font-size: 16px; color: #368265;}
.fi-solo-price .fi-amount{font-size: 22px; font-weight: 800; color: #368265;letter-spacing: -0.02em;}
.fi-promo{color:#888;}
.fi-cap{margin-right: 10px;}
.fi-promo .fi-currency, .fi-promo .fi-amount{color: #368265;}




/* Grid de la galería (ajusta columnas a tu gusto) */
.grid-galeria.galeria-limit{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:10px;
}

/* Item base */
.gal-item{
  position:relative;
  overflow:hidden;
  border-radius:10px;
}
.gal-item img{
  display:block;
  width:100%;
  height:auto;
}

/* Badge +N en la quinta miniatura cuando hay más */
.gal-more-badge{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.45);
  color:#fff;
  font-weight:800;
  font-size:clamp(18px, 2.6vw, 24px);
  letter-spacing:.5px;
  user-select:none;
  pointer-events:none; /* deja que el click abra la galería */
}
/* Base de ítems */
.grid-galeria.galeria-limit .gal-item{
  position:relative;
  overflow:hidden;
  border-radius:10px;
}
.grid-galeria.galeria-limit .gal-item img{
  display:block;width:100%;height:auto; border-radius: 5px;
    aspect-ratio: 2 / 1.4;
    object-fit: cover;
}

/* Mostrar máximo 6 en mobile (7º en adelante escondidos) */
.grid-galeria.galeria-limit .gal-item:nth-child(n+7){
  display:none;
}

/* En escritorio: oculta la 6ª para que queden 5 visibles */
@media (min-width:1024px){
  .grid-galeria.galeria-limit .gal-item:nth-child(6){
    display:none !important;
  }
}

/* Badge +N (superposición) */
.gal-more-badge{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.45);color:#fff;font-weight:800;
  font-size:clamp(18px, 2.6vw, 24px);letter-spacing:.5px;
  user-select:none;pointer-events:none;border-radius:10px;
}

/* Mostrar/ocultar el badge correcto según viewport */
.badge--desktop{ display:none; }
.badge--mobile{ display:flex; } /* por defecto (mobile) */

@media (min-width:1024px){
  .badge--desktop{ display:flex; }
  .badge--mobile{ display:none; }
}
/* Por defecto (móvil): se muestran hasta 6 */
.grid-galeria.galeria-limit .gal-item:nth-child(n+7) {
  display: none; /* Ocultamos del DOM visual las >6 */
}

/* En escritorio (>1024px): forzamos a que solo haya 5 visibles */
@media (min-width: 1024px){
  .grid-galeria.galeria-limit .gal-item:nth-child(6) {
    display: none !important; /* ocultamos el 6º */
  }
}


















/*LOGIN USUARIO*/
.panel{background:#fff;border:1px solid #e5e7eb;border-radius:0 0 16px 16px;padding:20px 26px; min-height: 350px;}
.headuser{
  display:flex;justify-content:space-between;align-items:center;
  gap:12px;flex-wrap:wrap; color: #fff;
  background: #3f5b52; border-radius: 16px 16px 0 0;
  padding: 16px 20px;
}
.menuuser{display:flex;gap:8px;flex-wrap:wrap; font-size: 16px;}

.footerhoost{
  flex-direction: column;
  align-items: center;
}
.infoot{display: block;
    width: 100%;
    text-align: center;
    background: rgba(0, 0, 0, .3);
    padding: 10px 0;}
.menuzona{color: var(--wp--preset--color--accent-6);}    

/* ----------------- Desktop (>=768px) ----------------- */
@media (min-width: 768px) {
  .grid-container {
    grid-template-columns: 0.618fr 0.382fr;
    grid-template-areas:
      "titulo     titulo"
      "imagen     contacto"
      "descripcion amenidaxx"
      "mapa       amenidades"
      "botones    atractivos";
  }
}

/* ------------------ Mobile (<768px) ------------------ */
@media (max-width: 767px) {
  .grid-container {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
      "imagen     imagen"
      "titulo     titulo"
      "descripcion descripcion"
      "contacto   contacto"
      "amenidades atractivos"
      "amenidaxx    amenidaxx"
      "mapa       mapa"
      "botones    botones";
  }
}

/* Asigna cada área a su div */
.titulo      { grid-area: titulo; color:#000; padding:1rem; }
.hostid      { grid-area: imagen;      background:var(--ghost); }
.hostid .ftrimg {width: 100%;}
.descripcion { grid-area: descripcion; background:var(--ghost); }
.contacto    { grid-area: contacto;    background:var(--gost); }
.amenidades  { grid-area: amenidades;}
.atractivos  { grid-area: atractivos;  background:var(--gost); }
.amenidaxx    { grid-area: amenidaxx;     background:var(--gost); }
.mapa        { grid-area: mapa;}
.botones     { grid-area: botones;     background:#eee;     /* aquí van tus botones */ }



/*ESTILOS USER ACTIVE*/
.fav-card a img{ object-fit: cover;width: 100%;height: auto;}




/*RESPONSIVE*/
@media (max-width: 1072px) {
  .callhoost .callphone span i{display: none;}
  .profilehoost{line-height: 1.1;}
}

@media (max-width: 768px) {

  .masalojas{display: none;}

  .resultados-grid{
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1rem; margin-top: .8rem;
  }
  .hoost .zona strong{display: none;}
  .hoost h3{font-size: 16px;}

.hero-grupo-zona .wrap-container{grid-template-columns:1fr; padding: 1.5rem 2rem;}
.footerhoost h2{text-align: center;}
.footerhoost .infoot{font-size: 11px!important; opacity: .7;}

.busqueda-wrap{display: block!important; padding: 0 1em;}
.barra-superior{display: block!important; }
.sidebar-filtros{max-width: 100%!important;}
.hero-search h1{margin:0; font-size: 21px;}

.wp-container-core-group-is-layout-f4c28e8b{place-content: space-between; width: 100%;}
.wp-container-core-group-is-layout-bb2ca1fc{margin:0 auto!important;}

  /*SINGLE ALOJA*/
  .ficha .h1title{font-size: 32px;}
  header.nombre, .galeria, .infohosp, .destino,
  .anfitriones, .fastinfo{margin: 0 15px;}
  .descripcion .titlemodul{margin: 10px 0 3px;}
  .descripcion, .amenidades{margin: 0 25px;}


}






/*Centrar contenido verticalmente en home*/
@media (min-height: 900px) {
  
  body.home {display: flex; flex-direction: column; min-height: 100vh;}
  body.home .wrap-container.venancio{flex: 1; display: flex; align-items: center; justify-content: center;}

}