/*========================= BANNER-INTERIOR   ==========================*/
.bannerInterior figure {
  position: relative;
  height: 300px;
  overflow: hidden;
}

.bannerInterior figure::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .5);
}

/*============================================= INFO-HABITACION =============================================*/
.iti__flag {
  background-image: url("https://cdn.jsdelivr.net/npm/intl-tel-input@23.9.3/build/img/flags.png") !important;
}

.infoHabitacion {
  position: relative;
  margin-top: -20px;
}

.infoHabitacion .colIzqHabitaciones {
  position: relative;
  margin-top: -170px;
}

.infoHabitacion .colIzqHabitaciones ul li a {
  font-family: 'Open Sans', sans-serif;
  font-weight: 100;
  font-size: 18px;
}

.infoHabitacion .colIzqHabitaciones ul li a.active {
  color: #FFE060 !important;
}

.infoHabitacion .colIzqHabitaciones .nav-link {
  border-right: 1px solid white;
}


.infoHabitacion .colIzqHabitaciones .fa-angle-right:before {
  content: "\f105";
  background: rgba(255, 255, 255, .8);
  padding: 20px 10px;
}

.infoHabitacion .colIzqHabitaciones .fa-angle-left:before {
  content: "\f104";
  background: rgba(255, 255, 255, .8);
  padding: 20px 10px;
}



.colIzqHabitaciones p {
  line-height: 30px;
  color: #666;
}

.colorTitulos {
  color: #847059;
}

.colDerHabitaciones {
  transition: 0.3s all;
}

/*=================================== Formulario disponibilidad ====================*/
.form-disponibilidad-bs5 .bg-disponibilidad-bs5 {
  background: #509CC3;
  border-radius: 7px;
  box-shadow: 0 2px 12px #0001;
}

.form-disponibilidad-bs5 .form-control {
  border-radius: 0.5rem 0 0 0.5rem !important;
  border: none;
  font-size: 1.1rem;
  height: 44px;
  box-shadow: none;
}

.form-disponibilidad-bs5 .input-group-text {
  border-radius: 0 0.5rem 0.5rem 0 !important;
  border: none;
  background: #f3f5f7;
  height: 44px;
}

.form-disponibilidad-bs5 .btn-dark {
  font-size: 1.15rem;
  font-weight: 400;
  transition: background 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 8px #0002;
}


/*=============================================
TABLET VERTICAL (MD revisamos en 768px hacia abajo)
=============================================*/

@media (max-width:768px) {

  .infoHabitacion .colIzqHabitaciones .nav-link {
    border-right: 0;
    border: 1px solid #999;
  }

  .infoHabitacion .colIzqHabitaciones .cabeceraHabitacion {
    background: black;
  }

  .infoHabitacion .colIzqHabitaciones ul li {
    background: #333;
  }

  .infoHabitacion .colIzqHabitaciones ul li a.active {
    background-color: black !important;
  }

  .infoHabitacion .colIzqHabitaciones ul li a.active i {
    display: none;
  }

  .infoHabitacion .categoria {
    color: #af9475 !important;
  }

  .descripcionHabitacion h1 {
    font-size: 30px;
  }

  .form-disponibilidad-bs5 .bg-disponibilidad-bs5 {
    padding: 0.5rem 0.5rem;
  }

  .form-disponibilidad-bs5 .btn-dark {
    font-size: 1rem;
    padding: 0.5rem 0;
  }
}