.disclosure {
  margin: 12px 0;
  cursor: pointer;
  font-size: 14px;

  & > details[open] > summary {
    &::before {
      background-image: url("images/icons/collapse.svg");
    }
  }

  &__summary {
    position: relative;
    padding-left: 24px;
    padding-bottom: 10px;

    &::-webkit-details-marker,
    &::marker {
      display: none;
      content: "";
    }

    &::before {
      position: absolute;
      content: " ";
      flex: 0 0 auto;
      height: 16px;
      width: 16px;
      background-image: url("images/icons/expand.svg");
      background-size: contain;
      background-repeat: no-repeat;
      cursor: pointer;
      left: 0;
      top: 2px;
    }
  }

  &__content {
    margin-left: 12px;
    font-size: 14px;

    &.small {
      font-size: 12px;
    }
  }
}
