.messages {line-height:1.6;}

/*phonecall styles */
.messages > .call:nth-child(odd) {
    display: flex;
    flex-direction: row;
    gap: 10px; 
	    align-items: start;
}

.messages > .call:nth-child(even) {
    display: flex;
    flex-direction: row;
    gap: 10px; 
	    align-items: start;
}

.messages > .call > .phonename {flex: 0 0 auto; 
    max-width: 50px;  }
.messages > .call > .phonemessage { flex: 2; }


.messages > .call:nth-child(odd) > .phonemessage {
    background-color: #ecebdc; /* light blue */
}


.messages > .call:nth-child(even) > .phonemessage {
    background-color: #cbd1d7; 
	text-align:left;/* light pink */
}


/*text styles */
.messages > .text:nth-child(odd) {
    display: flex;
    flex-direction: row;
    gap: 10px; 
	    align-items: start;
}

.messages > .text:nth-child(even) {
    display: flex;
    flex-direction: row-reverse;
    gap: 10px; 
	    align-items: start;
}

.messages > .text > .phonename {flex: 0 0 auto; 
    max-width: 50px;  }
.messages > .text > .phonemessage { flex: 2; }


.messages > .text:nth-child(odd) > .phonemessage {
    background-color: #ecebdc; /* light blue */
}


.messages > .text:nth-child(even) > .phonemessage {
    background-color: #cbd1d7; 
	text-align:right;/* light pink */
}