.accordion {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  

  &__section {
	background-color: #fff;
    border-radius: $accordion-border-radius;
    box-shadow: $accordion-box-shadow;
  }

  &__section-active {
    .accordion__section-content {
      // content is visible
      transition: all 0.3s cubic-bezier(1, 0, 1, 0);
      max-height: 9999px;
      pointer-events: all;
    }
  }

  &__section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 3.2rem;
    cursor: pointer;

    input:checked ~ & {
      .accordion__plus-icon {
        transform: rotate(-180deg);
      }
    }
  }

  &__plus-icon {
    padding: 0;
    margin-top: 0;
    font-size: 2.4rem;
    color: $black;
    transition: all $transition-speed;
  }

  &__section-content {
    position: relative;
    transition: all 0.3s cubic-bezier(0, 1, 0, 1);
    max-height: 0;
    overflow: hidden;
    pointer-events: none;
	border-top: 1px solid $border-color;

    // content is visible
    input:checked ~ & {
      transition: all 0.3s cubic-bezier(1, 0, 1, 0);
      max-height: 9999px;
      pointer-events: all;

      .block-tabs__section-top {
        display: block;
      }
    }
  }

  &__section-content-inner {
    padding: 3.2rem;
  }
}
