How do I access the div root body from the react?

I have such a html project structure:

<div id="root">
   <div class="main-c container-fluid>
   </div>
   ...
<div>

My index.tsx:

import './index.css';
const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <HashRouter>
      <App />
    </HashRouter>
  </React.StrictMode>
);

app:

import "bootstrap/dist/css/bootstrap.min.css"
function App() { 
return (
    <Container className="main-c" fluid>
       ...
    </Container>
  );
}

And I don’t understand how to access the backgroud-color field from root?

That is, if i open the page elements in the browser, it shows that root has such a body css:

body {
    margin: 0;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

And here the background color has the color #fff, and I want to make #fff0. But how to access this field?

i tried:

index.css:

:root{
  background-color: #fff0;
}

But nothing happens. How to access this field?

I have tried all the options below:

body {
  background-color: #fff0;
}

#root{
  background:#fff0;
}

But none of them works. I.e.

color is still white.

>Solution :

if changing body color is the outcome you are looking for, this would work:

in src/index.css

body {
  background-color: #fff0;
}