_theme.scss

/*=============== THEME ===============*/
.change-theme{
    position: absolute;
    top: 1.5rem;
    right: 0;
    font-size: 1.25rem;
    color: var(--title-color);
    cursor: pointer;
    transition: .3s;

    &:hover{
        color: var(--first-color);
    }
}

/*========== Variables Dark theme ==========*/
body.dark-theme{
    --title-color: hsl(var(--hue), 12%, 95%);
    --text-color: hsl(var(--hue), 12%, 75%);
    --body-color: hsl(var(--hue), 40%, 8%);
    --container-color: hsl(var(--hue), 24%, 12%);
}

/*========== 
    Color changes in some parts of 
    the website, in light theme
==========*/

.dark-theme .button__gray{
    background-color: var(--container-color);

    &:hover{
        background-color: hsl(var(--hue), 24%, 16%);
    }
}

.dark-theme .filters__content{
    background-color: var(--container-color);
}

.dark-theme::-webkit-scrollbar{
    background-color: hsl(var(--hue), 8%, 16%);
}
.dark-theme::-webkit-scrollbar-thumb{
    background-color: hsl(var(--hue), 8%, 24%);
}
.dark-theme::-webkit-scrollbar-thumb:hover{
    background-color: hsl(var(--hue), 8%, 32%);
}