.#{$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 $segment-line-color;
      position: relative;
    }
    .#{$accordion-prefix-cls}__header>span{
      flex: 1;
      @extend %text-truncate;
    }
    .#{$accordion-prefix-cls}__header>i{
      width: $accordion-header-icon-font-size;
      font-size: $accordion-header-icon-font-size;
      color: $gray-11;
      margin-right: .10rem;
      transition: transform .3s;
    }

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

    &--active {
      &>.accordion__header>i {
        color: $gray-10;
        transform: rotate(90deg);
      }
      .#{$accordion-prefix-cls}__content {
        display: block;
        border-bottom: $border-width-sm solid $segment-line-color;
      }
    }
  }

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