.dnb-forms-field-number {
  --number-control-separator-color: var(
    --number-control-separator-color--default
  );
  --number-control-separator-color--default: var(
    --token-color-background-action-hover-subtle
  );
  --number-control-separator-color--error: var(
    --token-color-component-button-background-action-destructive-hover-subtle
  );
  --number-control-separator-color--disabled: var(
    --token-color-background-action-disabled
  );
  --number-control-button-border-width--focus: var(--focus-ring-width);
}
.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
  --button-height--small: 2.5rem;
  --button-width--small: 2.5rem;
}
.dnb-forms-field-number__contents--has-controls .dnb-input {
  position: relative;
}
.dnb-forms-field-number__contents--has-controls .dnb-input::before, .dnb-forms-field-number__contents--has-controls .dnb-input::after {
  content: "";
  position: absolute;
  top: 0.25rem;
  bottom: 0.25rem;
  border-left: 1px solid var(--number-control-separator-color);
  z-index: 1;
}
.dnb-forms-field-number__contents--has-controls .dnb-input::before {
  left: -1px;
}
.dnb-forms-field-number__contents--has-controls .dnb-input::after {
  right: -1px;
}
.dnb-forms-field-number__contents--has-controls .dnb-input__border--root {
  --input-border-radius--default: var(--input-border-radius--active);
}
.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:not(:disabled):active ~ .dnb-input::before {
  z-index: -1;
}
.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:not(:disabled):active {
  z-index: 1;
}
.dnb-forms-field-number__contents.dnb-input__status--error {
  --number-control-separator-color: var(
    --number-control-separator-color--error
  );
}
.dnb-forms-field-number__contents.dnb-input--disabled {
  --number-control-separator-color: var(
    --number-control-separator-color--disabled
  );
}