CSS with object Multi KPI

[jmialoundama]

Hello,

I am using Qlik Sense multi KPI object.

Here is my CSS code:

& *{
border-width: 2px;
border-color: #E6E6EF;
}

& .label * {
font-family: 'Calibri';
font-size: 150%;
}

& .statistic-1 .value * {
font-family: 'Calibri';
font-size: 150%;
}

& .value * {
font-family: 'Calibri';
font-size: 90%;
}

I have 4 squares. I want to put a conditional color on each of the squares.
How can I achieve it in CSS.

Here are the colors I want to use:
If Alert then green
If Critical then red
If command to launch then Orange
Otherwise Grey.

Thanks in advance 🙂

[Sylvain1]

Thanks DeepanshuSh

Unfortunatly I choose multikpi instead of KPI to regroup them into only one object.

For now I did not find any solution so I kept several KPI object to do it.

Thanks for your help.