.custom-modal-layout {
  &.base-modal-layout {
    max-width: 1254px;
    min-width: 510px;
    border-radius: var(--wds-custom-modal-border-radius, var(--wds-border-radius-400, 8px));
  }

  &:not(&--remove-content-padding) .base-modal-layout-content__inner-content {
    padding-inline-start: var(--wds-custom-modal-content-padding-horizontal, var(--wds-space-400, 24px));
    padding-inline-end: var(--wds-custom-modal-content-padding-horizontal, var(--wds-space-400, 24px));
  }

  &:not(&--remove-content-padding)#{&}--show-header-divider
    .base-modal-layout-content__inner-content {
    padding-top: var(--wds-custom-modal-content-padding-vertical, var(--wds-space-400, 18px));
  }

  &:not(&--remove-content-padding)#{&}--show-footer-divider
    .base-modal-layout-content__inner-content {
    padding-bottom: var(--wds-custom-modal-content-padding-vertical, var(--wds-space-400, 18px));
  }

  .base-modal-layout-header__inner-content {
    padding-top: var(--wds-custom-modal-header-padding-vertical, var(--wds-space-300, 18px));
    padding-bottom: var(--wds-custom-modal-header-padding-vertical, var(--wds-space-300, 18px));
    padding-inline-start: var(--wds-custom-modal-header-padding-left, var(--wds-space-400, 24px));
  }

  &.base-modal-layout--control-button-amount-0
    .base-modal-layout-header__inner-content {
    padding-inline-end: var(--wds-custom-modal-header-padding-right, var(--wds-space-200, 24px));
  }

  &.base-modal-layout--control-button-amount-1
    .base-modal-layout-header__inner-content {
    padding-inline-end: calc(
      var(--wds-custom-modal-header-padding-right, var(--wds-space-200, 24px)) +
        var(--wds-custom-modal-close-button-size, var(--wds-space-500, 24px))
    );
  }

  &.base-modal-layout--control-button-amount-2
    .base-modal-layout-header__inner-content {
    padding-inline-end: calc(
      var(--wds-custom-modal-header-padding-right, var(--wds-space-200, 24px)) +
        var(--wds-custom-modal-close-button-size, var(--wds-space-500, 24px)) +
        var(--wds-space-50, calc(var(--wds-space-100, 6px) * 1)) + 24px
    );
  }

  .base-modal-layout__close-button[data-skin='dark'][data-size='large'] {
    width: var(--wds-custom-modal-close-button-size, var(--wds-space-500, 30px));
    height: var(--wds-custom-modal-close-button-size, var(--wds-space-500, 30px));
    background-color: var(--wds-custom-modal-close-button-fill, transparent);

    svg {
      width: var(--wds-custom-modal-close-button-icon-size, var(--wds-space-200, 12px));
      height: var(--wds-custom-modal-close-button-icon-size, var(--wds-space-200, 12px));
    }
  }

  &#{&}.base-modal-layout .base-modal-layout-header__subtitle {
    font-size: var(--wds-custom-modal-header-subtitle-font-size, var(--wds-font-size-body-medium, var(--wsr-text-font-size-medium, 16px)));
    line-height: var(--wds-custom-modal-header-subtitle-font-line-height, var(--wds-font-line-height-body-medium, var(--wsr-text-line-height-medium, 24px)));
  }

  .base-modal-layout-footer__inner-content {
    padding: var(--wds-custom-modal-footer-padding-vertical, var(--wds-space-300, 18px))
      var(--wds-custom-modal-footer-padding-horizontal, var(--wds-space-400, 24px));
  }

  .base-modal-layout-footnote__inner-content {
    justify-content: flex-start;
  }

  .base-modal-layout-content__inner-content {
    flex: 1;
  }

  .base-modal-layout-content {
    flex: 1;
  }
}