How to add color to the numberbox

Hi all this is a simple devextreme code blocks.I want to create the numberbox border colour as red.can you help me how to perform that.

import React, { useState } from 'react';
import { NumberBox } from 'devextreme-react';

const MyNumberBox = () => {
  const [value, setValue] = useState(null);

  const handleValueChanged = (e) => {
    setValue(e.value);
  };

  const borderColor = value && value > 20 ? 'red' : ''; // Conditional border color

  return (
    <NumberBox
      value={value}
      showSpinButtons={true}
      onValueChanged={handleValueChanged}
      style={{ borderColor: borderColor }} // Apply inline style for border color
    />
  );
};

export default MyNumberBox;

I try to add style tag but it was not appearing.

import React, { useState } from 'react';
import { NumberBox } from 'devextreme-react';
import './sample.css';

const MyNumberBox = () => {
  const [value, setValue] = useState(null);

  const handleValueChanged = (e) => {
    setValue(e.value);
  };

  return (
    <NumberBox
      value={value}
      showSpinButtons={true}
      onValueChanged={handleValueChanged}
      className={value>20 && 'red-color'}
    />
  );
};

export default MyNumberBox;

Simply add a class to NumberBox with a condition when value > 20.

sample.css

.red-color{
  border-color: red;
}

You can achieve this with out any extra node to the DOM tree