/* v0.14.30 — functional sidebar collapse on desktop + mobile */
#appView,
#sidebar,
#menuBtn,
.content{
  transition:padding .24s ease, transform .24s ease, width .24s ease, background-color .2s ease, box-shadow .2s ease;
}

#menuBtn{
  min-width:38px;
  min-height:38px;
  border-radius:11px;
  display:grid;
  place-items:center;
}
#menuBtn:hover,
#menuBtn.sidebar-active{
  background:rgba(255,255,255,.13);
}
#menuBtn:focus-visible{
  outline:2px solid rgba(255,255,255,.88);
  outline-offset:2px;
}

@media (min-width:901px){
  body.sidebar-collapsed #sidebar{
    transform:translateX(calc(100% + 34px)) !important;
    pointer-events:none;
    opacity:.25;
  }
  body.sidebar-collapsed #appView{
    padding-right:18px !important;
  }
  body.sidebar-collapsed #menuBtn{
    background:rgba(255,255,255,.14);
  }
}

@media (max-width:900px){
  #sidebar{
    transition:transform .24s ease !important;
  }
  #menuBtn.sidebar-active{
    background:rgba(255,255,255,.14);
  }
}

@media (prefers-reduced-motion:reduce){
  #appView,#sidebar,#menuBtn,.content{transition:none!important}
}
