/*
  We only have full align, make the editor always full width
*/
.wp-block-acf-text-with-media {
  width: 100% !important;
  max-width: 100% !important;
}

.text-with-media .inner {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: 100%;
    max-width: var(--wp--style--global--wide-size);
    margin-left: auto;
    margin-right: auto;
  }

  .text-with-media .column {
    width: 100%;
  }

  .text-with-media .column.content {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
    padding-top: 1.5rem;
  }

  .text-with-media .column.content p {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .text-with-media .media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    max-height: 30rem;
    object-fit: cover;
    overflow: hidden;
  }

  .text-with-media .column.content .button-wrapper {
    padding: 0 !important;
  }

  .text-with-media--blue {
    background-color: var(--wp--preset--color--light-blue);
  }

  @media (min-width: 1180px) {
    .text-with-media .inner {
        column-gap: 2rem;
        width: 100%;
    }

    .text-with-media .column.content {
      max-width: calc(60% - 1rem);
      padding-top: 0;
    }

    .text-with-media .column.media {
      max-width: calc(40% - 1rem);
    }

    .text-with-media .content {
      margin-top: auto;
      margin-bottom: auto;
    }

    .text-with-media .column.content {
      justify-content: center;
    }

    .text-with-media--image-left .inner {
      flex-direction: row;
    }
    .text-with-media--image-right .inner {
        flex-direction: row-reverse;
    }

    .text-with-media--image-left .media {
      display: flex;
      justify-content: flex-start;
    }

    .text-with-media--image-right .media {
      display: flex;
      justify-content: flex-end;
    }

    .text-with-media .media img {
      display: block;
      width: 100% !important;
      height: 40rem !important;
      max-height: 40rem !important;
      object-fit: cover;
      overflow: hidden;
    }
  }