/* The first photo shares the article column's left edge. alignleft alone uses the editor canvas. */
.is-layout-constrained > .wp-block-image.alignleft.aba-lead-photo,
.is-layout-flow > .wp-block-image.alignleft.aba-lead-photo,
.is-root-container > .wp-block-image.alignleft.aba-lead-photo,
.block-editor-block-list__layout > .wp-block-image.alignleft.aba-lead-photo,
.entry-content > .wp-block-image.alignleft.aba-lead-photo,
.wp-block-post-content > .wp-block-image.alignleft.aba-lead-photo,
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container > .wp-block-image.alignleft.aba-lead-photo,
.is-layout-constrained > .alignleft:has(> .aba-lead-photo),
.is-layout-constrained > [data-align="left"]:has(.aba-lead-photo),
.is-root-container > [data-align="left"]:has(.aba-lead-photo),
.editor-styles-wrapper .wp-block[data-align="left"]:has(.aba-lead-photo),
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container > .alignleft:has(> .aba-lead-photo) {
  display: block;
  float: left;
  width: 300px;
  max-width: min(300px, 46%);
  margin-top: 0.2em !important;
  margin-bottom: 0.85em !important;
  margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 100%)) / 2)) !important;
  margin-inline-start: max(0px, calc((100% - var(--wp--style--global--content-size, 100%)) / 2)) !important;
  margin-right: 1.35em !important;
  margin-inline-end: 1.35em !important;
}

/* Classic themes do not use the wrappers above. This matches the image itself. */
.wp-block-image.alignleft.aba-lead-photo {
  display: block;
  float: left;
  width: 300px;
  max-width: min(300px, 46%);
  margin-top: 0.2em;
  margin-bottom: 0.85em;
  margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 100%)) / 2));
  margin-inline-start: max(0px, calc((100% - var(--wp--style--global--content-size, 100%)) / 2));
  margin-right: 1.35em;
  margin-inline-end: 1.35em;
}

:is(.alignleft, [data-align="left"]) > .wp-block-image.aba-lead-photo {
  float: none;
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
}

.wp-block-image.aba-lead-photo img,
.wp-block-image.aba-article-photo img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.wp-block-image.aba-lead-photo img {
  max-height: 420px;
  object-fit: contain;
}

.wp-block-image.aba-article-photo,
.wp-block:has(> .wp-block-image.aba-article-photo) {
  clear: both;
  float: none;
}

@media (max-width: 700px) {
  .is-layout-constrained > .wp-block-image.alignleft.aba-lead-photo,
  .is-layout-flow > .wp-block-image.alignleft.aba-lead-photo,
  .is-root-container > .wp-block-image.alignleft.aba-lead-photo,
  .block-editor-block-list__layout > .wp-block-image.alignleft.aba-lead-photo,
  .entry-content > .wp-block-image.alignleft.aba-lead-photo,
  .wp-block-post-content > .wp-block-image.alignleft.aba-lead-photo,
  .editor-styles-wrapper .block-editor-block-list__layout.is-root-container > .wp-block-image.alignleft.aba-lead-photo,
  .is-layout-constrained > .alignleft:has(> .aba-lead-photo),
  .is-layout-constrained > [data-align="left"]:has(.aba-lead-photo),
  .is-root-container > [data-align="left"]:has(.aba-lead-photo),
  .editor-styles-wrapper .wp-block[data-align="left"]:has(.aba-lead-photo),
  .editor-styles-wrapper .block-editor-block-list__layout.is-root-container > .alignleft:has(> .aba-lead-photo) {
    float: none;
    display: block;
    width: min(100%, 420px);
    max-width: 100%;
    margin: 0 0 1em !important;
  }

  .wp-block-image.alignleft.aba-lead-photo {
    float: none;
    display: block;
    width: min(100%, 420px);
    max-width: 100%;
    margin: 0 0 1em;
  }
}
