.a_form_element_number_controls {
  --a_input_number_width: 100%;
  --a_input_number_max_width: 100%;
  --a_input_number_min_width: 6.25rem;

  display: flex;
  align-items: stretch;
  .a_btn_group {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    background-color: #fff;
    > .a_btn {
      --a_btn_border_color: #ced4da;
      &:first-child {
        margin-left: calc(-1 * var(--a_btn_border_width, var(--a_border_width)));
      }
      &:not(:last-child) {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
      }
    }
  }
  .a_input_number {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    height: 100%;
    line-height: 1;
  }
}

.a_form_element_number {
  display: flex;
  align-items: stretch;
  .a_form_element {
    width: var(--a_input_number_width);
    max-width: var(--a_input_number_max_width);
    min-width: var(--a_input_number_min_width);
    z-index: 1;
  }

  .a_form_element_number__currency_symbol {
    display: flex;
    align-self: center;
    margin: 0 0.5rem;
  }
}

.a_form_element__parent_invalid {
  .a_form_element_number_controls .a_btn_group > .aloha_btn {
    --a_btn_border_color: var(--a_form_element_error_color);
  }
}

.a_input_number {
  -webkit-appearance: none;
  -moz-appearance: textfield;
  &::-webkit-inner-spin-button,
  &::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
  }
}
