@import "mixins/mixins";
@import "common/var";

@include b(partial-collapse) {
  position: relative;

  @include e(title) {
    cursor: pointer;
  }

  @include e(arrow) {
    position: absolute;
    top: 23px;
    right: 20px;
    z-index: 1;
    margin: 0 8px 0 auto;
    transition: transform .3s;
    font-weight: 300;
    cursor: pointer;
    &.is-active {
      transform: rotate(90deg);
    }
  }

  @include e(content--height) {
    transition: max-height 0.3s  ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out;
    overflow: hidden;
  }
}