Como customizar CSS de componente de front-end no Store Framework

[pedroLandim]

Olá Pessoal,

Estou com dificuldade de pegar uma classe de CSS para fazer a customização:

Já tentei dessa forma e não tive sucesso:

:global(.vtexventures-livestreaming-2-x-inputTextChat){
  border-radius: 20px 0 !important;
}

[georgebrindeiro]

Oi @pedroLandim, tudo bem? Você já deu uma lida nessa documentação?

Using CSS Handles for store customization

Acho que ajudaria ler isso, levando em consideração os CSS Handles compartilhados na documentação do app de Live Shopping:

Live Shopping

Outros pontos para me ajudar a te ajudar:

• Você consegue compartilhar o link do workspace que está usando para fazer essa customização?
• Em que arquivo você colocou o código CSS que compartilhou acima?
• Você está apenas tentando mudar o border-radius desse elemento?
• Pode mandar um screenshot de como está e o resultado final que você quer obter, talvez só editando pelo Chrome DevTools memso?

[pedroLandim]

Ola @georgebrindeiro, tudo certo.

Estou tentando mudar apenas o border-radius(por enquanto), coloquei no arquivo vtex.store-components.css

[georgebrindeiro]

Então, seguindo a documentação que eu apontei acima, você deveria colocar essas informações no arquivo vtexventures.livestreaming.css e usar preferencialmente um dos CSS handles indicados na documentação.