.#{$accordion-prefix-cls} {
  position: relative;

  &__item {
    .#{$accordion-prefix-cls}__header {
      display: flex;
      height: $list-item-height;
      padding: 0 $list-item-padding-x;
      line-height: $list-item-height;
      color: $gray-9;
      background-color: $white;
      border-bottom: $border-width-sm solid $gray-12;

      span {
        flex: 1;
        @extend %text-truncate;
      }

      i {
        font-size: $accordion-header-icon-font-size;
        color: $gray-11;
      }
    }

    .#{$accordion-prefix-cls}__content {
      // display: none;
      overflow: hidden;
      background-color: $white;
      transition: max-height .3s;
    }

    &--active {
      .accordion__header i {
        color: $brand-primary;
        transform: rotate(180deg);
      }
      .#{$accordion-prefix-cls}__content {
        display: block;
        border-bottom: $border-width-sm solid $gray-12;
      }
    }
  }

  .#{$list-prefix-cls}__body {
    border-top: 0;
    border-bottom: 0;
  }
}
