/* menu2 */

#menu2 {
    /* 1. Asegurar que el menú esté centrado */
    text-align: center;
}

#menu2 ul {
 list-style:none;
    margin:0 auto; /* Centra el contenedor si tiene ancho definido */
    padding:0;
    display: inline-flex; /* 2. Cambiar a flexbox para centrar horizontalmente */
    justify-content: center; /* 3. Alinea los elementos al centro */
    width: auto;
}

/* items del menu2 */

#menu2 ul li {
 background-color:#c8c7c9;
 margin: 4px ;
 position:relative;
    z-index: 999;
}                

/* enlaces del menu2 */

#menu2 ul a {
 display:block;
 color:#121212;
 text-decoration:none;
 font-weight:400;
  font-size:12px; /* Ajustado para mejor legibilidad */
    padding:10px 15px; /* Más padding para que sea más fácil hacer clic */
    font-family: arial, sans-serif;
}

/* items del menu2 */


#menu2 ul li:hover {
 background:#f0ece6;
}

/* menu2 desplegable */

#menu2 ul ul {
 display:none;
 position:absolute;
 z-index: 999;
 top:100%;
  left: 50%;
  transform: translateX(-50%); /* Centra el submenu respecto al padre */
 background:#eee;
 padding:0;
 min-width: 150px; /* Asegura un ancho mínimo */
  /*white-space: nowrap; /* Evita que los submenús se corten en varias líneas */
}

/* items del menu2 desplegable */

#menu2 ul ul li {
 float:none;
 width: 100%; /* Ocupa el 100% del contenedor ul ul */
    text-align: center; /* Texto centrado dentro del submenú */
   /* margin: 0; /* Ajustado para que no haya márgenes raros */
  margin-top:1
  margin-bottom:1
  margin-left:0
  margin-right:0
  
}

/* enlaces de los items del menu2 desplegable */



/* items del menu2 desplegable al pasar el ratón */

#menu2 ul li:hover > ul {
 display:block;
}