.js-show-hide {
  position: relative;
}

.js-show-hide__toggle {
  position: relative;
  cursor: pointer;
}

.js-show-hide__toggle::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: -28px;
  top: 6px;
  color: var(--color-primary);
  border-right: 8px solid transparent;
  border-top: 8px solid transparent;
  border-left: 8px solid transparent;
  border-bottom: 8px solid currentColor;
  transition: transform .2s ease;
  transform-origin: 8px 12px;
}

.js-show-hide__target {
  transition: all .2s ease;
}

.js-show-hide--collapsed {

  .js-show-hide__toggle::before {
    transform: rotate(180deg);
  }

  .js-show-hide__target {
    display: block;
    height: 0;
    margin: 0;
    padding: 0;
    max-height: 0;
    overflow-y: hidden;
  }
}
