RocketChat/Rocket.Chat

@use 'sass:math';

@import '../../../styles/variables';

$message-container-margin: 0 0 $default-padding 0;
$message-container-compact-margin: 0 0 math.div($default-padding, 4) 0;

.message-container {
    display: flex;

    margin: $message-container-margin;
    justify-content: flex-start;

    &--compact {
        margin: $message-container-compact-margin;
    }

    &--reverse {
        flex-direction: row-reverse;
    }

    &--system {
        justify-content: center;
    }

    &-break {
        display: flex;
        flex-wrap: wrap;
    }
}