/**Nuevo diseño caja de busqueda dinamica */
         .hero-booker__hotels,
        .hero-booker__flights,
        .hero-booker__packages {
            position: relative;
            z-index: 1;
        }

        @media (min-width: 768px) {

            .hero-booker__hotels .search,
            .hero-booker__hotels form,
            .hero-booker__flights .search,
            .hero-booker__flights form,
            .hero-booker__packages .search,
            .hero-booker__packages form {
                max-width: 736px;
                margin: 0 auto;
            }
          .title-tabs-cbd{
              text-align: center; font-family: sans-serif;
              font-weight: 600;
              font-size: 0.6rem; margin-top: 5px;
            }

        }

        @media (min-width: 992px) {

            .hero-booker__hotels .search,
            .hero-booker__hotels form,
            .hero-booker__flights .search,
            .hero-booker__flights form,
            .hero-booker__packages .search,
            .hero-booker__packages form {
                max-width: 960px;
            }
        }

        @media (min-width: 1280px) {

            .hero-booker__hotels .search,
            .hero-booker__hotels form,
            .hero-booker__flights .search,
            .hero-booker__flights form,
            .hero-booker__packages .search,
            .hero-booker__packages form {
                max-width: 1252px;
            }

            .hero-booker__hotels,
            .hero-booker__flights,
            .hero-booker__packages {
                display: flex;
                align-items: center;
                justify-content: center;
            }
        }
    .tabs {
  width: 100%;
  position: relative;
  border-radius: 6px;
  padding: 10px;
  background: #fff;
  
  /* sombra más amplia (20% del tamaño aprox) */
  /*box-shadow: 0 20px 20px rgba(0,0,0,0.2);*/
  z-index: auto;
}
@media (max-width: 767px) {
    .tabs {
        padding-bottom: 0px!important;
        padding-left: 0px!important;
        padding-right: 0px!important;
        padding-top: 0.2rem !important;
    }

    .tab-nav {
        display: flex;
        list-style: none;
        justify-content: center!important;  /*alinea todo hacia la izquierda */
        padding-left: 0px!important;        /* elimina sangría por defecto */
        margin: 0px;              /* opcional, limpia márgenes */  
        cursor: pointer;
    }
    .tab-nav li {
        /*padding: 10px 10px 5px 10px!important;*/
        border-bottom: 2px solid transparent!important;
    }
.title-tabs-cbd{
    text-align: center; font-family: sans-serif;
    font-weight: 600;
    font-size: 0.6rem; margin-top: 5px;
}
    
}

.tab-nav {
  display: flex;
  list-style: none;
  justify-content: flex-start; /* alinea todo hacia la izquierda */
  padding-left: 10px;        /* elimina sangría por defecto */
  margin: 0;              /* opcional, limpia márgenes */  
  cursor: pointer;
}
.tab-nav li {
  padding: 10px 10px 5px 10px;
  border-bottom: 2px solid transparent!important;
}
.tab-nav li.active {
  border-bottom: 2px solid #db006e!important; 
}
.tab-pane-cbd{
  display: none!important;
  padding: 5px;
}
.tab-pane-cbd.active {
  display: block!important;
}
.title-tabs-cbd{
    text-align: center; font-family: sans-serif;
    font-weight: 600;
    font-size: 0.9rem; margin-top: 5px;
}
/**nuevo*/
.tab-nav li.title-tabs-cbd {
  padding: 10px 10px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.tab-nav li.title-tabs-cbd.active {
  border-bottom: 3px solid #333; /* borde sólido para el activo */
}

.tab-nav li.title-tabs-cbd:hover {
  border-bottom: 3px solid rgba(128, 128, 128, 0.5);!important /* gris transparente */
}


/* Ocultar los que tengan la clase hide-mobile en pantallas pequeñas*/ 
@media (max-width: 768px) {
  .tab-nav li.hide-mobile {
    display: none !important;
  }
}

/* Estilo base de los iconos en span */
.tab-nav li.title-tabs-cbd span {
  color: #333; /* color inicial */
  transition: color 0.3s ease; /* animación suave */
}

/* Cuando el tab está activo */
.tab-nav li.title-tabs-cbd.active span {
  color: #db006e; /* color rosa/magenta */
}
.tab-nav li.title-tabs-cbd a {
  display: inline-block;
  color: inherit;
  text-decoration: none;
  padding: 0; /* ajusta según tu diseño */
}
.tab-nav li.title-tabs-cbd a.external-tab {
  display: inline-block;
  color: inherit;
  text-decoration: none!important;
  padding: 0;
  font-weight: 600!important;
  font-size: 0.9rem!important;
}