////
///
/// Elastic Animations Mixin Module
/// ===========================================================================
///
/// Provides spring-like elastic animations with overshoot and bounce-back.
/// Uses cubic-bezier timing for natural, physics-based motion. Ideal for
/// playful UI interactions and attention-grabbing effects.
///
/// @group Animations
/// @author Scape Agency
/// @link https://move.gl
/// @since 0.1.0 initial release
/// @access public
///
////


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

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


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


///
/// Elastic Animation
/// ---------------------------------------------------------------------------
/// Creates an elastic animation where the element scales up and down in a
/// spring-like motion.
///
/// @name animate_elastic
/// @param {Number} $scale-start [0.5] - Starting scale of the element
/// @param {Number} $scale-end [1.25] - Scale at midpoint of animation
/// @param {Time} $duration [$animate_base_duration_slow] - Animation duration
/// @param {String} $timing_function - Elastic timing function
/// @param {Number|String} $iteration_count - Number of iterations
///
/// @example scss - Basic usage
///   .button {
///     @include animate_elastic;
///   }
///
@mixin animate_elastic(
    $scale-start: 0.5,
    $scale-end: 1.25,
    $duration: $animate_base_duration_slow,
    $timing_function: cubic-bezier(0.68, -0.55, 0.27, 1.55),
    $iteration_count: $animate_base_iteration_count
) {
    @include animate_base(
        animate_elastic,
        $duration,
        $timing_function,
        $iteration_count,
    );
    @keyframes animate_elastic {
        0%, 100% { transform: scale($scale-start); }
        50% { transform: scale($scale-end); }
    }
}
