¿Cómo puedo cambiar el estilo de un componente secundario del que no tengo control?

Sé sobre overrides pero no puedo ver cómo usarlo aquí.

Por ejemplo

 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> ) } }

Al usar este elemento, sin cambiar nada de su propio código fuente, ¿cómo puedo cambiar su estilo?

 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 /> ) } }