@mixin accordion-label-active {
  background: $tab-nav-active-background;
  border: $tab-nav-active-border;
  color: $tab-nav-active-color;
  box-shadow: $tab-nav-active-shadow;
  .#{$accordion-arrow} {
    @include accordion-arrow-up;
  }
}

@mixin accordion-arrow-down {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid currentColor;
}

@mixin accordion-arrow-up {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid currentColor;
  border-top: 0 none;
}

.#{$accordion} {
  > label, .#{$accordion-label} {
    display: block;
    line-height: 2.5 * $body-font-size;
    padding: 0 1.1em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
    background: #ccc;
    color: inherit;
    text-decoration: none;
    position: relative;
    .#{$accordion-arrow} {
      width: 0; 
      height: 0; 
      color: inherit;
      position: absolute;
      right: 1.1em;
      top: 0;
      bottom: 0;
      margin: auto;
    }
  }
}