.menu-hamburguesa {
  position: relative;
  display: inline-block;
}

/* Botón hamburguesa con color personalizado */
.hamburguesa {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #ff6f3c; /* color del icono */
}

/* Estilo general del menú */
.menu-links {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  right: 0;
  top: 143%;
  background-color: #DDDDDD;
  border: 1px solid var(--color-nav-texto);
  border-radius: 6px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  z-index: 1000;
  min-width: 180px;
}

/* Estilo general del menú */
.menu-links {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  right: 0;
  top: 143%;
  background-color: #DDDDDD;
  border: 1px solid var(--color-nav-texto);
  border-radius: 6px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  z-index: 1000;
  min-width: 180px;
}
/* Ajuste para modo oscuro */
body.dark-mode .menu-links {
  background-color: rgba(44, 44, 44, 0.9); /* Fondo oscuro con transparencia */
  border: 1px solid var(--color-nav-texto); /* Bordes adaptados al modo oscuro */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5); /* Sombra más intensa */
}

.menu-links li a {
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  color: #000000; /* color del texto */
  font-family: 'Montserrat', sans-serif;
}

.menu-links li a:hover {
  background-color: var(--rojo-hover);
  color: #fff;
  border-radius: 4px;
}

/* Mostrar menú cuando está activo */
.menu-hamburguesa.active .menu-links {
  display: block;
}

/* Ajuste para modo oscuro */
body.dark-mode .menu-links li a {
  color: #FFFFFF; /* Texto blanco en modo oscuro */
}