/* One wide-alignment rule for both the frontend and editor. Use the actual
   capped width in the centering calculation, including inside narrow parents. */
.alignwide,
.is-layout-constrained > .alignwide,
.editor-styles-wrapper .alignwide {
  --mf-aligned-width: min(var(--mf-layout-wide-width, var(--mf-wide-width, 1300px)), calc(100vw - 2rem));
  width: var(--mf-aligned-width);
  max-width: var(--mf-layout-wide-width, var(--mf-wide-width, 1300px));
  margin-left: calc((100% - var(--mf-aligned-width)) / 2) !important;
  margin-right: calc((100% - var(--mf-aligned-width)) / 2) !important;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

/* The slot occupies the Group's available space. Its children, rather than
   the storage wrapper, participate in the surrounding reading-column layout. */
.mf-content-slot,
.editor-styles-wrapper .wp-block-modfarm-content-slot {
  width: 100%;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  min-width: 0;
}

.mf-content-slot > :where(:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright)),
.wp-block-modfarm-content-slot > .block-editor-inner-blocks > .block-editor-block-list__layout > :where(:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright)) {
  max-width: min(100%, var(--mf-layout-content-width, var(--wp--style--global--content-size, var(--mf-content-width, 1100px))));
  margin-left: auto;
  margin-right: auto;
}

/* Full remains viewport-wide, including through a slot's extra wrapper. */
.mf-content-slot > .alignfull,
.wp-block-modfarm-content-slot > .block-editor-inner-blocks > .block-editor-block-list__layout > .alignfull {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box;
}
