/* Copyright (C) 2025
 * Calmel, Blaise (1)
 * Héraut, Louis (1) <louis.heraut@inrae.fr>
 * Vidal, Jean-Philippe (1) <jean-philippe.vidal@inrae.fr>
 *
 * (1) INRAE, UR RiverLy, Villeurbanne, France.
 *
 * This file is part of MEANDRE-TRACC.
 *
 * MEANDRE-TRACC is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * MEANDRE-TRACC is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with MEANDRE-TRACC.
 * If not, see https://www.gnu.org/licenses/.
 */


#container-menu {
    position: absolute;
    right: 0;
    top: 0;
    box-shadow: 0 1px 3px rgba(60,64,67,0.3),0 4px 8px 3px rgba(60,64,67,0.15);
    pointer-events: auto;
    width: 0px;
    background-color: #ffffff;
    color: #060508;
    transition: width 0.3s ease;
    z-index: 20;
    height: 100vh;
    overflow-y: auto;
}
#container-menu.expanded {
    pointer-events: auto;
    width: 18rem;
    padding-top: 0rem;
    padding-bottom: 1rem;
}
.hidden {
    display: none;
}

#menu {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

#button_close_exploration-avancee {
    position: sticky;
    top: 0;
    background: white;
    width: 100%;
    height: 100%;
    z-index: 100;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    box-shadow: 0 1px 2px rgba(60,64,67,0.3),0 2px 6px 2px rgba(60,64,67,0.15);
}


/* DRAWER */
.drawer {
    position: relative;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    border-top: 2px solid #70757A;
}
.drawer.no-border {
    border-top: none;
}
.subdrawer {
    position: relative;
}

.drawer-label,
.subdrawer-label {
    margin-top: 0.7rem;
    margin-bottom: 0.7rem;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}
.subdrawer-label {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.drawer-label h1:hover,
.subdrawer-label h2:hover,
.drawer-icon.material-icons-outlined,
.drawer-icon.material-icons-outlined {
    color: #70757A;
}

.drawer-icon.rotated {
    transform: rotate(-180deg);
}
.drawer-icon {
    transition: transform 0.3s ease;
}


.drawer-content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease-out;
}

.drawer-content.expanded {
    max-height: 1000px;
}

.end-drawer {
    height: 1.5rem;
}
.end-subdrawer {
    height: 0.5rem;
}




@media (max-width: 90rem) {
    
    #container-menu.expanded {
	width: 100vw;
    }

}