@use '../core/styles/common/tokens' as *;

@mixin kbq-badge-style($type, $sub-type, $style-name) {
    $base-path: badge-#{$type}-#{$sub-type}-#{$style-name};

    color: var(--kbq-#{$base-path}-color);
    background: var(--kbq-#{$base-path}-background);

    & .kbq-badge-caption {
        color: var(--kbq-#{$base-path}-caption);
    }

    & .kbq-icon.kbq-empty {
        color: var(--kbq-#{$base-path}-icon);
    }

    @if $type == filled {
        border: transparent;
    } @else {
        border-color: var(--kbq-#{$base-path}-border);
    }
}

@mixin kbq-badge-theme() {
    .kbq-badge-filled {
        &.kbq-badge_fade-contrast {
            @include kbq-badge-style(filled, fade-on, contrast);
        }

        &.kbq-badge_fade-theme {
            @include kbq-badge-style(filled, fade-on, theme);
        }

        &.kbq-badge_fade-success {
            @include kbq-badge-style(filled, fade-on, success);
        }

        &.kbq-badge_fade-warning {
            @include kbq-badge-style(filled, fade-on, warning);
        }

        &.kbq-badge_fade-error {
            @include kbq-badge-style(filled, fade-on, error);
        }

        &.kbq-badge_contrast {
            @include kbq-badge-style(filled, fade-off, contrast);
        }

        &.kbq-badge_theme {
            @include kbq-badge-style(filled, fade-off, theme);
        }

        &.kbq-badge_success {
            @include kbq-badge-style(filled, fade-off, success);
        }

        &.kbq-badge_warning {
            @include kbq-badge-style(filled, fade-off, warning);
        }

        &.kbq-badge_error {
            @include kbq-badge-style(filled, fade-off, error);
        }

        &.kbq-badge_disabled {
            @include kbq-badge-style(filled, fade-off, disabled);
        }
    }

    .kbq-badge-outline {
        &.kbq-badge_fade-contrast {
            @include kbq-badge-style(outline, fade-on, contrast);
        }

        &.kbq-badge_fade-theme {
            @include kbq-badge-style(outline, fade-on, theme);
        }

        &.kbq-badge_fade-success {
            @include kbq-badge-style(outline, fade-on, success);
        }

        &.kbq-badge_fade-warning {
            @include kbq-badge-style(outline, fade-on, warning);
        }

        &.kbq-badge_fade-error {
            @include kbq-badge-style(outline, fade-on, error);
        }

        &.kbq-badge_disabled {
            @include kbq-badge-style(outline, fade-on, disabled);
        }
    }
}

@mixin kbq-badge-typography() {
    .kbq-badge {
        @include kbq-typography-level-to-styles-css-variables(typography, text-normal-medium);

        & .kbq-badge-caption {
            @include kbq-typography-level-to-styles-css-variables(typography, text-normal);
        }
    }

    .kbq-badge_compact {
        @include kbq-typography-level-to-styles-css-variables(typography, text-compact-medium);

        & .kbq-badge-caption {
            @include kbq-typography-level-to-styles-css-variables(typography, text-compact);
        }
    }
}