How can I change inputs focus styles?

Change focus styles of a single input

To change focus styles of a single input, use Styles API. Note that in order for this to work correctly with all inputs, you need to use :focus-within pseudo-class instead of :focus:

.input {
  &:focus-within {
    outline: rem(2px) solid var(--mantine-primary-color-filled);
  }
}

Change focus styles of all inputs

To change focus styles of all inputs, use Styles API with Input component in the theme object:

.input {
  &:focus-within {
    outline: rem(2px) solid var(--mantine-primary-color-filled);
  }
}