@use "sass:map";
@use "../core/_index.scss" as *;
@use "./_variables.scss" as *;

@mixin kendo-appbar--theme() {

    .k-appbar {
        --INTERNAL--kendo-appbar-text: var( --kendo-appbar-text, #{$kendo-appbar-text} );
        --INTERNAL--kendo-appbar-bg: var( --kendo-appbar-bg, #{$kendo-appbar-bg} );
        --INTERNAL--kendo-appbar-border: var( --kendo-appbar-border, #{$kendo-appbar-border} );

        color: var( --INTERNAL--kendo-appbar-text, inherit );
        background-color: var( --INTERNAL--kendo-appbar-bg, inherit );
        border-color: var( --INTERNAL--kendo-appbar-border, inherit );
    }

    .k-appbar-inherit {
        color: inherit;
        background-color: inherit;
        border-color: inherit;
    }

    // AppBar theme colors
    @each $theme-color, $color-props in $kendo-appbar-theme-colors {

        $_text: map.get( $color-props, text );
        $_bg: map.get( $color-props, bg );
        $_border: map.get( $color-props, border );

        .k-appbar-#{$theme-color} {
            --kendo-appbar-text: var( --kendo-appbar-#{$theme-color}-text, #{$_text} );
            --kendo-appbar-bg: var( --kendo-appbar-#{$theme-color}-bg, #{$_bg} );
            --kendo-appbar-border: var( --kendo-appbar-#{$theme-color}-border, #{$_border} );

            .k-appbar-subtitle {
                color: inherit;
            }
        }
    }

}