.root {
  width: 100%;
  height: 100%;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.mini_container {
  position: absolute;
  left: 0;
  width: 100%;
  border: 0;
  border-right: rem(1) solid;
  border-color: light-dark(
    var(--mantine-color-gray-4),
    var(--mantine-color-dark-3)
  );
  border-style: dashed;
  border-right-width: 1px;
  overflow: auto;
  background-color: light-dark(
    var(--mantine-color-white),
    var(--mantine-color-dark-6)
  );
  z-index: 20;
}

.mini_link_item_container {
  overflow-y: scroll;
  width: 100%;
  height: 100%;

  &::-webkit-scrollbar {
    display: none;
  }
}

.mini_link {
  width: 100%;
  height: rem(48) !important;
  cursor: pointer;
  border-radius: var(--mantine-radius-md);
  display: flex;
  justify-content: center;
  align-items: center;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;

  &[data-active="true"] {
    background-color: var(--mantine-color-gray-2);
  }

  &:hover {
    background-color: var(--mantine-color-gray-2);
  }
}
