/// This is equivalent to `flex-direction: row;`.
/// @example flex-direction: row;
/// @name .k-flex-row
/// @group flex-direction
/// @contextType css

/// This is equivalent to `flex-direction: row-reverse;`.
/// @example flex-direction: row-reverse;
/// @name .k-flex-row-reverse
/// @group flex-direction
/// @contextType css

/// This is equivalent to `flex-direction: column;`.
/// @example flex-direction: column;
/// @name .k-flex-col
/// @group flex-direction
/// @contextType css

/// This is equivalent to `flex-direction: column-reverse;`.
/// @example flex-direction: column-reverse;
/// @name .k-flex-col-reverse
/// @group flex-direction
/// @contextType css

// ============================================================================
// Responsive Flex Direction Utilities
// ============================================================================

/// This is equivalent to `flex-direction: row; for the specific breakpoint`.
/// @example flex-direction: row;
/// @name .k-flex-{xs|sm|md|lg|xl|xxl}-row
/// @group flex-direction-responsive
/// @contextType css

/// This is equivalent to `flex-direction: row-reverse; for the specific breakpoint`.
/// @example flex-direction: row-reverse;
/// @name .k-flex-{xs|sm|md|lg|xl|xxl}-row-reverse
/// @group flex-direction-responsive
/// @contextType css

/// This is equivalent to `flex-direction: column; for the specific breakpoint`.
/// @example flex-direction: column;
/// @name .k-flex-{xs|sm|md|lg|xl|xxl}-col
/// @group flex-direction-responsive
/// @contextType css

/// This is equivalent to `flex-direction: column-reverse; for the specific breakpoint`.
/// @example flex-direction: column-reverse;
/// @name .k-flex-{xs|sm|md|lg|xl|xxl}-col-reverse
/// @group flex-direction-responsive
/// @contextType css

@use "sass:map";
@use "../_globals.scss" as *;

// Register
@use "@progress/kendo-theme-core/scss/mixins/import-once.scss" as *;

@mixin kendo-utils--flex-grid--flex-direction() {
    @include import-once("utils-flex-grid-flex-direction") {

        // Flex direction utility classes
        $kendo-utils-flex-direction: map.get( $kendo-utils, "flex-direction" ) !default;
        @include generate-utils( flex, flex-direction, $kendo-utils-flex-direction );


        // Legacy aliases
        .#{$kendo-prefix}flex-column { @extend .#{$kendo-prefix}flex-col !optional; }
        .#{$kendo-prefix}flex-column-reverse { @extend .#{$kendo-prefix}flex-col-reverse !optional; }

    }
}

@mixin kendo-utils--flex-grid--flex-direction--responsive($key) {

    // Flex direction responsive utility classes
    $kendo-utils-flex-direction: map.get( $kendo-utils, "flex-direction" ) !default;
    @include generate-utils( flex-#{$key}, flex-direction, $kendo-utils-flex-direction, $important: false );

}