@use "./_variables.scss" as *;

@use "@progress/kendo-svg-icons/scss/index.scss" with (
    $ki-icon-size: var( --kendo-icon-size, 1rem )
);

@mixin kendo-icon--layout() {

    @include index.kendo-svg-icon-styles();

    // kendo-icon-wrapper component
    .k-icon-wrapper-host {
        display: contents;
    }

    .k-icon-with-modifier {
        position: relative;
        margin: .25em;
    }

    .k-icon.k-icon-modifier {
        width: 1em;
        height: 1em;
        position: absolute;
        font-size: .5em;
        bottom: 0;
        right: 0;
        margin: 0 -.5em -.5em 0;
    }

    .k-icon-action {
        display: inline-flex;
        padding: var( --kendo-icon-padding, .25rem );
        line-height: 1;
        align-items: center;
        vertical-align: middle;
        cursor: pointer;
    }

}