@use "sass:map";
@use "../core/index.scss" as *;
@use "@progress/kendo-theme-core/scss/components/tabstrip/_layout.scss" as *;
@use "../core/functions/index.scss" as *;
@use "./_variables.scss" as *;
@use "../core/z-index/index.scss" as *;


@mixin kendo-tabstrip--layout() {
    @include kendo-tabstrip--layout-base();

    .k-tabstrip {

        // TabStrip sizes
        @each $size, $size-props in $kendo-tabstrip-sizes {
            $_item-padding-x: map.get( $size-props, item-padding-x );

            #{k-when-default($kendo-tabstrip-default-size, $size)}
            &.k-tabstrip-#{$size} {
                .k-tabstrip-items {
                    .k-item-actions {
                        margin-inline-end: calc( #{$_item-padding-x} / 1.5 );
                    }
                }
            }
        }
    }

    .k-tabstrip-items-wrapper {
        .k-tabstrip-item,
        .k-item {
            &:focus,
            &.k-focus {
                z-index: k-z-index("base", 1);
            }
        }
    }

    .k-tabstrip-scrollable {
        &.k-tabstrip-top .k-tabstrip-items-wrapper {
            align-items: end;
        }

        &.k-tabstrip-bottom .k-tabstrip-items-wrapper {
            align-items: start;
        }
    }

}