/* Nascondi il checkbox */
.menu-toggle {
    display: none;
}

/* Contenitore del menu */
.burger-menu {
    position: relative;
}

/* Icona burger sempre visibile in alto a sinistra */
.burger-icon {
    width: 30px;
    height: 25px;
    position: fixed;
    top: 15px;
    left: 15px; /* Spostato a sinistra */
    cursor: pointer;
    z-index: 1000;
}

.bar {
    width: 100%;
    height: 4px;
    background-color: var(--azzurro);
    margin: 5px 0;
    transition: 0.3s;
}

/* Stile del menu */
.menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    position: fixed;
    top: 0;
    right: -250px; /* Nascosto a destra */
    width: 250px;
    height: auto;
    background-color:var(--grigio1);
    transition: 0.3s;
    z-index: 900; /* Sotto l'icona quando chiuso */
}

.menu-list li {
    padding: 15px;
}

.menu-list a {
    text-decoration: none;
    color: var(--blackSmoke);
    font-size: 18px;
}

.menu-list a:hover {
    text-decoration: underline;
}

/* Mostra il menu quando il checkbox è selezionato */
.menu-toggle:checked ~ .menu-list {
    right: 0; /* Menu visibile da destra */
}

/* Contenuto di esempio */
.content {
    padding: 60px 20px;
}

/* Responsività */
@media (max-width: 768px) {
    .burger-icon {
        width: 25px; /* Leggermente più piccolo su schermi piccoli */
        height: 20px;
    }
    .bar {
        height: 3px;
        margin: 4px 0;
    }
    .menu-list {
        width: 200px; /* Menu più stretto su mobile */
    }
}