How can I change the style of a child component I don't have control of?

I know about overrides but I can't see how to use it here.

For example

const styles = StyleSheet.create({
  container: {
    backgroundColor: '#ff0000'
  },
  inner: {
    backgroundColor: '#00ff00',
    width: '50px',
    height: '50px',
    margin: '10px 10px'
  }
})

class Child extends Component {
  render() {
    return (
      <div className={styles.container}>
        <div className={styles.inner}></div>
      </div>
    )
  }
}

When using this element, without changing any of its own source code, how can I change its styling?

const desiredStylesOfChild = StyleSheet.create({
  container: {
    backgroundColor: '#012345'
  },
  inner: {
    backgroundColor: '#abcdef',
    width: '50%',
    height: '50%',
    margin: '10% 10%'
  }
})

class Parent extends Component {
  render() {
    return (
      <h1>Something something</h1>
      <Child />
    )
  }
}