// ============================================================================
// Poster
// ============================================================================

////
/// 
/// Float Animations Mixin Module
/// ===========================================================================
/// 
/// This module ...
/// 
/// 
/// @group Animations
/// @author Scape Agency
/// @link https://move.gl
/// @since 0.1.0 initial release
/// @todo None
/// @access public
/// 
////


// ============================================================================
// Use
// ============================================================================

@use "../dev" as *;
@use "../variables" as *;
@use "../keyframes" as *;
@use "base" as *;


// ============================================================================
// Mixins
// ============================================================================


///
/// Float Animation
/// Creates a floating animation where the element moves up and down smoothly.
/// 
/// @name animate_float
/// @param {Number|String} $start_position [0] - The starting position of the float animation.
/// @param {Number|String} $mid_position [10px] - The mid-position of the float animation.
/// @param {Number|String} $end_position [0] - The ending position of the float animation.
/// @param {Number|String} $duration [$animate_base_duration_slow] - The duration of the float animation.
/// @param {String} $timing_function [ease-in-out] - The timing function for the float animation.
/// @param {Number|String} $iteration_count [$animate_base_iteration_count] - The number of iterations the animation will run.
///
@mixin animate_float(
    $start_position: 0,
    $mid_position: 10px,
    $end_position: 0,
    $duration: $animate_base_duration_slow,
    $timing_function: ease-in-out,
    $iteration_count: $animate_base_iteration_count
) {
    @include animate_base(
        animate_float,
        $duration,
        $timing_function,
        $iteration_count,
    );
    @keyframes animate_float {
        0%, 100% { transform: translateY($start_position); }
        50% { transform: translateY($mid_position); }
    }
}

///
/// Float with Horizontal Movement
/// Creates a floating animation where the element moves horizontally.
/// 
/// @name animate_float_horizontal
/// @param {Number|String} $horizontal-distance [10px] - The distance the element moves horizontally.
/// @param {Number|String} $duration [$animate_base_duration_slow] - The duration of the float animation.
/// @param {String} $timing_function [ease-in-out] - The timing function for the float animation.
/// @param {Number|String} $iteration_count [$animate_base_iteration_count] - The number of iterations the animation will run.
///
@mixin animate_float_horizontal(
    $horizontal-distance: 10px,
    $duration: $animate_base_duration_slow,
    $timing_function: ease-in-out,
    $iteration_count: $animate_base_iteration_count
) {
    @include animate_base(
        animate_float_horizontal,
        $duration,
        $timing_function,
        $iteration_count,
    );
    @keyframes animate_float_horizontal {
        0%, 100% { transform: translateX(0); }
        50% { transform: translateX($horizontal-distance); }
    }
}


///
/// Float with Rotation
/// Creates a floating animation where the element moves up and down with a
/// rotation.
/// 
/// @name animate_float_rotate
/// @param {Number|String} $rotation_angle [15deg] - The angle of rotation during the float animation.
/// @param {Number|String} $duration [$animate_base_duration_slow] - The duration of the float animation.
/// @param {String} $timing_function [ease-in-out] - The timing function for the float animation.
/// @param {Number|String} $iteration_count [$animate_base_iteration_count] - The number of iterations the animation will run.
///
@mixin animate_float_rotate(
    $rotation_angle: 15deg,
    $duration: $animate_base_duration_slow,
    $timing_function: ease-in-out,
    $iteration_count: $animate_base_iteration_count
) {
    @include animate_base(
        animate_float_rotate,
        $duration,
        $timing_function,
        $iteration_count,
    );
    @keyframes animate_float_rotate {
        0%, 100% { transform: translateY(0) rotate(0); }
        50% { transform: translateY(-10px) rotate($rotation_angle); }
    }
}