/* Encapsulando los estilos del dropdown */
.gh-navigation-actions .dropdown {
  position: relative;
  display: inline-block;
}

.gh-navigation-actions .dropdown-toggle {
  background-color: #f8f8f8;
  color: #333;
  font-size: 1.5rem;
  border: none;
  cursor: pointer;
  width: 100%;
  letter-spacing: -.004em;
  line-height: 1;
  padding: .8em 1.4em;
}

.gh-navigation-actions .dropdown-menu {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  width: 100%;
}

.gh-navigation-actions .dropdown-menu a {
  color: #15171a;
  font-size: 1.5rem;
  text-decoration: none;
  display: flex;
  align-items: center;
  padding: 7px;
  margin-left: 22px;
}

.gh-navigation-actions .dropdown-menu a:hover {
  background-color: #f1f1f1;
}

.gh-navigation-actions .dropdown-menu img {
  width: 30px;
  height: auto;
  margin-right: 15px;
}

/* Mostrar el menú cuando el dropdown es activado */
.gh-navigation-actions .dropdown:hover .dropdown-menu {
  display: block;
}

/* Media queries para dispositivos más grandes */

/* Tablets en modo retrato y panorámico */
@media (min-width: 600px) and (max-width: 768px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}

/* Laptops y pantallas pequeñas de escritorio */
@media (min-width: 769px) and (max-width: 1024px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}

/* Pantallas de escritorio */
@media (min-width: 1025px) and (max-width: 1440px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}

/* Pantallas grandes de escritorio */
@media (min-width: 1441px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}

/* Móviles en modo retrato */
@media (orientation: portrait) and (max-width: 600px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}

/* Móviles en modo panorámico */
@media (orientation: landscape) and (max-width: 600px) {
  .gh-navigation-actions .dropdown-menu {
      width: 100%;
  }
}