$white: #fff;
$dark-gray-500: #9E9E9E;
.wp-block[data-align="center"] > .wp-block-button {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.wp-block[data-align="right"] > .wp-block-button {
  /*!rtl:ignore*/
  text-align: right;
}

.wp-block-button {
  position: relative;
  cursor: text;

  // Make placeholder text white unless custom colors or outline versions are chosen.
  &:not(.has-text-color):not(.is-style-outline) [data-rich-text-placeholder]::after {
    color: $white;
  }

  // Add outline to button on focus to indicate focus-state
  &:focus {
    box-shadow: 0 0 0 1px $white, 0 0 0 3px var(--wp-admin-theme-color);

    // Windows' High Contrast mode will show this outline, but not the box-shadow.
    outline: 2px solid transparent;
    outline-offset: -2px;
  }

  // Increase placeholder opacity to meet contrast ratios.
  &[data-rich-text-placeholder]::after {
    opacity: 0.8;
  }
}

.wp-block-button__inline-link {
  color: $dark-gray-500;
  height: 0;
  overflow: hidden;
  max-width: 290px;

  &-input__suggestions {
    max-width: 290px;
  }

  .is-selected & {
    height: auto;
    overflow: visible;
  }
}

// Display "table" is used because the button container should only wrap the content and not takes the full width.
div[data-type="core/button"] {
  display: table;
}
 
/**
 * Note that these styles are loaded *after* common styles, so that
 * editor-specific styles using the same selectors will take precedence.
 */
.editor-styles-wrapper .is-style-text .wp-block-button__link {
  background-color: transparent;
  border-color: transparent;
  color: #cd2653;
  padding: calc(1.1em - 2px) calc(1.44em - 2px);
}

.editor-styles-wrapper .is-style-outline .wp-block-button__link {
  background-color: transparent;
  border-color: #000000;
  color: #cd2653;
}
.editor-styles-wrapper .wp-block.wp-block-buba-blocks-button{
  margin-left: 0;
  margin-right: 0;
  display: flex;

  &.align-button{
    &-left{
      margin-right: auto;
      margin-left: 0;
    }
    &-right{
      margin-left: auto;
      margin-right: 0;
      justify-content: flex-end;
    }
    &-center{
      margin-right: auto;
      margin-left: auto;
      justify-content: center;
    }

  }
}