/*!***************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/drawer-menu/style.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************/
nav.drawer {
  position: fixed;
  left: 0;
  bottom: 0;
  max-height: 100vh;
  overflow: hidden auto;
  width: var(--btn);
  z-index: var(--z-5);
  transition: var(--trans-size);
  --dir: column-reverse;
  background-color: rgb(var(--base));
  border-right: 1px solid rgb(var(--base-200));
  box-shadow: rgba(var(--base), var(--op-4)) var(--shdw-left);
  height: auto;
  --w: var(--chip_);
}
nav.drawer .title,
nav.drawer .section-title {
  display: none;
}
nav.drawer ul .icon {
  min-width: var(--chip_);
}
nav.drawer a,
nav.drawer .a {
  height: var(--chipchip);
  padding: 0 0.5rem;
  width: 100%;
  gap: 0.5rem;
  justify-content: center;
}
nav.drawer .toggle {
  width: 100%;
  aspect-ratio: unset;
}
nav.drawer .toggle .icon {
  transform: rotate(0);
  transition: var(--trans-transform);
}
nav.drawer.open {
  width: 240px;
}
nav.drawer.open .title,
nav.drawer.open .section-title {
  display: block;
}
nav.drawer.open .toggle .icon {
  transform: rotate(-180deg);
}
nav.drawer.open a,
nav.drawer.open .a {
  justify-content: flex-start;
}
nav.drawer ul {
  --dir: column;
  --gap: 0;
  --height: auto;
  padding: 0;
  margin: 0;
  height: auto;
  width: 100%;
  overflow: hidden;
}
nav.drawer li {
  height: auto;
  width: 100%;
}
nav.drawer .row {
  width: 100%;
}
nav.drawer .menu-section {
  border-bottom: 1px solid rgb(var(--contrast-200));
}
nav.drawer .section-title {
  padding: 0.5rem var(--px);
  font-size: var(--small);
  text-transform: uppercase;
  opacity: 0.6;
  font-weight: bold;
}
.main-actions .buttons.buttons {
  left: calc(var(--btn_) + 0.5rem);
}
nav.on-this-page.on-this-page.on-this-page {
  width: calc(100vw - var(--btn)) !important;
}