@import '@servicetitan/tokens/dist/tokens.less';

/* stylelint-disable declaration-property-value-no-unknown */
.messageRoot {
    display: grid;
    grid-template-areas: '. content .';
    grid-template-rows: auto;
    grid-template-columns: minmax(@spacing-5, auto) 1fr minmax(@spacing-5, auto);
    column-gap: @spacing-2;
    row-gap: @spacing-1;
    width: 100%;

    &.fullWidth {
        grid-template:
            'content' auto
            /
            1fr;
    }
}

.messageContent {
    grid-area: content;
    overflow-wrap: anywhere;
    justify-self: flex-start;
    width: 100%;
}