.fade {
  @include transition($transition-fade);

  &:not(.show) {
    opacity: 0;
  }
}

.collapse {
  visibility: hidden;

  &.show {
    // display: block;
    visibility: visible;
  }

  &:not(.show) {
    display: none;
  }
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  @include transition($transition-collapse);

  &.collapse-horizontal {
    width: 0;
    height: auto !important; // stylelint-disable-line declaration-no-important
    @include transition($transition-horizontal-collapse);
  }
}