Alterar cor de fundo e fonte nas etiquetas de desconto

Boa noite a todos. Gostaria de saber como é possível alterar a cor das etiquetas de promoção na loja sem ter que alterar a cor padrão de fundo escolhida. Precdiso destacar melhor esta etiqueta mas a única forma que encontrei foi alterando as cores da loja inteira, porém no meu caso isso faz com que minha identidade visual seja perdida. A solução neste caso seria alterar via código somente a cor das etiquetas

Loja
www.vannik.com.br

@Vannik

/* Cores Bandeira Desconto /
.bandeiras-produto span {
color: black; /
cor do 9% de desconto*/
border: 1px solid red; /* cor borda /
background-color: lightblue; /
cor fundo */
}

Excelente amigo!!! Muito Obrigado!

@Vannik Dinada Amigo, precisa de mais alguma coisa so chamar…

Não quero abusar mas agora preciso alterar meu popup de boas vindas. ele esta padrão e gostaria de personaliza-lo. Você conhece algum artigo para eu estudar?

Mais uma ves obrigado.

Chefe, fiz isso no meu e não aconteceu nada! Me ajuda? :grin:

Tenta esse:

/Altera bandeira desconto/

.bandeiras-produto .bandeira-promocao {
display: inline-block;
padding: 0px 6px;
line-height: 21px;
color: RGB(255, 255, 255);
text-transform: uppercase;
font-size: 11px;
font-weight: 600;
margin: 0px 3px 3px 0;
border-radius: 5px 15px 15px 5px;
box-shadow: none;
border: none;
box-sizing: border-box;
white-space: nowrap;
background-image: linear-gradient(to right, rgb(209, 70, 70), rgb(238, 35, 35));
}

.bandeiras-produto .bandeira-frete-gratis {
display: inline-block;
padding: 0px 6px;
line-height: 21px;
color: RGB(255, 255, 255);
text-transform: uppercase;
font-size: 11px;
font-weight: 600;
margin: 0px 3px 3px 0;
border-radius: 5px 15px 15px 5px;
box-shadow: none;
border: none;
box-sizing: border-box;
white-space: nowrap;
background-image: linear-gradient(to right, rgb(70, 136, 71), rgb(63, 186, 65));
}
/Altera bandeira desconto/

1 Curtida

/* Cores Bandeira Desconto /
.bandeiras-produto span {
color: #fff; /
cor do 9% de desconto*/
border: 1px solid #fff; /* cor borda /
background-color: #000; /
cor fundo */
}

.listagem .bandeiras-produto .bandeira-carrinho {
background-color: #000;
}

Com esses consegui editar a bandeira do produto e do produto adicionado ao carrinho, agora vcs sabem como altera o nome que fica escrito dentro de cada uma? Achei pelo F12, porém só consegui alterar individualmente.