@use '../../assets/styles/scss/index'  as *;

@mixin button-colors($bg, $fg, $brd) {
    background-color: $bg;
    color: $fg;
    fill: $fg;
    border-color: $brd;
}

@mixin borderStyle {
    border-width: 1px;
    border-style: solid;
}

.root {
    &.fill-solid {
        @include borderStyle();
        @include button-colors(var(--night300), var(--uui-tag-fill), var(--night300));
    }

    &.fill-white {
        @include borderStyle();
        @include button-colors(var(--white), var(--uui-tag-fill), var(--night300));
    }

    &.fill-none {
        @include borderStyle();
        @include button-colors(transparent, var(--uui-tag-fill), var(--night300));
    }
}
