// variables
$button-border-radius: 4px;
$button-padding: 8px 16px;
$button-min-width: 5.14em;

// mixins
@mixin button-styles {
  min-width: $button-min-width !important;
  border-radius: $button-border-radius !important;
  padding: $button-padding !important;
  align-items: center;
  justify-content: center;
  text-align: center;

  font-weight: 500 !important;

  transition-property: background-color !important;
  transition-duration: get-var("medium-short-duration") !important;
  transition-timing-function: get-var("fast-invoke") !important;
}

@mixin primary-button-styles {
  border: none !important;
  color: get-var("text-on-accent") !important;
  background-color: get-var("accent-color") !important;

  &:not(.disabled, :disabled, [disabled]):hover {
    background-color: get-var("accent-color-hover") !important;
  }

  &:not(.disabled, :disabled, [disabled]):hover:active {
    background-color: cm(
      transparent,
      get-var("accent-color-hover"),
      0.8
    ) !important;
  }
}

@mixin secondary-button-styles {
  color: get-var("secondary-button-text") !important;
  background-color: transparent !important;
  border: 1px solid !important;
  // border-color: get-var("menu-border-color") !important;
  border-color: var(--in-content-box-border-color) !important;

  &:not(.disabled, :disabled, [disabled]):hover {
    background-color: get-var("accent-color-transparent") !important;
  }

  &:not(.disabled, :disabled, [disabled]):hover:active {
    background-color: get-var("accent-color-transparent-active") !important;
  }
}

// styles
:not(dialog, .dialogBox) {
  :not(button-group) > button {
    &:is(
        [accesskey],
        .accessory-button,
        [dlgtype="cancel"],
        [autofocus],
        [default],
        .primary,
        .primary-button,
        .popup-notification-primary-button,
        .disco-cta-button,
        [data-l10n-id="translations-manage-language-download-button"]
      ):not(button[type="menu"]),
    [type="submit"] {
      @include button-styles;
    }

    // Secondary buttons
    &:is(
        [accesskey],
        .accessory-button,
        [dlgtype="cancel"],
        .disco-cta-button,
        [data-l10n-id="translations-manage-language-download-button"]
      ):not(button[type="menu"]) {
      @include secondary-button-styles;
    }

    // Primary buttons
    &:is(
        [autofocus],
        [default],
        .primary,
        .primary-button,
        .popup-notification-primary-button
      ):not(button[type="menu"]),
    [type="submit"] {
      @include primary-button-styles;
    }

    &:not(.disabled, :disabled, [disabled]) {
      cursor: pointer;
    }
  }
}
