/**
 * Common Template Animations
 *
 * Shared reveal animations for all template files
 * 
 * @package StatusInTrade
 * @since 1.0.0
 */

/* ==========================================================================
   Basic Reveal Animation
   ========================================================================== */

.reveal {
    opacity: 0;
    transform: translateY(50px);
    transition: all 1s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* ==========================================================================
   Reveal Variants
   ========================================================================== */

/**
 * Blur + Fade (for hero sections)
 */
.reveal-blur {
    opacity: 0;
    filter: blur(10px);
    transform: translateY(20px);
    transition: all 1.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal-blur.active {
    opacity: 1;
    filter: blur(0px);
    transform: translateY(0);
}

/**
 * Scale + Fade (for cards and sections)
 */
.reveal-scale {
    opacity: 0;
    transform: scale(0.92);
    transition: all 0.9s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal-scale.active {
    opacity: 1;
    transform: scale(1);
}

/**
 * Slide from Left
 */
.reveal-left {
    opacity: 0;
    transform: translateX(-60px);
    transition: all 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

/**
 * Slide from Right
 */
.reveal-right {
    opacity: 0;
    transform: translateX(60px);
    transition: all 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/**
 * Rotate + Fade (for special elements)
 */
.reveal-rotate {
    opacity: 0;
    transform: rotate(-5deg) scale(0.9);
    transition: all 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal-rotate.active {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

/**
 * Hide scrollbar for galleries
 */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* ==========================================================================
   Prose List Styling
   ========================================================================== */

/**
 * Custom checkmark bullets for prose lists
 */
.prose ul>li {
    position: relative;
    padding-left: 1.75em;
}

.prose ul>li::before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 0.2em;
    color: #84cc15;
    font-size: 0.9em;
    background: none;
    width: auto;
    height: auto;
    border-radius: 0;
}