/* Reaction Improvements - Move selected reactions to new line and increase size */

/* Move reaction display to its own line between post footer and comment box */
.post_foot_actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
}

.post_foot_actions .right_stats {
    width: 100% !important;
    display: block !important;
    order: 10 !important;
    margin-top: 12px !important;
}

.post_foot_actions .right_stats .post-actions {
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
    padding: 12px 15px !important;
    background: #f8f9fa !important;
    border-radius: 8px !important;
    line-height: 1.5 !important;
}

/* Increase size of reaction icons for better visibility */
.like-emo .how_reacted {
    width: 36px !important;
    height: 36px !important;
    padding: 5px !important;
    margin: 0 0 0 -10px !important;
}

.like-emo .how_reacted:nth-child(1) {
    margin-left: 0 !important;
}

.like-emo .how_reacted .inline_post_emoji {
    width: 26px !important;
    height: 26px !important;
}

.like-emo .how_reacted .inline_post_emoji > .reaction {
    width: 26px !important;
    height: 26px !important;
}

.like-emo .how_reacted .inline_post_emoji img {
    width: 26px !important;
    height: 26px !important;
}

/* Increase reaction count text size */
.like-emo .how_many_reacts {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-left: 10px !important;
    color: #555 !important;
}

/* Mobile specific adjustments */
@media (max-width: 768px) {
    .post-footer .right_stats .stats.post-actions {
        margin: 15px 0 10px 0 !important;
        padding: 12px 18px !important;
    }
    
    .like-emo .how_reacted {
        width: 40px !important;
        height: 40px !important;
        padding: 6px !important;
    }
    
    .like-emo .how_reacted .inline_post_emoji,
    .like-emo .how_reacted .inline_post_emoji > .reaction,
    .like-emo .how_reacted .inline_post_emoji img {
        width: 28px !important;
        height: 28px !important;
    }
    
    .like-emo .how_many_reacts {
        font-size: 17px !important;
    }
}
