.wp-block-responsive-block-editor-addons-shape-divider {
  display: flex;
  flex-direction: column;
  position: relative;

  svg {
    bottom: -1px; // Add a tiny bit of overlap so that there's not a line divider
    fill: currentColor;
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
  }

  &__svg-wrapper {
    position: relative;
  }

  &__alt-wrapper {
    background-color: currentColor;
  }

  &.is-horizontally-flipped svg {
    transform: scaleX(-1);
  }

  &.is-vertically-flipped {
    flex-direction: column-reverse;

    svg {
      bottom: 0;
      top: -1px; // Add a tiny bit of overlap so that there's not a line divider
      transform: scaleY(-1);
    }

    &.is-horizontally-flipped svg {
      transform: scaleX(-1) scaleY(-1);
    }
  }

  // Styling particular to the waves divider.
  .divider--waves {
    path:nth-child(1) {
      opacity: 0.15;
    }

    path:nth-child(2) {
      opacity: 0.3;
    }
  }
}

.page-template-gutenberg-fullwidth.responsive-site-style-boxed
  .hentry
  .post-entry
  > div.wp-block-responsive-block-editor-addons-shape-divider {
  padding: 0 !important;
}

.page.page-template-gutenberg-fullwidth,
.page.page-template-full-width-page,
.page.sidebar-position-no:not(.woocommerce) {
  .wp-block-cover.alignfull
    .wp-block-cover__inner-container
    .wp-block-responsive-block-editor-addons-shape-divider.alignfull {
    max-width: 100vw;
  }
}

.wp-block-responsive-block-editor-addons-shape-divider__svg-wrapper svg {
  height: 100%;
  width: 100%;
}

.page.page-template-gutenberg-fullwidth,
.page.page-template-full-width-page,
.page.sidebar-position-no:not(.woocommerce) {
  .wp-block-cover.alignwide .wp-block-cover__inner-container {
    .wp-block-responsive-block-editor-addons-shape-divider.alignfull,
    .wp-block-responsive-block-editor-addons-shape-divider.alignwide {
      margin-left: 0;
      margin-right: 0;
    }
  }
}