// ============================================================================
// move.gl | Nod Keyframes
// ============================================================================
// Copyright 2025 Scape Agency BV
// Licensed under MIT License
// ============================================================================

////
/// Nod Keyframes Module
/// ===========================================================================
///
/// Provides parameterized keyframe mixins for nod animations.
/// Rotates elements on the X-axis to simulate nodding gestures.
///
/// @group Keyframes
/// @author Scape Agency
/// @link https://move.gl
/// @since 0.1.0 initial release
/// @access public
////


// ============================================================================
// Keyframes
// ============================================================================


///
/// Nod Keyframes
/// @name keyframes_animate_nod
/// @param {Angle} $angle [10deg] - The angle of rotation.
///
@mixin keyframes_animate_nod($angle: $animate_angle_nod) {
    @keyframes animate_nod {
        0%, 100% { transform: rotateX(0deg); }
        50% { transform: rotateX($angle); }
    }
}


///
/// Nod Slow Keyframes
/// @name keyframes_animate_nod_slow
/// @param {Angle} $angle [10deg] - The angle of rotation.
///
@mixin keyframes_animate_nod_slow($angle: $animate_angle_nod) {
    @keyframes animate_nod_slow {
        0%, 100% { transform: rotateX(0deg); }
        50% { transform: rotateX($angle); }
    }
}


///
/// Nod Bounce Keyframes
/// @name keyframes_animate_nod_bounce
/// @param {Angle} $angle [10deg] - The angle of rotation.
/// @param {Length} $bounce_height [5px] - The height of the bounce.
///
@mixin keyframes_animate_nod_bounce($angle: $animate_angle_nod, $bounce_height: $animate_translate_nod_bounce) {
    @keyframes animate_nod_bounce {
        0%, 100% { transform: rotateX(0deg) translateY(0); }
        50% { transform: rotateX($angle) translateY(-$bounce_height); }
    }
}


///
/// Nod Continuous Keyframes
/// @name keyframes_animate_nod_continuous
/// @param {Angle} $angle [10deg] - The angle of rotation.
///
@mixin keyframes_animate_nod_continuous($angle: $animate_angle_nod) {
    @keyframes animate_nod_continuous {
        0% { transform: rotateX(0deg); }
        25%, 75% { transform: rotateX($angle); }
        50%, 100% { transform: rotateX(-$angle); }
    }
}