.product-information {
  gap: 16px 0;
}

/* Base grid layout */
.product-information__grid {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 2;
}

/* Default column positions */
.product-details {
  order: 1;
  min-width: 0;
  --gap: 16px;
}

.product-information__details-column {
  display: contents;
}

.product-information__media-column {
  display: contents;
}

.product-information__media {
  order: 0;
  width: 0;
  min-width: 100%;
}

.product-information__media .product-media-gallery__placeholder-image {
  width: 100%;
  height: 100%;
}

/* TD CHANGE START: Product-information benefits placement hooks */
.product-information__benefits {
  order: 2;
}

.product-information__complementary {
  order: 3;
}
/* TD CHANGE END: Product-information benefits placement hooks */

/* Mobile styles */
@media screen and (max-width: 749px) {
  .product-information__media {
    grid-column: 1 / -1;
  }

  .product-details {
    grid-column: 2 / 3;
  }

  .product-information .product-details > .group-block {
    padding-inline: 0;
  }

  .product-information .product-details .layout-panel-flex {
    gap: 16px;
  }

  /* TD CHANGE START: Place benefits below details on mobile */
  .product-information__benefits,
  .product-information__complementary {
    grid-column: 2 / 3;
  }
  /* TD CHANGE END: Place benefits below details on mobile */
}

/* Desktop styles */
@media screen and (min-width: 750px) {
  .product-information {
    gap: var(--gap) 0;
  }

  .product-information__media-column {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .product-information__media-column--sticky-desktop {
    position: sticky;
    top: var(--header-height, 0);
    align-self: flex-start;
  }

  .product-information__details-column {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .product-information__details-column > .product-details {
    order: 0;
  }

  .product-information__details-column > .product-information__complementary {
    order: 1;
  }

  .product-information__details-column--with-complementary > .product-details.sticky-content--desktop,
  .product-information__details-column--with-complementary > .product-details.sticky-content--desktop.full-height--desktop > .group-block {
    position: static;
    top: auto;
  }

  /* Position when there is no media */
  .product-information__grid.product-information--media-none {
    .product-information__details-column {
      width: var(--narrow-content-width);
      margin: 0 auto;
    }

    .product-information__benefits--standalone {
      width: var(--narrow-content-width);
      margin: 0 auto;
    }
  }

  /* Position when there is media */
  .product-information__grid:not(.product-information--media-none) {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;

    /* Media on the left side */
    &.product-information--media-left {
      .product-information__media-column {
        flex: 1 1 0;
        padding-right: calc(var(--gap, 0) / 2);
      }

      .product-information__details-column {
        flex: 0 0 min(50vw, var(--sidebar-width));
        padding-left: calc(var(--gap, 0) / 2);
      }
    }

    /* Media on the right side */
    &.product-information--media-right {
      .product-information__media-column {
        order: 1;
        flex: 1 1 0;
        padding-left: calc(var(--gap, 0) / 2);
      }

      .product-information__details-column {
        order: 0;
        flex: 0 0 min(50vw, var(--sidebar-width));
        padding-right: calc(var(--gap, 0) / 2);
      }
    }

    /* Equal width columns */
    &.product-information__grid--half,
    &.product-information__grid--half:has(.media-gallery--extend) {
      .product-information__media-column,
      .product-information__details-column {
        flex: 1 1 0;
      }

      &.product-information--media-left {
        .product-information__media-column {
          padding-right: calc(var(--gap, 0) / 2);
        }

        .product-information__details-column {
          padding-left: calc(var(--gap, 0) / 2);
        }
      }

      &.product-information--media-right {
        .product-information__media-column {
          order: 1;
          padding-left: calc(var(--gap, 0) / 2);
        }

        .product-information__details-column {
          order: 0;
          padding-right: calc(var(--gap, 0) / 2);
        }
      }
    }
  }

  /* Handle full width section */
  .section--full-width {
    .product-information__grid:not(.product-information--media-none) {
      &.product-information--media-left .product-information__details-column {
        padding-inline-end: var(--padding-lg);
      }

      &.product-information--media-right .product-information__details-column {
        padding-inline-start: var(--padding-lg);
      }

      &.product-information__grid--half.product-information--media-left {
        .product-information__media-column {
          padding-inline-start: var(--padding-lg);
        }

        .product-information__details-column {
          padding-inline-end: var(--padding-lg);
        }
      }

      &.product-information__grid--half.product-information--media-right {
        .product-information__media-column {
          padding-inline-end: var(--padding-lg);
        }

        .product-information__details-column {
          padding-inline-start: var(--padding-lg);
        }
      }
    }
  }
}

/* Wider sidebar for large screens */
@media screen and (min-width: 1200px) {
  .product-information__grid:not(
      .product-information__grid--half,
      .product-information--media-none
    ).product-information--media-left {
    .product-information__media-column {
      flex: 2 1 0;
    }

    .product-information__details-column {
      flex: 1 1 0;
    }
  }

  .product-information__grid:not(
      .product-information__grid--half,
      .product-information--media-none
    ).product-information--media-right {
    .product-information__media-column {
      flex: 2 1 0;
    }

    .product-information__details-column {
      flex: 1 1 0;
    }
  }
}

/* TD CHANGE START: Cap limited product details width to 30rem */
.product-information__grid--limit-details .product-details > .group-block {
  --details-max-width: 30rem;
  max-width: var(--details-max-width);
}

.product-information__grid--limit-details .product-information__complementary {
  --details-max-width: 30rem;
  max-width: var(--details-max-width);
}
/* TD CHANGE END: Cap limited product details width to 30rem */

@media screen and (min-width: 1600px) {
  .product-information__grid--limit-details .product-details > .group-block {
    --details-max-width: 36rem;
  }

  .product-information__grid--limit-details .product-information__complementary {
    --details-max-width: 36rem;
  }
}

/* If the header is sticky, make product details content stick underneath the header */
body:has(#header-group #header-component[data-sticky-state='active']) .product-details.sticky-content--desktop {
  --sticky-header-offset: var(--header-height);
}