@mixin icon($size){
    display: inline-block;
    width: $size;
    height: $size;

    svg {
        width: 100%;
        height: 100%;
    }
}


@mixin chart-edit($size){
    width: $size;
    height: $size;

    svg {
        width: 100%;
        height: 100%;

        circle{
            fill: #efefef;
        }

        .filled{
            fill: var(--color-orange-medium);
        }

        .verified{
            fill: var(--color-green);
        }
    }
}

@mixin fig-ratio($ratio){
    width: 100%;
    aspect-ratio: $ratio;
    overflow: hidden;
    flex-shrink: 0;

    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@mixin hide-scrollbar(){
    scrollbar-width: none;      
    -ms-overflow-style: none;  
    &::-webkit-scrollbar {
        display: none;             
    }

}