////
///
/// Stacks Mixins
/// ===========================================================================
///
/// Vertical and horizontal stack utility mixins for flex layouts.
///
/// @group Mixins.HeadLayout.Stacks
/// @author Scape Agency
/// @link https://scape.style
/// @since 0.1.0 initial release
/// @access public
///
////

@use "../flex/direction" as *;

// ============================================================================
// Stacks
// ============================================================================

/// Vertical stack mixin - column flex container
@mixin stack--vertical {
    @include flex--col;
    flex: 1 1 auto;
    align-self: stretch;
}

/// Horizontal stack mixin - row flex container with centered items
@mixin stack--horizontal {
    @include flex--row;
    align-items: center;
    align-self: stretch;
}

/// Vertical stack with gap
/// @param {Length} $gap - The gap between items
@mixin stack--vertical--gap($gap) {
    @include stack--vertical;
    gap: $gap;
}

/// Horizontal stack with gap
/// @param {Length} $gap - The gap between items
@mixin stack--horizontal--gap($gap) {
    @include stack--horizontal;
    gap: $gap;
}