Overriding Ionic Sass Variables inside @media

Ionic Framework ionic-v3
1

Hello,

I have an issue when using $toolbar-background overriding ionic sass variables inside @media in variables.scss file
for example if i write

@media screen and (min-width: 360px) and (max-width : 550px) 
{
    $toolbar-background : red;
}

nothing change toolbar background still white color.
bit if i write

@media screen and (min-width: 360px) and (max-width : 550px)  {
     .toolbar-background 
    {
        background : red !important;
    }
}

its work 100% and toolbar background change to red color

any method to fix this issue using $toolbar-background instead of writing all css class.
thanks in advance.