.text-image--image-left,
.text-image--image-right {
  display: flex;
}

.text-image--image-left .text-image__image,
.text-image--image-right .text-image__image {
  flex: 0 0 100%;
}

.text-image--image-left .text-image__content,
.text-image--image-right .text-image__content {
  flex: 1 1 auto;
}

/* Left (default) */
.text-image--image-left .text-image__content {
  @media (--screensMedium) {
    padding-left: var(--spacingLarge);
  }
}

.text-image--image-left {
  flex-wrap: wrap;

  @media (--screensMedium) {
    flex-wrap: nowrap;
  }
}

/* Right */
.text-image--image-right .text-image__content {
  order: 1;

  @media (--screensMedium) {
    padding-right: var(--spacingLarge);
  }
}

.text-image--image-right .text-image__image {
  order: 2;
}

.text-image--image-right {
  flex-wrap: wrap;

  @media (--screensMedium) {
    flex-wrap: nowrap;
  }
}

/* Top */
.text-image--image-top .text-image__content {
  margin-top: var(--spacingLarge);
}

/* Bottom */
.text-image--image-bottom {
  display: flex;
  flex-wrap: wrap;
}

.text-image--image-bottom .text-image__content {
  width: 100%;
  order: 1;
  margin-bottom: var(--spacingLarge);
}

.text-image--image-bottom .text-image__image {
  width: 100%;
  order: 2;
}

/* Content alignment */

.text-image--content-left {
  text-align: left;
}

.text-image--content-center {
  text-align: center;
}

.text-image--content-center .text-image__image {
  margin: 0 auto;
}

.text-image__svg {
  & svg {
    width: 100%;
  }
}

.text-image__svg-top-center {
  margin: auto;
}

.text-image__hide-on-mobile {
  @media (--maxScreenSM) {
    display: none;
  }
}