@use '../../sass/abstracts' as *;

#{$component-prefix}accordion {
  width: 100%;
  border-bottom: 1px solid $sodra-black;
  &__heading {
    @include headline-small;
    position: relative;
    line-height: 4.5rem;
    border-top: 1px solid $sodra-black;
    white-space: nowrap;

    th {
      text-align: left;
    }
  }

  &__heading-sort-column {
    position: relative;
    cursor: pointer;

    &:after {
      @include unity-symbols('keyboard-arrow-down', 0.75rem);
      margin-left: 0.5rem;
    }

    &[aria-sort='ascending'] {
      &:after {
        @include unity-symbols('keyboard-arrow-up', 0.75rem);
      }
    }
  }

  &__item {
    position: relative;
    border-top: 1px solid $sodra-black;
    line-height: 4.5rem;
    white-space: nowrap;
  }

  &__trigger {
    @include headline-small;
    text-align: right;
    cursor: pointer;

    &:after {
      @include unity-symbols('add-circle', 1.5rem);
    }
  }

  &__item[aria-expanded='true'] &__trigger {
    &:after {
      content: '\0059'; // remove circle
    }
  }

  &__panel-content {
    @include body-large;
    height: 0;
    overflow: hidden;
  }

  &__panel[aria-hidden='false'] &__panel-content {
    height: auto;
    padding-bottom: 1rem;
  }

  &__heading,
  &__item,
  &__panel {
    td:not(:first-child):not(:last-child),
    th:not(:first-child):not(:last-child) {
      padding: 0 1rem;
    }
  }
}