Change my personal scss variable from another scss file

hello,

i am unable to change shared css variable defined in theme/variable.css from an .scss file component.

in theme/variables.css i defined :
$need-background:false;

in app.scss

@import "../theme/variables";
@if need-background{
background-image:url('../assets/imgs/logos/logo_22.PNG');
background-repeat:no-repeat;
background-position:center;
margin-top:24%;
}

in component.scss :

@import "../../theme/variables";
$need-background:false;

finally in my component, i have always background image displayed.

someone know why ?