.code-input {
    > form, > div {
      display: flex;
      .code-input-field {
        flex: 1;
      margin-left: $spacing-xxsmall;
      margin-right: $spacing-xxsmall;
      text-transform: uppercase;
      text-align: center;
      padding: 0;
      height: 49px;
      line-height: 49px;
      margin-bottom: 10px;

      &:nth-of-type(1) {
        margin-left: 0;
      }

      &:last-of-type {
        margin-right: 0;
      }
      font-family: Courier New, Courier, monospace;
      font-weight: bold;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    &.invalid input {
      border-color: #e30b17;
    }
  }
}