#toolbar {
  position: fixed;
  display: flex;
  flex-direction: column;
  background-color: var(--col-background-tint-2);
  border: none;
  padding-bottom: calc(var(--tool-margin) + env(safe-area-inset-bottom));
  inset: auto 0 0 0;
}

#tools {
  display: flex;
  flex-direction: row;
  justify-content: center;

  button {
    position: relative;
    padding: 0.5rem;
    background-color: var(--col-background);
    border-radius: var(--button-radius);
    border: none;
    cursor: pointer;

    &:not(.transparent) {
      margin-right: 0.35rem;
    }

    /* Animation */
    /* transition: margin var(--interface-duration);
    transition-timing-function: var(--anim-bounce);
    pointer-events: none;
    margin-bottom: -3rem;
    visibility: hidden; */

    &.transparent {
      background-color: transparent;
    }

    &:hover {
      background-color: var(--col-highlight);
    }

    &.inactive {
      pointer-events: none;
    }

    i.icon {
      margin: 0;
      height: 1.5rem;
      aspect-ratio: 1;
    }
  }
}