#menu {
    max-height: calc(var(--vh) * 100);
    overflow-y: auto;
}
#header-mobile[data-status='close'] #menu {height: 0;}
@media only screen and (min-width: 768px) {
    #menu {
        width: 50%;
        flex-grow: 1;
    }
}
@media only screen and (min-width: 1096px) {
    #menu {
        width: 100%;
        flex-grow: 0;
    }
}

#menu * {transition: opacity 500ms ease-in-out;}

.menu-item {
    display: flex !important;
    justify-content: space-between;
    width: 100%;
    padding: var(--size-s) 0;
    background: var(--c-white);
    border-top: 1px solid var(--color);
}

.menu-item .menu--icon {opacity: 0;}

body[data-template='bookstore'] #menu-bookstore--link .--icon:not(.--hover) {display: block; opacity: 1 !important;}
body[data-template='bookstore'] #menu-bookstore--link .--icon.--hover {display: none; opacity: 0;}
body:not([data-template='bookstore']) #menu-bookstore--link .--icon:not(.--hover) {display: none; opacity: 0;}
#menu:not([data-view="level-0"]) #menu-bookstore--link .--icon.--hover {display: block; opacity: 1;}
#menu:not([data-view="level-0"]) #menu-bookstore--link .--icon:not(.--hover) {display: none; opacity: 0;}

body[data-template='publisher'] #menu-publisher .--icon {opacity: 1 !important;}
body[data-template='blind-encounters'] #menu-blind_encounters .--icon {opacity: 1 !important;}
body[data-template='os-livros-da-catia'] #menu-suggestions_catia .--icon {opacity: 1 !important;}
body[data-template='os-livros-do-arnaldo'] #menu-suggestions_arnaldo .--icon {opacity: 1 !important;}
body[data-template='about'] #menu-about .--icon {opacity: 1 !important;}
body[data-template='friendship'] #menu-friendship .--icon {opacity: 1 !important;}
body[data-template='search'] #menu-search .--icon {opacity: 1 !important;}

@media (hover: hover) {
    .menu-item .menu--icon {transition: opacity 200ms ease-in-out !important;}
    .menu-item:not(#menu-bookstore--link):hover .menu--icon {opacity: 1;}

    #menu-bookstore--link:hover .menu--icon.--hover {display: block !important; opacity: 1 !important;}
    #menu-bookstore--link:hover .menu--icon:not(.--hover) {display: none !important; opacity: 0 !important;}
}



/* 
CLOSE
*/
#menu-close {
    display: block !important;
    margin-top: var(--size-xl);
    padding-top: 0;
    border-top: 0;
}
#menu[data-view="level-0"] #menu-close {
    height: 0;
    padding-bottom: 0;
}
#menu-close .menu--icon {opacity: 1 !important;}



/* 
GROUPS
*/
/* .menu-group[data-status='close'] {height: 30.4px;}
@media only screen and (min-width: 768px) {
    .menu-group[data-status='close'] {height: 28.56px;}
}
@media only screen and (min-width: 1096px) {
    .menu-group[data-status='close'] {height: 27.87px;}
} */

.menu-item.--lvl_1 {padding-left: var(--size);}
.menu-item.--lvl_2 {padding-left: calc(var(--size) * 2);}
.menu-item.--lvl_3 {padding-left: calc(var(--size) * 3);}


#menu[data-view="level-1"] > a {opacity: .3 !important;}
#menu[data-view="level-1"] .--bookstore .menu--icon {opacity: 1 !important;}

#menu[data-view="level-2"] > a,
#menu[data-view="level-2"] a.--lvl_1,
#menu[data-view="level-2"] .menu-group.--lvl-2:not([data-status='open']) {opacity: .3 !important;}
#menu[data-view="level-2"] .menu-group.--lvl-2[data-status='open'] button.--lvl_1 .menu--icon {opacity: 1 !important;}

#menu[data-view="level-3"] > a,
#menu[data-view="level-3"] a.--lvl_1,
#menu[data-view="level-3"] .menu-group.--lvl-2:not([data-status='open']),
#menu[data-view="level-3"] .menu-group.--lvl-3:not([data-status='open']) {opacity: .3 !important;}
#menu[data-view="level-3"] .menu-group.--lvl-3[data-status='open'] button.--lvl_2 .menu--icon {opacity: 1 !important;}