.product-test-reports {
  .lt-xxl({ .col-double-gutter; margin-left: 0; margin-right: 0; });

  margin-bottom: @default--space * 4;
  margin-top: @default--space * 4;

  .gt-md({ margin-bottom: @default--space * 6; margin-top: @default--space * 6; });

  &__report + &__report {
    margin-top: @default--space * 3;

    .gt-md({ margin-top: @default--space * 6; });
  }

  &__report:nth-of-type(n+4) {
    margin-top: 0;
    max-height: 0;
    opacity: 0;
    transform: translate(999rem);
    transition: opacity 0.5s ease-in;
  }

  &__header {
    .lt-md({ .h5; });

    .gt-md({ margin-bottom: @default--space * 2; });
  }

  &__report-content-wrapper {
    .gt-md({ .col-double-gutter-left; });

    &.open {
      .product-test-reports__report-body {
        height: auto;
        max-height: 250em;

        &:after {
          display: none;
        }
      }

      beyer-button.btn-more {
        display: none;
      }
      beyer-button.btn-less {
        display: initial;
      }
    }
  }

  &__report-additional-info {
    .p5;

    display: inline-block;
    margin-bottom: @default--space / 2;

    &__report-source,
    a {
      color: @champagne;
      text-transform: uppercase;
    }
  }

  &__report-additional-info-hyphen {
    margin: 0 (@default--space / 2);
  }

  &__report-title {
    .h6;

    .lt-md({ margin-bottom: @default--space; });

    .gt-md({ .h3; margin-bottom: @default--space / 2; });
  }

  &__report-body {
    margin-bottom: @default--space;
    max-height: 5em;
    min-height: 5em;
    overflow: hidden;
    position: relative;
    transition: max-height 0.5s ease-in-out;

    &:after {
      background: linear-gradient(to left, rgba(255, 255, 255, 1) 1.25em, rgba(255, 255, 255, 0) 2.5em);
      bottom: 0;
      content: "\2026";
      height: 1.2em;
      position: absolute;
      right: 0;
      text-align: right;
      width: 100%;
    }

    p {
      .p4;

      margin: 0;
    }
  }

  &__report-image-wrapper {
    .gt-md({ .col-double-gutter-right; });

    img {
      .responsive-image();
    }
  }

  &__report-footer {
    button {
      margin-left: 0;
    }
  }

  &__more-reports-trigger {
    .visually-hidden();

    &:checked {
      & ~ .product-test-reports__report {
        max-height: 100%;
        opacity: 1;
        transform: translate(0);

        margin-top: @default--space * 3;

        .gt-md({ margin-top: @default--space * 6; });
      }

      + .product-test-reports__more-reports-trigger-label {
        display: none;
      }
    }
  }

  &__more-reports-trigger-label {
    .p4;

    cursor: pointer;
    display: inline-block;
    left: 50%;
    margin-top: @default--space * 3;
    position: relative;
    text-transform: uppercase;
    transform: translateX(-50%);

    .gt-md({ margin-top: @default--space * 6; });
  }

  beyer-button.btn-less {
    display: none;
  }
}