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

@mixin kendo-action-buttons--layout() {
    .k-actions {
        padding-inline: var( --kendo-actions-padding-x, #{$kendo-actions-padding-x} );
        padding-block: var( --kendo-actions-padding-y, #{$kendo-actions-padding-y} );
        box-sizing: border-box;
        border-width: var( --kendo-actions-border-width, #{$kendo-actions-border-width} ) 0 0 0;
        border-style: solid;
        border-color: inherit;
        flex-shrink: 0;
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
        gap: var( --kendo-actions-button-spacing, #{$kendo-actions-button-spacing} );
        overflow: hidden;

        *,
        *::before,
        *::after {
            box-sizing: border-box;
        }
    }

    // Aliases
    .k-edit-buttons,
    .k-action-buttons,
    .k-columnmenu-actions {
        @extend .k-actions !optional;
    }

    // Actions align
    .k-actions-start {
        justify-content: flex-start;
    }
    .k-actions-center {
        justify-content: center;
    }
    .k-actions-end {
        justify-content: flex-end;
    }
    .k-actions-justify {
        justify-content: space-between;
    }
    .k-actions-stretched > * {
        flex: 1 0 0%;
    }

    // Actions orientation
    .k-actions-horizontal {
        width: 100%;
        flex-flow: row nowrap;
    }
    .k-actions-vertical {
        flex-flow: column nowrap;
        align-items: normal;
    }
}
