.bbd-product-detail-row__header {
  padding-block: var(--padding-2xl);
}

.bbd-product-detail-row__column {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-lg);
  grid-column-end: span 2;

  @media screen and (min-width: 750px) {
    grid-column-end: span 6;
  }
}

.bbd-product-detail-row__title {
  margin-block: 0;
  font-size: var(--font-size--2xl);
  grid-column-end: span 10;

  @media screen and (min-width: 750px) {
    font-size: var(--font-size--3xl);
    grid-column-end: span 6;
  }

  @media screen and (min-width: 990px) {
    font-size: var(--font-size--5xl);
  }
}

.bbd-product-detail-row__preview {
  display: none;

  @media screen and (min-width: 990px) {
    display: block;
  }
}

.bbd-product-detail-row__icon.svg-wrapper {
  margin-inline-start: auto;
  width: var(--icon-size-lg);
  height: var(--icon-size-lg);

  svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }

  @media screen and (min-width: 750px) {
    width: var(--icon-size-xl);
    height: var(--icon-size-xl);

    svg {
      width: var(--icon-size-lg);
      height: var(--icon-size-lg);
    }
  }
}

.bbd-product-detail-row__content {
  grid-column: 1 / -2;
  padding-block-end: var(--padding-4xl);

  @media screen and (min-width: 990px) {
    grid-column: 7 / -2;
  }
}

.bbd-product-detail-row {
  &:not([open]) .icon-minus {
    display: none;
  }

  &[open] {
    .icon-plus {
      display: none;
    }

    .bbd-product-detail-row__preview {
      display: none;
    }

    .details-content {
      overflow: visible;

      @media screen and (min-width: 990px) {
        margin-block-start: -60px;
      }
    }
  }
}