:root {
  --ifm-menu-color: var(--ifm-color-emphasis-700);
  --ifm-menu-color-active: var(--ifm-color-primary);
  --ifm-menu-color-background-active: var(--ifm-hover-overlay);
  --ifm-menu-color-background-hover: var(--ifm-hover-overlay);
  --ifm-menu-link-padding-horizontal: 1rem;
  --ifm-menu-link-padding-vertical: 0.375rem;
  --ifm-menu-link-sublist-icon: url('data:image/svg+xml;utf8,<svg alt="Arrow" xmlns="http://www.w3.org/2000/svg" width="16px" height="16px" viewBox="0 0 24 24"><path fill="rgba(0,0,0,0.5)" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path></svg>');
}

.sidebarLogo {
  display: none;
}

.sidebarMenuIcon {
  vertical-align: middle;
}

.sidebarMenuCloseIcon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 24px;
  font-size: 1.5rem;
  font-weight: var(--ifm-font-weight-bold);
  line-height: 0.9;
  width: 24px;
}


.menu {
  font-weight: var(--ifm-font-weight-semibold);
  overflow-x: hidden;
  // flex-grow: 1;
  margin-left: calc(var(--ifm-menu-link-padding-horizontal) * -1);

  &::-webkit-scrollbar {
    width: 7px;
  }

  &::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;

    &:hover {
      background: #555;
    }
  }
}

.menu__list {
  margin: 0;
  list-style-type: none;
  padding-left: 0;
  transition: height var(--ifm-transition-fast) cubic-bezier(0.08, 0.52, 0.52, 1);

  .menu__list {
    margin-left: var(--ifm-menu-link-padding-horizontal);
  }
}

.menu__list-item {
  margin-bottom: 0.25rem;
  margin-top: 0.25rem;
}

.menu__list-item--collapsed {
  .menu__list {
    height: 0;
    overflow: hidden;
  }

  .menu__link--sublist:after {
    transform: rotateZ(90deg);
  }
}

.menu__link {
  border-radius: 0.25rem;
  color: var(--ifm-menu-color);
  cursor: pointer;
  display: flex;
  line-height: 20px;
  justify-content: space-between;
  margin: 0;
  padding: var(--ifm-menu-link-padding-vertical) var(--ifm-menu-link-padding-horizontal);

  &:hover {
    text-decoration: none;
  }
}

.menu__link--sublist {
  padding-right: 0.75em;

  &::after {
    background-image: var(--ifm-menu-link-sublist-icon);
    background-size: 2rem 2rem;
    background-position: center;
    content: ' ';
    display: inline-block;
    height: 1.25rem;
    width: 1.25rem;
    transition: transform var(--ifm-transition-fast) linear;
    transform: rotate(180deg);
  }
}

.menu__link:hover {
  background: var(--ifm-menu-color-background-hover);
  color: var(--ifm-menu-color);
}

.menu__link--active {
  color: var(--ifm-menu-color-active);

  &:hover {
    color: var(--ifm-menu-color-active);
  }

  &:not(.menu__link--sublist) {
    background: var(--ifm-menu-color-background-active);
  }
}

.menu__link__text {
  cursor: initial;

  &:hover {
    background: none;
  }
}

// .menu--responsive .menu__button {
//   bottom: 2rem;
//   display: none;
//   position: fixed;
//   right: 1rem;
//   z-index: var(--ifm-z-index-fixed);
// }

// @media (max-width: 996px) {
//   .menu--responsive .menu__button {
//     display: inherit;
//   }
// }

// @media (max-width: 996px) {
//   .menu--responsive .menu__list {
//     display: none;
//     opacity: 0;
//   }
// }

.menu--show {
  -ms-scroll-chaining: none;
  background: var(--ifm-background-surface-color);
  bottom: 0;
  left: 0;
  overscroll-behavior: contain;
  padding: 1rem;
  position: fixed;
  right: 0;
  top: 0;
  z-index: var(--ifm-z-index-overlay);

  .menu__list {
    display: inherit;
    opacity: 100;
    transition: opacity var(--ifm-transition-fast) linear;
  }
}
