.accordion {
  a {
    text-decoration: underline;
  }

  .link-list__link {
    @include font-style(
      $accordion-link-list-link-font-style,
      $accordion-link-list-link-font-style--l
    );
    cursor: pointer;
    padding-right: 50px;
  }

  .collapsible__content {
    &,
    p {
      @include font-style('body--m', 'body--l');
    }

    &--wrapper {
      margin-bottom: $spacing--s;
    }
  }

  .toggle-arrow {
    pointer-events: none;
    top: 20px;

    .data-table &,
    .navigation-accordion & {
      right: 0;
    }
  }
}
// small
.accordion--s {
  .link-list__link {
    @include font-style('body--l');
  }
}

// viewport s - m
@include viewport--l('inversed') {
  .accordion .collapsible__button {
    &,
    &::before,
    &::after {
      width: 18px;
    }
  }
}
// viewport l
@include viewport--l {
  .accordion {
    .link-list__link {
      padding-right: 75px;
    }

    .collapsible__trigger .toggle-arrow.icon {
      top: 22px;
    }

    .collapsible__button {
      height: $icon-size--l;
      top: $baseline * 2.6;

      &,
      &::before,
      &::after {
        width: 26px;
      }
    }

    .collapsible__content {
      padding-right: 75px;

      &--wrapper {
        margin-bottom: $spacing--m;
      }
    }
  }
  @include link-list-background-mapping;
}
