/* Quitar los puntos de todas las listas */
.side_menu ul,
.side_menu li {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Estilo general para modo móvil */
@media (max-width: 768px) {
    .side_menu {
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        background-color: #fff;
        z-index: 9999;
        overflow-y: auto;
        padding: 20px;
    }

    .side_menu .close-menu {
        display: block;
        text-align: right;
        font-size: 24px;
        margin-bottom: 20px;
    }

    .side_menu .menu-lang li,
    .side_menu .menu-footer li {
        display: inline-block;
        margin-right: 10px;
    }

    .side_menu .menu-list li {
        border-bottom: 1px solid #eee;
        padding: 10px 0;
    }

    .side_menu .menu-list a {
        display: block;
        width: 100%;
        color: #333;
        text-decoration: none;
        font-weight: 500;
    }

    .side_menu .menu-list a:hover {
        background-color: #f8f9fa;
        border-radius: 5px;
        padding-left: 10px;
        transition: 0.3s;
    }

    .side_menu .menu-footer {
        margin-top: 30px;
        text-align: center;
    }

    .side_menu .social-list li {
        display: inline-block;
        margin: 0 5px;
    }

    .side_menu .copy {
        font-size: 12px;
        margin-top: 10px;
        color: #888;
    }

    .submenu>a::after {
        content: " ▼";
        font-size: 12px;
        color: #888;
    }

.side_menu .menu-list li ul li a {
  font-size: 2vh;
  color: black;
  transition: all 400ms linear 0s;
}


}

/* Ocultar el menú en escritorio si es necesario */
@media (min-width: 769px) {
    .side_menu {
        display: none;
    }
}

/* Mostrar cuando el checkbox está marcado */
.toggle-submenu:checked + .submenu-toggle + .dropdown-desplegable {
  display: block;
  position: static;
}

/* Estilo del label (en lugar del <a>) */
.submenu-toggle {
  display: block;
  padding: 10px 0;
  cursor: pointer;
  color: #333;
  font-weight: 500;
  text-decoration: none;
  font-size: 2.5vh;
}

.submenu-toggle::after {
  content: " ▼";
  font-size: 16px;
  color: #333;
}
