@use "@progress/kendo-theme-core/scss/components/tabstrip/_layout.scss" as *;
@use "./variables.scss" as *;

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

    .k-tabstrip-top > .k-tabstrip-items-wrapper {
        .k-tabstrip-item, .k-item {
            margin-block-end: 0;
            border-block-end-width: 0;
        }
        .k-tabstrip-item:active, .k-tabstrip-item.k-active,
        .k-item:active, .k-item.k-active {
            margin-block-end: if( $kendo-tabstrip-border-width, calc( -1 * $kendo-tabstrip-border-width ), null );
        }
    }

    .k-tabstrip-bottom > .k-tabstrip-items-wrapper {
        .k-tabstrip-item, .k-item {
            margin-block-start: 0;
            border-block-start-width: 0;
        }
        .k-tabstrip-item:active, .k-tabstrip-item.k-active,
        .k-item:active, .k-item.k-active {
            margin-block-start: if( $kendo-tabstrip-border-width, calc( -1 * $kendo-tabstrip-border-width ), null );
        }
    }

    .k-tabstrip-left > .k-tabstrip-items-wrapper {
        .k-tabstrip-item, .k-item {
            margin-right: 0;
            border-right-width: 0;
        }
        .k-tabstrip-item:active, .k-tabstrip-item.k-active,
        .k-item:active, .k-item.k-active {
            margin-right: if( $kendo-tabstrip-border-width, calc( -1 * $kendo-tabstrip-border-width ), null );
        }
    }

    .k-tabstrip-right > .k-tabstrip-items-wrapper {
        .k-tabstrip-item, .k-item {
            margin-left: 0;
            border-left-width: 0;
        }
        .k-tabstrip-item:active, .k-tabstrip-item.k-active,
        .k-item:active, .k-item.k-active {
            margin-left: if( $kendo-tabstrip-border-width, calc( -1 * $kendo-tabstrip-border-width ), null );
        }
    }

    .k-tabstrip-scrollable.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item {
        border-block-end-width: $kendo-tabstrip-item-border-width;
    }
    .k-tabstrip-scrollable.k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-tabstrip-item {
        border-block-start-width: $kendo-tabstrip-item-border-width;
    }
    .k-tabstrip-scrollable.k-tabstrip-left > .k-tabstrip-items-wrapper .k-tabstrip-item {
        border-inline-end-width: $kendo-tabstrip-item-border-width;
    }
    .k-tabstrip-scrollable.k-tabstrip-right > .k-tabstrip-items-wrapper .k-tabstrip-item {
        border-inline-start-width: $kendo-tabstrip-item-border-width;
    }
}