Alterar icone p:toggle do DataTable - Primefaces [RESOLVIDO]

Front-end
, , , ,
#1

Bom dia.
Estou com um dúvida (dificuldade) com front-end.
Preciso alterar o ícone do p:toggle na DataTable do Primefaces.
Coloquei no meu arquivo CSS.

.ui-icon-circle-triangle-e{
background:
	url("#{resource['MINHA_IMAGEM']}")
	no-repeat !important;
height: 32px !important;
width: 32px !important;
}

.ui-icon-circle-triangle-s{
background:
	url("#{resource['MINHA_IMAGEM']}")
	no-repeat !important;
height: 32px !important;
width: 32px !important;
 }

o ícone aparece normal, o primeiro quando está encolhido e o segundo quando está expandido.

Porém, o ícone principal do Primefaces (aquela flechinha pequena pra esquerda e pra baixo respectivamente) não saí mesmo de jeito nenhum, ou seja, fica com os dois icones, o que coloquei e o nativo.

Alguém poderia me ajudar?

EXEMPLO

#2

Obrigado por nada,
Aos que passem por aqui e precisem depois de mim.

Alterei o css do tema, removi o icone padrão, alterando:

text-indent: 0px !important;

para

text-indent: none !important;

‘.ui-icon-circle-triangle-e’ e ‘ui-icon-circle-triangle-s’